viewof tpVizSpace = new Promise((resolve) => {
resolve(html`<div class="viz-space"></div>`);
}).then((domElement) => {
let materialParams = {
width: shopbotBedDims.width,
height: shopbotBedDims.height,
thickness: shelfThickness
};
let vizSpace = new VisualizationSpace(domElement, materialParams);
invalidation.then(() => vizSpace.removeAllViz());
domElement.value = vizSpace;
return domElement;
})
depth = [0, 0.25, 0.5, 0.75]
drawPolygon = (x_, y_, r_, sides_) => {
let x = (i) => {
return r_ * Math.cos((2 * Math.PI * i) / sides_) + x_;
};
let y = (i) => {
return r_ * Math.sin((2 * Math.PI * i) / sides_) + y_;
};
let xyVals_ = [];
for (let i = 0; i < sides_; ++i) {
xyVals_.push([x(i), y(i)]);
console.log(i);
}
return xyVals_;
}
xyVals = drawPolygon(origin_x, origin_y, radius, sides)
xyPlusDepth = (xyVals_, depth_) => {
return depth_
.map((d_) => {
return xyVals_.map((xypair_) => {
return [xypair_[0], xypair_[1], d_];
});
})
.flat();
}
fullpathstr = (toolpath_) => {
return toolpath_.map((triple_) => {
return `M3, ${triple_[0]}, ${triple_[1]}, ${triple_[2]}`;
});
}
fullpath = fullpathstr(xyPlusDepth(xyVals, depth))
populateVizSpace(tpVizSpace, [fullpath])
Inputs.button("Dispatch SBP code", {
reduce: (_) => {
sendSbpCodesToMachine([[]]);
}
})
shelfThickness = 0.5
shopbotBedDims = ({
width: 12,
height: 12
})
import { VisualizationSpace, populateVizSpace } from "@machine-agency/minishelf"
import { sendSbpCodesToMachine } from "@machine-agency/quickdraw-sketch-based-milling"
VisualizationSpace
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
