Try this Web Page G-code Viewer
I met programmer and maker, Joe Walnes, through a few local Chicago maker groups. He showed me a really cool web based G-code viewer he wrote to preview his 3D printer G-code. It used WebGL for super smooth motion of the model. It also allowed you to drag and drop your own files right into the page. It worked great, but really only worked with 3D printer G-code. He posted the code on GitHub.
I have a couple programming projects in the works that need a G-code viewer, so I decided to update his program to handle more types of programs. Joe had a really nice UI and design pattern for the code, so I left that alone. He also helped me out with a few issues as I worked.
G-code Parser
A parser is a bit of code that breaks down text into tokens, or the basic grammer of the G-code. He was working with very well formatted G-code so his parser was pretty simple.
G1 X5 Y5 Z6 E0.124
I was dealing with really Fugly lines of G-Code like this, so I needed to totally rewrite the parser.
N100G17G91G1X5Y5Z6M03S1000(comment)G1X5;comment
Graphics Generation
Reprap 3D printers basically use G1 (straight moves) for everything. I needed to add the code to handle G2 and G3 (arc moves). This was a little tricky because there are no arcs in WebGL. I had to break them into small line segments. Joe also treated each Z level as a separate layer. That is nice for printers, but not for general G-code. I changed that and the way the color of the lines worked.
A Work in Progress.
It works on all my CAM generated 3D printer and CNC router G-code, but I want to add code to deal with more advanced features that are often hand coded like incremental moves, machine offsets, parameters, math functions and subroutines.
I will post the source code soon.
Usage
You need a WebGL capable browser like Chrome, Opera or Firefox. I hard to turn on WebGL in my Firefox. I got it to run on my Android phone in Opera, but could not spin/zoom the model with the screen controls.
To view your own files, just drag and drop the G-code into the browser. It will use the zoom settings for the previous model, so if you drop something that is a different size or offset to the side you may need to zoom around to find it.
