Web app - Heightmap grayscale image to G-Code

Post Reply
stephenjbell
Posts: 25
Joined: Mon Nov 04, 2013 5:16 am

Web app - Heightmap grayscale image to G-Code

Post by stephenjbell » Wed Jan 01, 2014 8:46 pm

I'm thinking about creating a web app that will take a heightmap (a grayscale image where brightness = height) and convert it into g-code that would be usable by the Shapeoko for creating full 3D images and parts.

It looks like some products like this already exist (like diyCAM - http://shapeoko.com/forum/viewtopic.php ... 14&p=16838), but they generally cost money and are Windows-only.

I'm a web designer/developer by trade, and have already done a proof-of-concept that this is possible. This was done two years ago when I was first learning about CNC, so it's VERY ugly, rough and has numerous problems:

http://dl.dropboxusercontent.com/u/1132 ... index.html

Example made with the page above:
heightmap-to-gcode.jpg
heightmap-to-gcode.jpg (64.68 KiB) Viewed 4144 times
Features I would like to implement:

- Compensate for drill diameter automatically - Test each pixel to see if there are other pixels within the drill radius that are higher. If there is, raise pixel value to that number.
- Multiple passes - 1. Roughing pass with steps down (larger bit?). 2. Back and forth passes in two different directions for details and polishing (smaller bit?).
- Resolution independence - Source image width/height could be different than number of passes. Interpolating between pixels to ensure that everything is smooth, and so we can do as many horizontal passes as we like, even over low-res artwork.
- Ignore areas - Find a way of telling the program to ignore entire sections of pixels that we don't want to cut. Mark these with image transparency or bright color?
- Full depth areas - Cut all the way through the piece, regardless of other cutting depths. Mark these with image transparency or bright color?
- Units - Use inches or mm.


This is just a hobby for me, so I would like to open-source this. I would see it as being a bitmap-based equivalent to MakerCam. I think something that this would be helpful to a lot of people, and make the software aspect of CNC a little more accessible.

I'm not entirely sure that a web browser will let me use the system resources I would need to make all of the features above happen. If it won't, I'll fall back to my other idea of writing a Python desktop application.

Does anything like this exist already, and I've just missed it? Any other features that you think would be useful?

WillAdams
Posts: 8533
Joined: Mon Apr 09, 2012 6:11 pm
Location: Pennsylvania --- south of the Turnpike, East of US-15
Contact:

Re: Web app - Heightmap grayscale image to G-Code

Post by WillAdams » Wed Jan 01, 2014 10:55 pm

Shapeoko 3XL #0006 w/Makita RT0701 Router w/0.125″ and ¼″ Elaire precision collets
Nomad 883 Pro #596 (bamboo)

ybanrab
Posts: 17
Joined: Fri Jul 05, 2013 8:17 pm

Re: Web app - Heightmap grayscale image to G-Code

Post by ybanrab » Wed Jan 08, 2014 8:45 am

You can get access to the local filesystem through the HTML5 File API: http://www.html5rocks.com/en/tutorials/file/filesystem/
You *could* even implement direct machine control through Chrome's Serial API (if you develop your web-app as a Chrome App) http://developer.chrome.com/apps/serial.html

I've also been thinking along similar lines. I'm partway through an image->halftone GCode page: http://www.barny.org.uk/halftone/

You can drag a file from the desktop onto the lefthand empty box (or click one of the images on the page)

If you look at the source, there's examples of grabbing file info and reading it out as greyscale data, which would be similar to what you'd be doing.

I now need to do the output to GCode section of the app :)

ralston4
Posts: 49
Joined: Wed Dec 04, 2013 2:30 am

Re: Web app - Heightmap grayscale image to G-Code

Post by ralston4 » Thu Jan 09, 2014 3:58 am

I've been creating carving patterns using gimp for quite some time now. I've come up with ways of doing just about anything in the creation of height map bas-relief images. I sell patterns on ebay and have a few regular customers who seek me out for pattern creation. I'm interested in seeing what you come up with for turning raster height maps into gcode.

I wish someone could come up with a program that could be used as a 3D viewer for height maps. I'm currently building my own machine using parts purchased from inventables.com. I will be trying to figure out how to use Linux software because I like that you can import raster images and turn it into a back and forth raster carving gcode.

criznach
Posts: 220
Joined: Sat Dec 14, 2013 5:28 pm
Location: Great Falls, Montana, USA

