Nodejs thumbnailing service for 3D STL files. Creates beautifully rendered png and jpeg output server-side with no GPU from ASCII and Binary STL's.
npm install --save node-stl-thumbnailer
The following snippet loads a file from the current directory (./input.stl), and creates a 500x500 png thumbnail in the current directory called ./output.png.
var StlThumbnailer = require('node-stl-thumbnailer');
var fs = require('fs');
var thumbnailer = new StlThumbnailer({
filePath: __dirname + "/input.stl",
requestThumbnails: [
{
width: 500,
height: 500
}
]
})
.then(function(thumbnails){
// thumbnails is an array (in matching order to your requests) of Canvas objects
// you can write them to disk, return them to web users, etc
// see node-canvas documentation at https://github.com/Automattic/node-canvas
thumbnails[0].toBuffer(function(err, buf){
fs.writeFileSync(__dirname + "/output.png", buf);
})
})The code below creates a simple express-based web service that accepts the url of a public-on-the-internet STL, and responds with a 500x500 PNG representation of that STL.
// index.js
const { Canvas } = require("canvas");
const app = require("express")();
const StlThumbnailer = require("./index");
app.get('/thumbnailer', function(req, res, next) {
const thumbnailer = new StlThumbnailer({
url: req.query.url, // url OR filePath must be supplied, but not both
//filePath: "...", // load file from filesystem
requestThumbnails: [
{
width: 500,
height: 500,
}
]
})
.then(function(thumbnails){
// thumbnails is an array (in matching order to your requests) of Canvas objects
// you can write them to disk, return them to web users, etc
thumbnails[0].toBuffer(function(err, buf){
if (err) {
throw err;
}
res.contentType('image/png');
res.send(buf)
})
})
.catch(function(err){
res.status(500);
res.send("Error thumbnailing: "+err);
});
});
app.listen(3000, function () {
console.log('Listening on port 3000\n')
});Test your thumbnailer web-app by running node index.js and navigating to this url in your browser:
You should see this in your browser:
requestThumbnails is an array of thumbnail configuration options, most of which are optional. The only required parameters are width and height. The STL Object will be centered in the frame, and the frame will be chosen to make the objects fit. You can specify the angle of the camera as a vector (which will be normalized), but if left as the default a "front" view from slightly above will be chosen.
Configuration options (default values shown):
{
width: 500, // required: output width in pixels
height: 500, // required: output height in pixels
cameraAngle: [10,50,100], // optional: specify the angle of the view for thumbnailing. This is the camera's position vector, the opposite of the direction the camera is looking.
showMinorEdges: true, // optional: show all edges lightly, even ones on ~flat faces
metallicOpacity: 0, // optional: some models, particularly those with non-flat surfaces or very high-poly models will look good with this environment map
enhanceMajorEdges: true, // optional: major edges will appear more boldly than minor edges
shadeNormalsOpacity: 0.4, // optional: faces will be shaded lightly by their normal direction
backgroundColor: 0xffffff, // optional: background color (RGB) for the rendered image
baseOpacity: 0.7, // optional: translucency of the base material that lets you see through it
baseColor: 0xffffff, // optional: base color
baseLineweight: 0.7, // optional: lineweights will scale to image size, but this serves as a base for that scaling. Larger numbers = heavier lineweights
lineColor: 0x000000 // optional: color of the linework
}
Note that node-canvas is used under the hood as a rendering target. Node-canvas is backed by Cairo, which can be a little tricky to install. Get started here: https://github.com/Automattic/node-canvas