vmario/Doodle3D-Slicer
0
0
Fork 0
mirror of https://github.com/Doodle3D/Doodle3D-Slicer.git synced 2024-06-28 15:51:21 +02:00
Code Issues Projects Releases Wiki Activity

implement better viewer as example

Browse Source
This commit is contained in:
casperlamboo 2016-10-13 16:33:40 +02:00 committed by Simon Voordouw
parent 2fc909c45d
commit 18456a402a
7 changed files with 331 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
example/SlicerViewer.js Normal file
View File

@ -0,0 +1,45 @@
import React from 'react';
export default class SlicerViewer extends React.Component {
state = {
slice: 0
};
changeSlider = (event) => {
this.setState({
...this.state,
slice: parseInt(event.target.value)
});
};
render() {
const { slice } = this.state;
const { layerIntersectionPoints, settings, layerShapes } = this.props;
const numLayers = settings.dimensionsZ / settings.layerHeight;
const intersectionPoints = layerIntersectionPoints[slice + 1];
const shape = layerShapes[slice];
return (
<div>
<svg viewBox={`-20 -20 ${settings.dimensionsX + 40} ${settings.dimensionsX + 40}`}>
<rect
width={settings.dimensionsX}
height={settings.dimensionsY}
fill="lightGrey"
/>
{intersectionPoints.map(({ x, y }, i) => <circle key={i} cx={x} cy={y} r="0.3"/>)}
{shape && shape.closedShapes.map((closedShape, i) => (
<polygon
key={i}
points={closedShape.map(({ x, y }) => `${x} ${y}`).join(' ')}
fill="rgba(255, 0, 0, 0.5)"
/>
))}
</svg>
<input onChange={this.changeSlider} value={slice} type="range" min="0" max={numLayers} />
</div>
);
}
}

22
example/app.js
View File

@ -1,16 +1,24 @@
import THREE from 'three.js';
import * as SLICER from 'src/index';
import React from 'react';
import ReactDOM, { render } from 'react-dom';
import * as SLICER from 'src/index.js';
import generateRawData from './generateRawData.js';
import SlicerViewer from './SlicerViewer.js';
const settings = new SLICER.Settings({
...SLICER.printerSettings['ultimaker2go'],
...SLICER.userSettings
});
const geometry = new THREE.TorusGeometry(20, 10, 30, 30);
const geometry = new THREE.TorusGeometry(20, 10, 30, 30).clone();
geometry.applyMatrix(new THREE.Matrix4().setPosition(new THREE.Vector3(60, 0, 60)));
geometry.mergeVertices();
geometry.computeFaceNormals();
const slicer = new SLICER.Slicer();
const rawData = generateRawData(geometry, settings);
slicer.setGeometry(geometry);
slicer.slice(settings).then(gcode => {
document.getElementById('gcode').innerHTML = gcode.replace(/(?:\r\n|\r|\n)/g, '<br />');
});
render(<SlicerViewer
layerIntersectionPoints={rawData.layerIntersectionPoints}
layerShapes={rawData.layerShapes}
settings={settings.config}
/>, document.getElementById('container'));

54
example/generateRawData.js Normal file
View File