Re: Web app - Heightmap grayscale image to G-Code

Post by criznach » Thu Jan 09, 2014 5:18 am

I've also been thinking along similar lines. I'm partway through an image->halftone GCode page: http://www.barny.org.uk/halftone/
The halftone thing looks really cool! Is it generating gcode yet?

ybanrab
Posts: 17
Joined: Fri Jul 05, 2013 8:17 pm

Re: Web app - Heightmap grayscale image to G-Code

Post by ybanrab » Thu Jan 09, 2014 8:11 am

The Halftone code isn't generating GCode yet, so that'll be the next step. I've just been for a play with your app, looks really cool! Seeing this thread has reminded me about this, so i'll have a pop at GCode generation soon. My CNC machine is still drawing with a pen, rather than cutting with anything, so the need for this hasn't yet been that great, but my spindle is nearly done, so I'll hopefully get to try it out soon

Given how much you can now do in-browser, I'd not be surprised to see a number of this kind of tool pop up over the next year to two. I'd love to try machine control from Chrome :)

Barny

ralston4
Posts: 49
Joined: Wed Dec 04, 2013 2:30 am

Re: Web app - Heightmap grayscale image to G-Code

Post by ralston4 » Thu Jan 09, 2014 7:24 pm

stephenjbell wrote:I'm thinking about creating a web app that will take a heightmap (a grayscale image where brightness = height) and convert it into g-code that would be usable by the Shapeoko for creating full 3D images and parts.

It looks like some products like this already exist (like diyCAM - http://shapeoko.com/forum/viewtopic.php ... 14&p=16838), but they generally cost money and are Windows-only.

I'm a web designer/developer by trade, and have already done a proof-of-concept that this is possible. This was done two years ago when I was first learning about CNC, so it's VERY ugly, rough and has numerous problems:



This is just a hobby for me, so I would like to open-source this. I would see it as being a bitmap-based equivalent to MakerCam. I think something that this would be helpful to a lot of people, and make the software aspect of CNC a little more accessible.

I'm not entirely sure that a web browser will let me use the system resources I would need to make all of the features above happen. If it won't, I'll fall back to my other idea of writing a Python desktop application.

Does anything like this exist already, and I've just missed it? Any other features that you think would be useful?
Hi stephenjbell

I would like to see a python app myself.

This guy made a script for me that I use inside gimp that allows me to tapper edges of every part of an image that automatically allows for a pencil shaped carving bit. I've heard that this is called draft in by some.

I usually create raster carving patterns that have the whole depth in mind so that when I want to make something carve all the way through a board it is already deep enough to do that. Are you going to add some sort of depth control?

I have a way of adding feathering or tapering around carving patterns that take the carving bit down to the depth before carving. It's fairly easy with gimp. I also have a way of making tabs to hold things in place for cutouts.

I wonder if your thinking at all about adding control to specify how tight the passes are going back and forth.

Alan

doxie
Posts: 11
Joined: Wed Apr 29, 2015 12:49 am

Re: Web app - Heightmap grayscale image to G-Code

Post by doxie » Wed Jul 20, 2016 3:41 pm

I know that this thread is old, but looking for "grayscale to gcode" turns up very few hits on the forum. Did this project ever get completed? I'm looking at converting images to carving files without spending 1000+ USD for a program.

Thanks,

Doxie

WillAdams
Posts: 8533
Joined: Mon Apr 09, 2012 6:11 pm
Location: Pennsylvania --- south of the Turnpike, East of US-15
Contact:

Re: Web app - Heightmap grayscale image to G-Code

Post by WillAdams » Wed Jul 20, 2016 3:56 pm

List of free / opensource apps for this here:

http://www.shapeoko.com/wiki/index.php/CAM#Images
Shapeoko 3XL #0006 w/Makita RT0701 Router w/0.125″ and ¼″ Elaire precision collets
Nomad 883 Pro #596 (bamboo)

ijv
Posts: 71
Joined: Sun Apr 06, 2014 10:41 am

Re: Web app - Heightmap grayscale image to G-Code

Post by ijv » Sun Jul 24, 2016 6:24 am

Another similar app that I came across just the other day is Image to 3D Converter by ClonerBox.

It does a great job of converting jpg or png images to stl files which can then be imported into CAM software like CamBam or others.

Post Reply