@jscad/x3d-serializer 2.4.2 → 2.4.4

package/CHANGELOG.md

@@ -3,6 +3,26 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.4.4](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/x3d-serializer@2.4.3...@jscad/x3d-serializer@2.4.4) (2023-04-30)
+
+
+### Bug Fixes
+
+* **x3d-serializer:** corrected color and transparency conversions ([cc99548](https://github.com/jscad/OpenJSCAD.org/commit/cc9954853c30c6a82fcd26cda686e7f51f9fa304))
+* **x3d-serializer:** corrected colors, orientation of scene to Y up, and added new option for smoothing ([3444e2d](https://github.com/jscad/OpenJSCAD.org/commit/3444e2d462446694e62da71b130dfb4e56e92f82))
+
+
+
+
+
+## [2.4.3](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/x3d-serializer@2.4.2...@jscad/x3d-serializer@2.4.3) (2022-11-26)
+
+**Note:** Version bump only for package @jscad/x3d-serializer
+
+
+
+
+
 ## [2.4.2](https://github.com/jscad/OpenJSCAD.org/compare/@jscad/x3d-serializer@2.4.1...@jscad/x3d-serializer@2.4.2) (2022-08-21)
 
 **Note:** Version bump only for package @jscad/x3d-serializer

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jscad/x3d-serializer",
-  "version": "2.4.2",
+  "version": "2.4.4",
   "description": "X3D Serializer for JSCAD",
   "homepage": "https://openjscad.xyz/",
   "repository": "https://github.com/jscad/OpenJSCAD.org",
@@ -33,12 +33,12 @@
   "license": "MIT",
   "dependencies": {
     "@jscad/array-utils": "2.1.4",
-    "@jscad/modeling": "2.10.0",
+    "@jscad/modeling": "2.11.1",
     "onml": "1.3.0"
   },
   "devDependencies": {
     "ava": "3.15.0",
     "nyc": "15.1.0"
   },
-  "gitHead": "13572067545460affd53b64b3ab834a39af8c7e5"
+  "gitHead": "4313974b50957018d2edd010e3a251f59bea46a4"
 }

package/src/index.js

@@ -34,7 +34,7 @@ Notes:
 const { geometries, modifiers } = require('@jscad/modeling')
 const { geom2, geom3, path2, poly2, poly3 } = geometries
 
-const { flatten, toArray } = require('@jscad/array-utils')
+const { flatten } = require('@jscad/array-utils')
 
 const stringify = require('onml/lib/stringify')
 
@@ -48,6 +48,8 @@ const mimeType = 'model/x3d+xml'
  * Serialize the give objects to X3D elements (XML).
  * @param {Object} options - options for serialization, REQUIRED
  * @param {Array} [options.color=[0,0,1,1]] - default color for objects
+ * @param {Boolean} [options.smooth=false] - use averaged vertex normals
+ * @param {Number} [options.decimals=1000] - multiplier before rounding to limit precision
  * @param {Boolean} [options.metadata=true] - add metadata to 3MF contents, such at CreationDate
  * @param {String} [options.unit='millimeter'] - unit of design; millimeter, inch, feet, meter or micrometer
  * @param {Function} [options.statusCallback] - call back function for progress ({ progress: 0-100 })
@@ -61,6 +63,7 @@ const mimeType = 'model/x3d+xml'
 const serialize = (options, ...objects) => {
   const defaults = {
     color: [0, 0, 1, 1.0], // default colorRGBA specification
+    smooth: false,
     decimals: 1000,
     metadata: true,
     unit: 'millimeter', // millimeter, inch, feet, meter or micrometer
@@ -80,20 +83,20 @@ const serialize = (options, ...objects) => {
   let body = ['X3D',
     {
       profile: 'Interchange',
-      version: '4.0',
+      version: '3.3',
       'xmlns:xsd': 'http://www.w3.org/2001/XMLSchema-instance',
-      'xsd:noNamespaceSchemaLocation': 'http://www.web3d.org/specifications/x3d-4.0.xsd'
+      'xsd:noNamespaceSchemaLocation': 'http://www.web3d.org/specifications/x3d-3.3.xsd'
     }
   ]
   if (options.metadata) {
     body.push(['head', {},
       ['meta', { name: 'creator', content: 'Created by JSCAD' }],
       ['meta', { name: 'reference', content: 'https://www.openjscad.xyz' }],
-      ['meta', { name: 'created', content: new Date().toISOString()}]
+      ['meta', { name: 'created', content: new Date().toISOString() }]
     ])
   } else {
     body.push(['head', {},
-      ['meta', { name: 'creator', content: 'Created by JSCAD' }],
+      ['meta', { name: 'creator', content: 'Created by JSCAD' }]
     ])
   }
   body = body.concat(convertObjects(objects, options))
@@ -108,7 +111,6 @@ ${stringify(body, 2)}`
 }
 
 const convertObjects = (objects, options) => {
-  let scene = ['Scene', {}]
   const shapes = []
   objects.forEach((object, i) => {
     options.statusCallback && options.statusCallback({ progress: 100 * i / objects.length })
@@ -128,7 +130,8 @@ const convertObjects = (objects, options) => {
       shapes.push(convertPath2(object, options))
     }
   })
-  scene = scene.concat(shapes)
+  const transform = ['Transform', { rotation: '1 0 0 -1.5708' }, ...shapes]
+  const scene = ['Scene', {}, transform]
   return [scene]
 }
 
@@ -138,9 +141,9 @@ const convertObjects = (objects, options) => {
 const convertPath2 = (object, options) => {
   const points = path2.toPoints(object).slice()
   if (points.length > 1 && object.isClosed) points.push(points[0])
-  shape = ['Shape', {}, convertPolyline2D(poly2.create(points), options)]
+  const shape = ['Shape', {}, convertPolyline2D(poly2.create(points), options)]
   if (object.color) {
-    shape.push(convertAppearance(object, options))
+    shape.push(convertAppearance(object, 'emissiveColor', options))
   }
   return shape
 }
@@ -155,7 +158,7 @@ const convertGeom2 = (object, options) => {
     if (outline.length > 1) outline.push(outline[0]) // close the outline for conversion
     const shape = ['Shape', {}, convertPolyline2D(poly2.create(outline), options)]
     if (object.color) {
-      shape.push(convertAppearance(object, options))
+      shape.push(convertAppearance(object, 'emissiveColor', options))
     }
     group.push(shape)
   })
@@ -167,13 +170,17 @@ const convertGeom2 = (object, options) => {
  */
 const convertPolyline2D = (object, options) => {
   const lineSegments = object.vertices.map((p) => `${p[0]} ${p[1]}`).join(' ')
-  return ['Polyline2D', {lineSegments}]
+  return ['Polyline2D', { lineSegments }]
 }
 
-const convertAppearance = (object, options) => {
-  const diffuseColor = object.color.join(' ')
-  const emissiveColor = object.color.join(' ')
-  return ['Appearance', ['Material', {diffuseColor, emissiveColor}]]
+/*
+ * Convert color to Appearance
+ */
+const convertAppearance = (object, colorField, options) => {
+  const colorRGB = object.color.slice(0, 3)
+  const color = colorRGB.join(' ')
+  const transparency = roundToDecimals(1.0 - object.color[3], options)
+  return ['Appearance', ['Material', { [colorField]: color, transparency }]]
 }
 
 /*
@@ -181,9 +188,11 @@ const convertAppearance = (object, options) => {
  */
 const convertGeom3 = (object, options) => {
   const shape = ['Shape', {}, convertMesh(object, options)]
+  let appearance = ['Appearance', {}, ['Material']]
   if (object.color) {
-    shape.push(convertAppearance(object, options))
+    appearance = convertAppearance(object, 'diffuseColor', options)
   }
+  shape.push(appearance)
   return shape
 }
 
@@ -197,10 +206,10 @@ const convertMesh = (object, options) => {
 
   const faceset = [
     'IndexedTriangleSet',
-    { ccw: 'true', colorPerVertex: 'false', solid: 'false', index: indexList },
-    ['Coordinate', { point: pointList }],
+    { ccw: 'true', colorPerVertex: 'false', normalPerVertex: options.smooth, solid: 'false', index: indexList },
+    ['Coordinate', { point: pointList }]
   ]
-  if (! object.color) {
+  if (!object.color) {
     faceset.push(['Color', { color: colorList }])
   }
   return faceset
@@ -236,6 +245,8 @@ const convertToColor = (polygon, options) => {
   return `${color[0]} ${color[1]} ${color[2]}`
 }
 
+const roundToDecimals = (float, options) => Math.round(float * options.decimals) / options.decimals
+
 /*
  * This function converts the given polygons into three lists
  * - indexList : index of each vertex in the triangle (tuples)
@@ -257,9 +268,9 @@ const polygons2coordinates = (polygons, options) => {
 
       // add the vertex to the list of points (and index) if not found
       if (!vertexTagToCoordIndexMap.has(id)) {
-        const x = Math.round(vertex[0] * options.decimals) / options.decimals
-        const y = Math.round(vertex[1] * options.decimals) / options.decimals
-        const z = Math.round(vertex[2] * options.decimals) / options.decimals
+        const x = roundToDecimals(vertex[0], options)
+        const y = roundToDecimals(vertex[1], options)
+        const z = roundToDecimals(vertex[2], options)
         pointList.push(`${x} ${y} ${z}`)
         vertexTagToCoordIndexMap.set(id, pointList.length - 1)
       }

package/tests/geom2ToX3D.test.js

@@ -58,7 +58,7 @@ test('serialize 2D geometry to X3D Polyline2D', (t) => {
   // for color
   t.is(countOf('Appearance', obs), 2)
   t.is(countOf('Material', obs), 1)
-  t.is(countOf('diffuseColor', obs), 1)
+  t.is(countOf('diffuseColor', obs), 0)
   t.is(countOf('emissiveColor', obs), 1)
 
 
@@ -79,7 +79,7 @@ test('serialize 2D geometry to X3D Polyline2D', (t) => {
   // for color
   t.is(countOf('Appearance', obs), 2)
   t.is(countOf('Material', obs), 1)
-  t.is(countOf('diffuseColor', obs), 1)
+  t.is(countOf('diffuseColor', obs), 0)
   t.is(countOf('emissiveColor', obs), 1)
 })
 

package/tests/geom3ToX3D.test.js

@@ -19,7 +19,7 @@ test('serialize 3D geometry to X3D IndexedTriangleSet', (t) => {
   t.is(countOf('name', obs), 3)
   t.is(countOf('content', obs), 3)
   t.is(countOf('Created by JSCAD', obs), 1)
-  t.is(countOf('Scene', obs), 1)
+  t.is(countOf('Scene', obs), 2)
 
   const geom2 = primitives.cube()
 
@@ -34,12 +34,12 @@ test('serialize 3D geometry to X3D IndexedTriangleSet', (t) => {
   t.is(countOf('content', obs), 1)
   t.is(countOf('Created by JSCAD', obs), 1)
   t.is(countOf('Scene', obs), 2)
+  t.is(countOf('Transform', obs), 2)
   t.is(countOf('Shape', obs), 2)
   t.is(countOf('IndexedTriangleSet', obs), 2)
   t.is(countOf('Coordinate', obs), 1)
   t.is(countOf('Color', obs), 1)
 
-
   const geom3 = colors.colorize([0.5, 1, 0.5, 1.0], transforms.center({ relativeTo: [5, 5, 5] }, primitives.cube()))
 
   results = serializer.serialize({metadata: false}, geom2, geom3)
@@ -57,8 +57,11 @@ test('serialize 3D geometry to X3D IndexedTriangleSet', (t) => {
   t.is(countOf('IndexedTriangleSet', obs), 4)
   t.is(countOf('Coordinate', obs), 2)
   // for color
-  t.is(countOf('Color', obs), 3)
-  t.is(countOf('Appearance', obs), 2)
-
-})
-
+  t.is(countOf('<Color', obs), 1)
+  t.is(countOf('Appearance', obs), 4)
+  // for RGB
+  t.is(countOf('diffuseColor="0.5 1 0.5"', obs), 1)
+  // for facets
+  t.is(countOf('normalPerVertex="false"', obs), 2)
+  
+})

package/tests/path2ToX3D.test.js

@@ -48,7 +48,7 @@ test('serialize 2D path to X3D Polyline2D', (t) => {
   // and color on path3
   t.is(countOf('Appearance', obs), 2)
   t.is(countOf('Material', obs), 1)
-  t.is(countOf('diffuseColor', obs), 1)
+  t.is(countOf('diffuseColor', obs), 0)
   t.is(countOf('emissiveColor', obs), 1)
 
 })