@ -0,0 +1,54 @@
import calculateLayersIntersections from 'src/sliceActions/calculateLayersIntersections.js';
import createLines from 'src/sliceActions/createLines.js';
import generateInfills from 'src/sliceActions/generateInfills.js';
import generateInnerLines from 'src/sliceActions/generateInnerLines.js';
import generateSupport from 'src/sliceActions/generateSupport.js';
import intersectionsToShapes from 'src/sliceActions/intersectionsToShapes.js';
import addBrim from 'src/sliceActions/addBrim.js';
import optimizePaths from 'src/sliceActions/optimizePaths.js';
import shapesToSlices from 'src/sliceActions/shapesToSlices.js';
import slicesToGCode from 'src/sliceActions/slicesToGCode.js';
import applyPrecision from 'src/sliceActions/applyPrecision.js';
import removePrecision from 'src/sliceActions/removePrecision.js';
export default function generateRawData(geometry, settings) {
const rawData = {};
const lines = createLines(geometry, settings);
const {
layerIntersectionIndexes,
layerIntersectionPoints
} = calculateLayersIntersections(lines, settings);
rawData.layerIntersectionPoints = layerIntersectionPoints
.map(intersectionPoints => intersectionPoints.map(intersectionPoint => intersectionPoint.clone()));
const layerShapes = intersectionsToShapes(layerIntersectionIndexes, layerIntersectionPoints, lines, settings);
rawData.layerShapes = layerShapes
.map(({ closedShapes, openShapes }) => ({
closedShapes: closedShapes.map(closedShape => closedShape.map(vector => vector.clone())),
openShapes: openShapes.map(openShape => openShape.map(vector => vector.clone()))
}));
applyPrecision(layerShapes);
const slices = shapesToSlices(layerShapes, settings);
generateInnerLines(slices, settings);
generateInfills(slices, settings);
generateSupport(slices, settings);
addBrim(slices, settings);
optimizePaths(slices, settings);
removePrecision(slices);
rawData.slices = slices;
const gcode = slicesToGCode(slices, settings);
rawData.gcode = gcode;
return rawData;
}

4
example/index.html
View File

@ -13,6 +13,8 @@
<script type="text/javascript" src="../jspm_packages/system.js"></script>
<script type="text/javascript" src="../jspm.config.js"></script>
<link href="main.css" rel="stylesheet"/>
<script type="text/javascript">
System.import('example/app.js');
</script>
@ -21,7 +23,7 @@
<body>
<p id="gcode"></p>
<div id="container"></div>
</body>
</html>

21
example/main.css Normal file
View File

@ -0,0 +1,21 @@
* {
margin: 0;
padding: 0;
}
#container {
position: relative;
}
#container, svg {
width: 100%;
height: 100%;
}
svg, input {
position: absolute;
}
input {
width: 100%;
}

228
jspm.config.js
View File

