urdf-loader - npm Package Compare versions

Comparing version 0.3.3 to 0.3.4

example/dragAndDrop.js

@@ -138,2 +138,3 @@ /* globals animToggle viewer setColor */
             const filesNames = Object.keys(files);
+            viewer.up = '+Z';
             viewer.urdf =
@@ -140,0 +141,0 @@ filesNames

example/index.js

@@ -121,2 +121,4 @@ /* globals animToggle viewer THREE */
 
+    // stop the animation if user tried to manipulate the model
+    animToggle.classList.remove('checked');
     const j = document.querySelector(`li[joint-name="${ e.detail }"]`);
@@ -123,0 +125,0 @@ if (j) {

package.json

 {
   "name": "urdf-loader",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "URDF Loader for THREE.js and webcomponent viewer",
@@ -5,0 +5,0 @@ "scripts": {

urdf-viewer-element.js

@@ -364,2 +364,44 @@ /* globals THREE URDFLoader */
 
+            const updateMaterials = mesh => {
+
+                mesh.traverse(c => {
+
+                    if (c.type === 'Mesh') {
+
+                        c.castShadow = true;
+                        c.receiveShadow = true;
+
+                        if (c.material) {
+
+                            const mats =
+                                (Array.isArray(c.material) ? c.material : [c.material])
+                                    .map(m => {
+
+                                        if (m instanceof THREE.MeshBasicMaterial) {
+
+                                            m = new THREE.MeshPhongMaterial();
+
+                                        }
+
+                                        if (m.map) {
+
+                                            m.map.encoding = THREE.GammaEncoding;
+
+                                        }
+
+                                        m.shadowSide = THREE.DoubleSide;
+
+                                        return m;
+
+                                    });
+                            c.material = mats.length === 1 ? mats[0] : mats;
+
+                        }
+
+                    }
+
+                });
+
+            };
+
             let totalMeshes = 0;
@@ -383,2 +425,4 @@ let meshesLoaded = 0;
 
+                    requestAnimationFrame(() => updateMaterials(robot));
+
                     this.robot = robot;
@@ -399,39 +443,4 @@ this.world.add(robot);
 
-                        mesh.traverse(c => {
+                        updateMaterials(mesh);
 
-                            if (c.type === 'Mesh') {
-
-                                c.castShadow = true;
-                                c.receiveShadow = true;
-
-                                if (c.material) {
-
-                                    const mats =
-                                        (Array.isArray(c.material) ? c.material : [c.material])
-                                            .map(m => {
-
-                                                if (m instanceof THREE.MeshBasicMaterial) {
-
-                                                    m = new THREE.MeshPhongMaterial();
-
-                                                }
-
-                                                if (m.map) {
-
-                                                    m.map.encoding = THREE.GammaEncoding;
-
-                                                }
-
-                                                m.shadowSide = THREE.DoubleSide;
-
-                                                return m;
-
-                                            });
-                                    c.material = mats.length === 1 ? mats[0] : mats;
-
-                                }
-
-                            }
-
-                        });
                         done(mesh);
@@ -438,0 +447,0 @@

URDFLoader.js

@@ -405,2 +405,5 @@ /* globals THREE */
 
+                    // TODO: We use animation frames here to ensure that materials are
+                    // appropriately applied. It would be better to scrape up all the data
+                    // before adding it to the scene
                     requestAnimationFrame(() => {
@@ -426,3 +429,3 @@
                         const mesh = new THREE.Mesh();
-                        mesh.geometry = new THREE.SphereGeometry(1, 20, 20);
+                        mesh.geometry = new THREE.SphereGeometry(1, 30, 30);
                         mesh.material = material;
@@ -434,2 +437,4 @@
 
+                        linkObj.add(mesh);
+
                     });
@@ -445,3 +450,3 @@
                         const mesh = new THREE.Mesh();
-                        mesh.geometry = new THREE.CylinderBufferGeometry(1, 1, 1, 25);
+                        mesh.geometry = new THREE.CylinderBufferGeometry(1, 1, 1, 30);
                         mesh.material = material;
@@ -452,3 +457,3 @@ mesh.scale.set(radius, length, radius);
                         obj.add(mesh);
-                        mesh.rotation.set(Math.PI, 0, 0);
+                        mesh.rotation.set(Math.PI / 2, 0, 0);
 
@@ -455,0 +460,0 @@ linkObj.add(obj);

No alert changes

Improved metrics

Total package byte prevSize

2608619

increased by0.04%

Lines of code

6980

increased by0.19%

No dependency changes