This might actually work. . Binary STL files only.

This might actually work. . Binary STL files only. Drag and drop is the only way to load right now.

I so want file browsing based file selection.

Hey! That looks pretty nice! Is your plan to incorporate a slicer and g-code sender? (which I guess could probably just be SPJS)

Not a slicer, a CAM for prismatic parts on milling machines.

This looks amazing. @raykholo ​ had something working like this too recently. You guys should collaborate.

+Peter van der Walt I’m using threejs’s STL loader, pulling out the triangles I’m interested in, then converting those to clipperjs.

@Todd_Fleming The STL Widget so far is here:
You can drag in an STL file, fiddle with some parameters, and hit slice. It recompiles all the individual ThreeJS geometries and sends them as a master STL to a slic3r service running on my server and you should get gcode back in a few minutes. Really slow. And you need to have CORS enabled (there’s an extension in chrome) otherwise the AJAX call will fail. I really want the slicing to happen on the client side, until we have that I really don’t see much use in continuing (but we still need to be able to drag the individual STLs around, and do transfomations like scaling, rotation, multiply parts, everything you’d find in a program like Repetier Host.

I wonder how @Stewart_Allen is doing on the Kiri Slicer, otherwise we may need to rewrite MatterSlice from C++ into Javascript.

@raykholo The nice thing about milling prismatic parts is that I won’t have to worry about slicing; I just discard triangles which aren’t parallel to the XY plane then convert that to jsclipper. Is it possible to build MatterSlice into JS using emscipten? That’s how I handled some parts of jscut (tabs and V pocketing)

@Todd_Fleming I remember running into emacipten, it was one of the top results when I was searching for c++ to js cross compilers, but I didn’t get into it/ much further. I did read a lot of the matter slice code though. It’s extremely clean and it’s just a combination of math, writing to variables/ strings (both of which are just syntactical differences) and clipper, which we obviously are familiar with.
Then just need to find the endpoint regarding STL in and Gcode out and set those up to our liking.

It looks like both the slicer and the prismatic widget will need:

  • Load STL files. Future: maybe more mesh formats; three.js supports a lot

  • A user interface for selecting, moving, rotating, resizing, and deleting meshes

  • A user interface for selecting mesh surfaces (prismatic)

  • A shortcut for moving meshes so either their tops (prismatic) or bottoms (slicer) are at Z=0

  • Future, if anyone’s willing to do it: mesh repair

Maybe we could build a common mesh widget that does the above, but no slicing or other gcode coversion. The gcode-conversion widgets could use its services.

You can iFrame Kiri right now. An API to drive it with message passing would be easy enough. That gives you all the UI bits including layout, rotation, scaling, mirroring, duplication as well as slice-layer (pre) and gcode-layer (post) visualization.

The problem with direct use of the slicer code is the fact that I’m using Workers to keep the UI thread responsive. This makes loading the code and dependencies (serialization, api, etc) more challenging than I had hoped. Things have been incredibly busy the last few weeks and no time has gone into supporting this use case. I’ll see if I can find a shortcut this week.

@Todd_Fleming between the two of our widgets I think we have enough cool features to advertise on some of the groups on g+ (3D Printing, CNC, etc…) and hopefully recruit a few programmers to do some work towards the cause.
@Stewart_Allen we’re all busy people, you know that I respect that and will appreciate whatever you come up with.

@Stewart_Allen is it possible to integrate it into ChilliPeppr’s 3D view? Also, what’s the URL? I should take a look. @raykholo I’ll take a look at your widget.


@Stewart_Allen I like the slicer visualization you show on

@raykholo nothing seems to happen when I hit the slice button. Is it a placeholder?

@Todd_Fleming it would be cool to add flyout menus over the 3D object as you mouse over it to then tweak settings of your widget like I did with the Svg2Gcode widget. Try out the “SVG Import” button in CP’s TinyG workspace to see what I mean. As you zoom in/out and move around in 3D viewer the flyout menus follow the 3D coordinates.

@jlauer Nice!

@Todd_Fleming you need CORS enabled and it can easily take a few minutes to get gcode back. But it does do a POST to my server and slic3r is invoked.
You’re experiencing all the problems that I want to overcome.

I started creating a Mesh widget; Prismatic now talks to it. It now supports both binary and ASCII STL.

As an aside, I’m using virtual-dom for widget bodies. I grew frustrated with jquery, knockout, templates, and similar techniques a few months ago and switched my day job’s projects to virtual-dom.