@ -2,6 +2,7 @@ SystemJS.config({
paths: {
"github:": "jspm_packages/github/",
"npm:": "jspm_packages/npm/",
"example/": "example/",
"slicer/": "src/"
},
browserConfig: {
@ -11,11 +12,107 @@ SystemJS.config({
"map": {
"babel-runtime": "npm:babel-runtime@5.8.38",
"core-js": "npm:core-js@1.2.7",
"plugin-babel": "npm:systemjs-plugin-babel@0.0.12"
"plugin-babel": "npm:systemjs-plugin-babel@0.0.12",
"react": "npm:react@15.3.2",
"domain": "github:jspm/nodelibs-domain@0.2.0-alpha",
"zlib": "github:jspm/nodelibs-zlib@0.2.0-alpha",
"https": "github:jspm/nodelibs-https@0.2.0-alpha",
"react-dom": "npm:react-dom@15.3.2",
"babel-plugin-transform-react-jsx": "npm:babel-plugin-transform-react-jsx@6.8.0"
},
"packages": {
"npm:babel-runtime@5.8.38": {
"map": {}
},
"npm:react@15.3.2": {
"map": {
"object-assign": "npm:object-assign@4.1.0",
"loose-envify": "npm:loose-envify@1.2.0",
"fbjs": "npm:fbjs@0.8.5"
}
},
"npm:fbjs@0.8.5": {
"map": {
"loose-envify": "npm:loose-envify@1.2.0",
"object-assign": "npm:object-assign@4.1.0",
"promise": "npm:promise@7.1.1",
"isomorphic-fetch": "npm:isomorphic-fetch@2.2.1",
"ua-parser-js": "npm:ua-parser-js@0.7.10",
"immutable": "npm:immutable@3.8.1",
"core-js": "npm:core-js@1.2.7"
}
},
"npm:loose-envify@1.2.0": {
"map": {
"js-tokens": "npm:js-tokens@1.0.3"
}
},
"npm:promise@7.1.1": {
"map": {
"asap": "npm:asap@2.0.5"
}
},
"npm:isomorphic-fetch@2.2.1": {
"map": {
"whatwg-fetch": "npm:whatwg-fetch@1.0.0",
"node-fetch": "npm:node-fetch@1.6.3"
}
},
"npm:node-fetch@1.6.3": {
"map": {
"encoding": "npm:encoding@0.1.12",
"is-stream": "npm:is-stream@1.1.0"
}
},
"npm:encoding@0.1.12": {
"map": {
"iconv-lite": "npm:iconv-lite@0.4.13"
}
},
"github:jspm/nodelibs-domain@0.2.0-alpha": {
"map": {
"domain-browserify": "npm:domain-browser@1.1.7"
}
},
"github:jspm/nodelibs-zlib@0.2.0-alpha": {
"map": {
"zlib-browserify": "npm:browserify-zlib@0.1.4"
}
},
"npm:browserify-zlib@0.1.4": {
"map": {
"readable-stream": "npm:readable-stream@2.1.5",
"pako": "npm:pako@0.2.9"
}
},
"npm:babel-plugin-transform-react-jsx@6.8.0": {
"map": {
"babel-helper-builder-react-jsx": "npm:babel-helper-builder-react-jsx@6.9.0",
"babel-plugin-syntax-jsx": "npm:babel-plugin-syntax-jsx@6.13.0",
"babel-runtime": "npm:babel-runtime@6.11.6"
}
},
"npm:babel-helper-builder-react-jsx@6.9.0": {
"map": {
"babel-runtime": "npm:babel-runtime@6.11.6",
"esutils": "npm:esutils@2.0.2",
"babel-types": "npm:babel-types@6.16.0",
"lodash": "npm:lodash@4.16.4"
}
},
"npm:babel-runtime@6.11.6": {
"map": {
"core-js": "npm:core-js@2.4.1",
"regenerator-runtime": "npm:regenerator-runtime@0.9.5"
}
},
"npm:babel-types@6.16.0": {
"map": {
"lodash": "npm:lodash@4.16.4",
"babel-runtime": "npm:babel-runtime@6.11.6",
"esutils": "npm:esutils@2.0.2",
"to-fast-properties": "npm:to-fast-properties@1.0.2"
}
}
}
},
@ -23,6 +120,21 @@ SystemJS.config({
packages: {
"slicer": {
"main": "index.js"
},
"example": {
"main": "example/index.js",
"format": "esm",
"meta": {
"*.js": {
"loader": "plugin-babel",
"babelOptions": {
"stage1": true,
"plugins": [
"babel-plugin-transform-react-jsx"
]
}
}
}
}
},
map: {
@ -91,12 +203,12 @@ SystemJS.config({
},
"github:jspm/nodelibs-http@0.2.0-alpha": {
"map": {
"http-browserify": "npm:stream-http@2.3.1"
"http-browserify": "npm:stream-http@2.4.0"
}
},
"npm:stream-browserify@2.0.1": {
"map": {
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"readable-stream": "npm:readable-stream@2.1.5"
}
},
@ -107,18 +219,9 @@ SystemJS.config({
},
"npm:buffer@4.9.1": {
"map": {
"base64-js": "npm:base64-js@1.1.2",
"base64-js": "npm:base64-js@1.2.0",
"isarray": "npm:isarray@1.0.0",
"ieee754": "npm:ieee754@1.1.6"
}
},
"npm:stream-http@2.3.1": {
"map": {
"inherits": "npm:inherits@2.0.1",
"readable-stream": "npm:readable-stream@2.1.5",
"builtin-status-codes": "npm:builtin-status-codes@2.0.0",
"to-arraybuffer": "npm:to-arraybuffer@1.0.1",
"xtend": "npm:xtend@4.0.1"
"ieee754": "npm:ieee754@1.1.8"
}
},
"npm:url@0.11.0": {
@ -130,7 +233,7 @@ SystemJS.config({
"npm:readable-stream@2.1.5": {
"map": {
"string_decoder": "npm:string_decoder@0.10.31",
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"isarray": "npm:isarray@1.0.0",
"buffer-shims": "npm:buffer-shims@1.0.0",
"core-util-is": "npm:core-util-is@1.0.2",
@ -140,11 +243,11 @@ SystemJS.config({
},
"npm:crypto-browserify@3.11.0": {
"map": {
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"browserify-cipher": "npm:browserify-cipher@1.0.0",
"create-hash": "npm:create-hash@1.1.2",
"browserify-sign": "npm:browserify-sign@4.0.0",
"pbkdf2": "npm:pbkdf2@3.0.4",
"pbkdf2": "npm:pbkdf2@3.0.9",
"public-encrypt": "npm:public-encrypt@4.0.0",
"randombytes": "npm:randombytes@2.0.3",
"diffie-hellman": "npm:diffie-hellman@5.0.2",
@ -155,19 +258,19 @@ SystemJS.config({
"npm:browserify-sign@4.0.0": {
"map": {
"create-hash": "npm:create-hash@1.1.2",
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"create-hmac": "npm:create-hmac@1.1.4",
"parse-asn1": "npm:parse-asn1@5.0.0",
"elliptic": "npm:elliptic@6.3.1",
"elliptic": "npm:elliptic@6.3.2",
"bn.js": "npm:bn.js@4.11.6",
"browserify-rsa": "npm:browserify-rsa@4.0.1"
}
},
"npm:create-hash@1.1.2": {
"map": {
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"ripemd160": "npm:ripemd160@1.0.1",
"cipher-base": "npm:cipher-base@1.0.2",
"cipher-base": "npm:cipher-base@1.0.3",
"sha.js": "npm:sha.js@2.4.5"
}
},
@ -180,11 +283,6 @@ SystemJS.config({
"browserify-rsa": "npm:browserify-rsa@4.0.1"
}
},
"npm:pbkdf2@3.0.4": {
"map": {
"create-hmac": "npm:create-hmac@1.1.4"
}
},
"npm:diffie-hellman@5.0.2": {
"map": {
"randombytes": "npm:randombytes@2.0.3",
@ -195,7 +293,7 @@ SystemJS.config({
"npm:create-hmac@1.1.4": {
"map": {
"create-hash": "npm:create-hash@1.1.2",
"inherits": "npm:inherits@2.0.1"
"inherits": "npm:inherits@2.0.3"
}
},
"npm:browserify-cipher@1.0.0": {
@ -207,23 +305,23 @@ SystemJS.config({
},
"npm:create-ecdh@4.0.0": {
"map": {
"elliptic": "npm:elliptic@6.3.1",
"elliptic": "npm:elliptic@6.3.2",
"bn.js": "npm:bn.js@4.11.6"
}
},
"npm:parse-asn1@5.0.0": {
"map": {
"create-hash": "npm:create-hash@1.1.2",
"pbkdf2": "npm:pbkdf2@3.0.4",
"pbkdf2": "npm:pbkdf2@3.0.9",
"browserify-aes": "npm:browserify-aes@1.0.6",
"evp_bytestokey": "npm:evp_bytestokey@1.0.0",
"asn1.js": "npm:asn1.js@4.8.0"
"asn1.js": "npm:asn1.js@4.8.1"
}
},
"npm:browserify-des@1.0.0": {
"map": {
"inherits": "npm:inherits@2.0.1",
"cipher-base": "npm:cipher-base@1.0.2",
"inherits": "npm:inherits@2.0.3",
"cipher-base": "npm:cipher-base@1.0.3",
"des.js": "npm:des.js@1.0.0"
}
},
@ -236,27 +334,14 @@ SystemJS.config({
"map": {
"create-hash": "npm:create-hash@1.1.2",
"evp_bytestokey": "npm:evp_bytestokey@1.0.0",
"inherits": "npm:inherits@2.0.1",
"cipher-base": "npm:cipher-base@1.0.2",
"inherits": "npm:inherits@2.0.3",
"cipher-base": "npm:cipher-base@1.0.3",
"buffer-xor": "npm:buffer-xor@1.0.3"
}
},
"npm:elliptic@6.3.1": {
"map": {
"bn.js": "npm:bn.js@4.11.6",
"inherits": "npm:inherits@2.0.1",
"hash.js": "npm:hash.js@1.0.3",
"brorand": "npm:brorand@1.0.5"
}
},
"npm:cipher-base@1.0.2": {
"map": {
"inherits": "npm:inherits@2.0.1"
}
},
"npm:sha.js@2.4.5": {
"map": {
"inherits": "npm:inherits@2.0.1"
"inherits": "npm:inherits@2.0.3"
}
},
"npm:browserify-rsa@4.0.1": {
@ -268,31 +353,58 @@ SystemJS.config({
"npm:miller-rabin@4.0.0": {
"map": {
"bn.js": "npm:bn.js@4.11.6",
"brorand": "npm:brorand@1.0.5"
"brorand": "npm:brorand@1.0.6"
}
},
"npm:des.js@1.0.0": {
"map": {
"inherits": "npm:inherits@2.0.1",
"minimalistic-assert": "npm:minimalistic-assert@1.0.0"
}
},
"npm:asn1.js@4.8.0": {
"map": {
"bn.js": "npm:bn.js@4.11.6",
"inherits": "npm:inherits@2.0.1",
"inherits": "npm:inherits@2.0.3",
"minimalistic-assert": "npm:minimalistic-assert@1.0.0"
}
},
"npm:hash.js@1.0.3": {
"map": {
"inherits": "npm:inherits@2.0.1"
"inherits": "npm:inherits@2.0.3"
}
},
"github:jspm/nodelibs-os@0.2.0-alpha": {
"map": {
"os-browserify": "npm:os-browserify@0.2.1"
}
},
"npm:pbkdf2@3.0.9": {
"map": {
"create-hmac": "npm:create-hmac@1.1.4"
}
},
"npm:elliptic@6.3.2": {
"map": {
"bn.js": "npm:bn.js@4.11.6",
"inherits": "npm:inherits@2.0.3",
"brorand": "npm:brorand@1.0.6",
"hash.js": "npm:hash.js@1.0.3"
}
},
"npm:cipher-base@1.0.3": {
"map": {
"inherits": "npm:inherits@2.0.3"
}
},
"npm:asn1.js@4.8.1": {
"map": {
"bn.js": "npm:bn.js@4.11.6",
"inherits": "npm:inherits@2.0.3",
"minimalistic-assert": "npm:minimalistic-assert@1.0.0"
}
},
"npm:stream-http@2.4.0": {
"map": {
"inherits": "npm:inherits@2.0.3",
"readable-stream": "npm:readable-stream@2.1.5",
"to-arraybuffer": "npm:to-arraybuffer@1.0.1",
"builtin-status-codes": "npm:builtin-status-codes@2.0.0",
"xtend": "npm:xtend@4.0.1"
}
}
}
});

25
package.json
View File

@ -12,9 +12,15 @@
"worker": "github:casperlamboo/plugin-worker@master"
},
"devDependencies": {
"babel-plugin-transform-react-jsx": "npm:babel-plugin-transform-react-jsx@^6.8.0",
"babel-runtime": "npm:babel-runtime@^5.1.13",
"core-js": "npm:core-js@^1.2.0",
"plugin-babel": "npm:systemjs-plugin-babel@^0.0.12"
"domain": "github:jspm/nodelibs-domain@^0.2.0-alpha",
"https": "github:jspm/nodelibs-https@^0.2.0-alpha",
"plugin-babel": "npm:systemjs-plugin-babel@^0.0.12",
"react": "npm:react@^15.3.2",
"react-dom": "npm:react-dom@^15.3.2",
"zlib": "github:jspm/nodelibs-zlib@^0.2.0-alpha"
},
"peerDependencies": {
"assert": "github:jspm/nodelibs-assert@^0.2.0-alpha",
@ -44,10 +50,25 @@
"core-js": "^1.2.0"
}
},
"npm:inherits@2.0.1": {
"npm:browserify-zlib@0.1.4": {
"dependencies": {
"readable-stream": "^2.0.2",
"pako": "~0.2.0"
},
"map": {
"_stream_transform": "readable-stream/transform"
}
},
"npm:inherits@2.0.3": {
"ignore": [
"test.js"
]
},
"npm:lodash@4.16.4": {
"map": {
"buffer": "@empty",
"process": "@empty"
}
}
}
},