From dbc01167e5a4348b760b5c3aaae92937477e4247 Mon Sep 17 00:00:00 2001 From: casperlamboo Date: Mon, 12 Feb 2018 11:07:06 +0100 Subject: [PATCH] fix line preview --- src/sliceActions/helpers/color.js | 24 +++++++++++ src/sliceActions/slice.js | 69 ++++++++++++++----------------- src/slicer.js | 29 ++++++------- src/slicer.worker.js | 11 ++--- 4 files changed, 74 insertions(+), 59 deletions(-) create mode 100644 src/sliceActions/helpers/color.js diff --git a/src/sliceActions/helpers/color.js b/src/sliceActions/helpers/color.js new file mode 100644 index 0000000..c6f6f33 --- /dev/null +++ b/src/sliceActions/helpers/color.js @@ -0,0 +1,24 @@ +export function hslToRgb(h, s, l){ + let r, g, b; + + if (s === 0) { + r = g = b = lightness; + } else { + const q = l < 0.5 ? l * (1 + s) : l + s - l * s; + const p = 2 * l - q; + r = hueToRgb(p, q, h + 1 / 3); + g = hueToRgb(p, q, h); + b = hueToRgb(p, q, h - 1 / 3); + } + + return [r, g, b]; +} + +function hueToRgb(p, q, t){ + if (t < 0) t += 1; + if (t > 1) t -= 1; + if (t < 1 / 6) return p + (q - p) * 6 * t; + if (t < 1 / 2) return q; + if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6; + return p; +} diff --git a/src/sliceActions/slice.js b/src/sliceActions/slice.js index 0f8cd02..5b80dd6 100644 --- a/src/sliceActions/slice.js +++ b/src/sliceActions/slice.js @@ -1,4 +1,3 @@ -// import * as THREE from 'three'; import calculateLayersIntersections from './calculateLayersIntersections.js'; import createLines from './createLines.js'; import generateInfills from './generateInfills.js'; @@ -12,6 +11,7 @@ import shapesToSlices from './shapesToSlices.js'; import slicesToGCode from './slicesToGCode.js'; import applyPrecision from './applyPrecision.js'; import { PRECISION } from '../constants.js'; +import { hslToRgb } from './helpers/color.js'; // // import removePrecision from './removePrecision.js'; export default function(settings, geometry, openObjectIndexes, constructLinePreview, onProgress) { @@ -64,7 +64,7 @@ export default function(settings, geometry, openObjectIndexes, constructLinePrev updateProgress('Finished'); - // if (constructLinePreview) gcode.linePreview = createGcodeGeometry(gcode.gcode); + if (constructLinePreview) gcode.linePreview = createGcodeGeometry(gcode.gcode); gcode.gcode = gcodeToString(gcode.gcode); return gcode; @@ -99,39 +99,32 @@ function gcodeToString(gcode) { }, ''); } -// const MAX_SPEED = 100 * 60; -// const COLOR = new THREE.Color(); -// function createGcodeGeometry(gcode) { -// const positions = []; -// const colors = []; -// -// let lastPoint = [0, 0, 0]; -// for (let i = 0; i < gcode.length; i ++) { -// const command = gcode[i]; -// if (typeof command === 'string') continue; -// -// const { G, F, X, Y, Z } = command; -// -// if (X || Y || Z) { -// if (G === 1) { -// positions.push(lastPoint.Y, lastPoint.Z, lastPoint.X); -// positions.push(Y, Z, X); -// -// const color = (G === 0) ? COLOR.setHex(0x00ff00) : COLOR.setHSL(F / MAX_SPEED, 0.5, 0.5); -// colors.push(color.r, color.g, color.b); -// colors.push(color.r, color.g, color.b); -// } -// lastPoint = { X, Y, Z }; -// } -// } -// -// const geometry = new THREE.BufferGeometry(); -// -// geometry.addAttribute('position', new THREE.BufferAttribute(new Float32Array(positions), 3)); -// geometry.addAttribute('color', new THREE.BufferAttribute(new Float32Array(colors), 3)); -// -// const material = new THREE.LineBasicMaterial({ vertexColors: THREE.VertexColors }); -// const linePreview = new THREE.LineSegments(geometry, material); -// -// return linePreview; -// } +const MAX_SPEED = 100 * 60; +function createGcodeGeometry(gcode) { + const positions = []; + const colors = []; + + let lastPoint = [0, 0, 0]; + for (let i = 0; i < gcode.length; i ++) { + const command = gcode[i]; + if (typeof command === 'string') continue; + + const { G, F, X, Y, Z } = command; + + if (X || Y || Z) { + if (G === 1) { + positions.push(lastPoint.Y, lastPoint.Z, lastPoint.X); + positions.push(Y, Z, X); + + const color = (G === 0) ? [0, 1, 0] : hslToRgb(F / MAX_SPEED, 0.5, 0.5); + colors.push(...color, ...color); + } + lastPoint = { X, Y, Z }; + } + } + + return { + positions: new Float32Array(positions), + colors: new Float32Array(colors) + }; +} diff --git a/src/slicer.js b/src/slicer.js index 2ebba5c..a44a447 100644 --- a/src/slicer.js +++ b/src/slicer.js @@ -76,7 +76,9 @@ export function sliceGeometry(settings, geometry, materials, matrix, sync = fals } function sliceSync(settings, geometry, openObjectIndexes, constructLinePreview, onProgress) { - return slice(settings, geometry, openObjectIndexes, constructLinePreview, onProgress); + const gcode = slice(settings, geometry, openObjectIndexes, constructLinePreview, onProgress); + if (gcode.linePreview) gcode.linePreview = constructLineGeometry(gcode.linePreview); + return gcode; } function sliceAsync(settings, geometry, openObjectIndexes, constructLinePreview, onProgress) { @@ -98,19 +100,7 @@ function sliceAsync(settings, geometry, openObjectIndexes, constructLinePreview, const { gcode } = data; gcode.gcode = typedArrayToString(gcode.gcode); - - // if (data.gcode.linePreview) { - // const geometry = new THREE.BufferGeometry(); - // - // const { position, color } = data.gcode.linePreview; - // geometry.addAttribute('position', new THREE.BufferAttribute(new Float32Array(position), 3)); - // geometry.addAttribute('color', new THREE.BufferAttribute(new Float32Array(color), 3)); - // - // const material = new THREE.LineBasicMaterial({ vertexColors: THREE.VertexColors }); - // const linePreview = new THREE.LineSegments(geometry, material); - // - // data.gcode.linePreview = linePreview; - // } + if (gcode.linePreview) gcode.linePreview = constructLineGeometry(gcode.linePreview); resolve(gcode); break; @@ -133,3 +123,14 @@ function sliceAsync(settings, geometry, openObjectIndexes, constructLinePreview, }, buffers); }); } + +function constructLineGeometry(linePreview) { + const geometry = new THREE.BufferGeometry(); + + geometry.addAttribute('position', new THREE.BufferAttribute(new Float32Array(linePreview.positions), 3)); + geometry.addAttribute('color', new THREE.BufferAttribute(new Float32Array(linePreview.colors), 3)); + + const material = new THREE.LineBasicMaterial({ vertexColors: THREE.VertexColors }); + const mesh = new THREE.LineSegments(geometry, material); + return mesh; +} diff --git a/src/slicer.worker.js b/src/slicer.worker.js index e55f9e9..d1a6338 100644 --- a/src/slicer.worker.js +++ b/src/slicer.worker.js @@ -19,13 +19,10 @@ self.addEventListener('message', (event) => { gcode.gcode = stringToTypedArray(gcode.gcode); const buffers = [gcode.gcode.buffer]; - - // if (gcode.linePreview) { - // const position = gcode.linePreview.geometry.getAttribute('position').array; - // const color = gcode.linePreview.geometry.getAttribute('color').array; - // buffers.push(position.buffer, color.buffer); - // gcode.linePreview = { position, color }; - // } + if (gcode.linePreview) { + buffers.push(gcode.linePreview.positions.buffer); + buffers.push(gcode.linePreview.colors.buffer); + } self.postMessage({ message: 'SLICE',