2.15.3

RELEASE.md

@@ -3,6 +3,9 @@
 git add and git commit
 rm -rf build
 rm -rf dist
+rm -rf k3d/static
+rm -rf k3d/labextension
+rm -rf js/dist
 python -m build .
 twine upload dist/*
 cd js

docs/source/_templates/sidebar_index.html

@@ -1,12 +1 @@
-<nav class="bd-links" id="bd-docs-nav" aria-label="{{ _('Main navigation') }}">
-  <div class="bd-toc-item active">
-    {{ generate_nav_html("raw",
-    show_nav_level=0|int,
-    maxdepth=2|int,
-    collapse=False|tobool,
-    includehidden=True|tobool) }}
-  </div>
-  <script>
-    $(".bd-toc-item").children("ul").addClass("nav bd-sidenav");
-  </script>
-</nav>
+<img src="_static/logo.png" alt="K3D-Jupyter logo"/>

docs/source/conf.py

@@ -22,8 +22,7 @@
 
 project = 'K3D-jupyter'
 author = u'Artur Trzęsiok, Marcin Kostur, Tomasz Gandor, Thomas Mattone'
-copyright = time.strftime(
-    '%Y') + ' ' + author
+copyright = time.strftime('%Y') + ' ' + author
 
 # The full version, including alpha/beta/rc tags
 here = os.path.dirname(__file__)
@@ -69,7 +68,9 @@
 
 html_theme_options = {
     "show_prev_next": False,
-    "google_analytics_id": 'UA-141840477-1',
+    "analytics": {
+        "google_analytics_id": 'UA-141840477-1',
+    },
     "icon_links": [
         {
             "name": "GitHub",
@@ -93,7 +94,8 @@
 }
 
 html_sidebars = {
-    "index": ["search-field", "sidebar_index"],
+    "index": ["sidebar_index", "search-field"],
+    "**": ["search-field", "sidebar-nav-bs"],
     "gallery/*": []
 }
 

docs/source/gallery/showcase/thumbnails/lorenz_system_thumbnail.py

@@ -37,6 +37,7 @@ def lorenz(x, y, z, s=10, r=28, b=8 / 3):
                     label_color=0xf0f0f0,
                     grid_visible=False,
                     menu_visibility=False,
+                    screenshot_scale=1,
                     axes_helper=0)
     plot += plt_line
 

docs/source/gallery/showcase/thumbnails/menger_sponge_thumbnail.py

@@ -34,6 +34,7 @@ def iterate(length, x, y, z):
 
     plot = k3d.plot(grid_visible=False,
                     camera_auto_fit=False,
+                    screenshot_scale=1,
                     axes_helper=0)
     plot += plt_voxels
 

docs/source/index.rst

@@ -1,5 +1,5 @@
-K3D-jupyter Documentation
-===========================
+Overview
+========
 
 .. raw:: html
 

examples/point_cloud_scaner.ipynb

@@ -197,7 +197,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.8.12"
+   "version": "3.9.12"
   }
  },
  "nbformat": 4,

js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "k3d",
-  "version": "2.15.2",
+  "version": "2.15.3",
   "description": "3D visualization library",
   "author": "k3d team",
   "main": "src/index.js",

js/src/k3d.js

@@ -83,6 +83,7 @@ class ObjectModel extends widgets.WidgetModel {
         triangles_attribute: serialize,
         vertices: serialize,
         indices: serialize,
+        normals: serialize,
         colors: serialize,
         origins: serialize,
         vectors: serialize,

js/src/providers/threejs/helpers/Interactions.js

@@ -2,16 +2,30 @@ const threeMeshBVH = require('three-mesh-bvh');
 const StandardInteractions = require('../interactions/StandardCallback');
 
 module.exports = {
-    init(config, object, K3D, InteractionsCallback) {
+    init(config, object, K3D, InteractionsCallback, geometry, Intersect) {
         object.startInteraction = function () {
             if (!object.interactions) {
-                object.geometry.boundsTree = new threeMeshBVH.MeshBVH(object.geometry);
+                if (typeof (geometry) === 'undefined') {
+                    geometry = object.geometry;
+                }
+
+                object.geometry.boundsTree = new threeMeshBVH.MeshBVH(geometry);
 
                 if (InteractionsCallback) {
                     object.interactions = InteractionsCallback(object, K3D);
                 } else {
                     object.interactions = StandardInteractions(object, K3D);
                 }
+
+                if (typeof (Intersect) !== 'undefined') {
+                    object.interactions.intersect = Intersect(object);
+                }
+
+                // var helper = new threeMeshBVH.MeshBVHVisualizer(object);
+                // helper.depth = 14;
+                // helper.update();
+                //
+                // K3D.getWorld().K3DObjects.add(helper);
             }
         };
 
@@ -25,19 +39,6 @@ module.exports = {
         if (config.click_callback || config.hover_callback) {
             object.startInteraction();
         }
-
-        // THREE = require('three');
-        // object.startInteraction();
-        //
-        // var o = new THREE.Group(),
-        //     helper = new threeMeshBVH.Visualizer(object);
-        // helper.depth = 7;
-        // helper.update();
-        //
-        // o.add(object);
-        // o.add(helper);
-        //
-        // return o;
     },
 
     update(config, changes, resolvedChanges, obj) {

js/src/providers/threejs/initializers/Scene.js

@@ -3,8 +3,8 @@ const _ = require('../../../lodash');
 const Text = require('../objects/Text');
 const Vectors = require('../objects/Vectors');
 const MeshLine = require('../helpers/THREE.MeshLine')(THREE);
-const {viewModes} = require('../../../core/lib/viewMode');
-const {pow10ceil} = require('../../../core/lib/helpers/math');
+const { viewModes } = require('../../../core/lib/viewMode');
+const { pow10ceil } = require('../../../core/lib/helpers/math');
 
 let rebuildSceneDataPromises = null;
 
@@ -39,9 +39,9 @@ function generateAxesHelper(K3D, axesHelper) {
     });
 
     const arrows = Vectors.create({
-        colors: {data: [colors[0], colors[0], colors[1], colors[1], colors[2], colors[2]]},
-        origins: {data: [0, 0, 0, 0, 0, 0, 0, 0, 0]},
-        vectors: {data: [].concat(directions.x, directions.y, directions.z)},
+        colors: { data: [colors[0], colors[0], colors[1], colors[1], colors[2], colors[2]] },
+        origins: { data: [0, 0, 0, 0, 0, 0, 0, 0, 0] },
+        vectors: { data: [].concat(directions.x, directions.y, directions.z) },
         line_width: 0.05,
         head_size: 2.5,
     }, K3D);
@@ -513,7 +513,7 @@ function refreshGrid(K3D, grids) {
 function raycast(K3D, x, y, camera, click, viewMode) {
     /* jshint validthis:true */
     const meshes = [];
-    let intersect;
+    let intersects = [];
     let needRender = false;
 
     this.raycaster.setFromCamera(new THREE.Vector2(x, y), camera);
@@ -524,29 +524,34 @@ function raycast(K3D, x, y, camera, click, viewMode) {
                 return;
             }
 
-            meshes.push(object);
+            if (object.interactions.intersect) {
+                intersects = intersects.concat(object.interactions.intersect(this.raycaster));
+            } else {
+                meshes.push(object);
+            }
         }
     });
 
     if (meshes.length > 0) {
-        intersect = this.raycaster.intersectObjects(meshes);
+        intersects = intersect.concat(this.raycaster.intersectObjects(meshes));
+    }
 
-        if (intersect.length > 0) {
-            intersect = intersect[0];
-            K3D.getWorld().targetDOMNode.style.cursor = 'pointer';
+    if (intersects.length > 0) {
+        let intersect = intersects[0];
+        K3D.getWorld().targetDOMNode.style.cursor = 'pointer';
 
-            if (!click && intersect.object.interactions && intersect.object.interactions.onHover) {
-                needRender |= intersect.object.interactions.onHover(intersect, viewMode);
-            }
+        if (!click && intersect.object.interactions && intersect.object.interactions.onHover) {
+            needRender |= intersect.object.interactions.onHover(intersect, viewMode);
+        }
 
-            if (click && intersect.object.interactions && intersect.object.interactions.onClick) {
-                needRender |= intersect.object.interactions.onClick(intersect, viewMode);
-            }
-        } else {
-            K3D.getWorld().targetDOMNode.style.cursor = 'auto';
+        if (click && intersect.object.interactions && intersect.object.interactions.onClick) {
+            needRender |= intersect.object.interactions.onClick(intersect, viewMode);
         }
+    } else {
+        K3D.getWorld().targetDOMNode.style.cursor = 'auto';
     }
 
+
     return needRender;
 }
 

js/src/providers/threejs/interactions/PointsCallback.js

@@ -0,0 +1,26 @@
+/**
+ * Interactions handlers for standard object
+ * @memberof K3D.Providers.ThreeJS.Interactions
+ */
+
+function prepareParam(param) {
+    return {
+        position: param.point.toArray(),
+        distance: param.distance,
+        index: param.index,
+        K3DIdentifier: param.object.K3DIdentifier,
+    };
+}
+
+module.exports = function (object, K3D) {
+    return {
+        onHover(intersect) {
+            K3D.dispatch(K3D.events.OBJECT_HOVERED, prepareParam(intersect));
+            return false;
+        },
+        onClick(intersect) {
+            K3D.dispatch(K3D.events.OBJECT_CLICKED, prepareParam(intersect));
+            return false;
+        },
+    };
+};

js/src/providers/threejs/interactions/PointsIntersect.js

@@ -0,0 +1,90 @@
+const threeMeshBVH = require('three-mesh-bvh');
+const THREE = require('three');
+
+module.exports = {
+    prepareGeometry(geometry) {
+        const bvhGeometry = geometry.clone();
+        const indices = [];
+
+        let verticesLength = bvhGeometry.attributes.position.count;
+        for (let i = 0, l = verticesLength; i < l; i++) {
+            indices.push(i, i, i);
+        }
+        bvhGeometry.setIndex(indices);
+
+        return bvhGeometry;
+    },
+
+    Intersect(object) {
+        return function (raycaster) {
+            let intersects = [];
+
+            const inverseMatrix = new THREE.Matrix4();
+            inverseMatrix.copy(object.matrixWorld).invert();
+            raycaster.ray.applyMatrix4(inverseMatrix);
+
+            const { ray } = raycaster;
+            let closestDistance = Infinity;
+
+            let threshold = object.material.size / 2.0 || 1;
+            let localThreshold = threshold / ((object.scale.x + object.scale.y + object.scale.z) / 3);
+            let localThresholdSq = localThreshold * localThreshold;
+
+            let ret = null;
+
+            object.geometry.boundsTree.shapecast({
+                boundsTraverseOrder: function (box) {
+                    return box.distanceToPoint(ray.origin);
+                },
+                intersectsBounds: function (box, isLeaf, score) {
+                    if (score > closestDistance) {
+                        return threeMeshBVH.NOT_INTERSECTED;
+                    }
+
+                    box.expandByScalar(localThreshold);
+                    return ray.intersectsBox(box) ? threeMeshBVH.INTERSECTED : threeMeshBVH.NOT_INTERSECTED;
+
+                },
+                intersectsTriangle: function (triangle, triangleIndex) {
+                    const distancesToRaySq = ray.distanceSqToPoint(triangle.a);
+
+                    if (object.geometry.attributes.sizes || object.isInstancedMesh) {
+
+                        if (object.geometry.attributes.sizes) {
+                            threshold = object.geometry.attributes.sizes.array[triangleIndex] / 2.0;
+                        }
+
+                        if (object.isInstancedMesh) {
+                            let matrix = new THREE.Matrix4().fromArray(object.instanceMatrix.array, triangleIndex * 16);
+                            threshold = matrix.getMaxScaleOnAxis() / 2.0;
+                        }
+
+                        localThreshold = threshold / ((object.scale.x + object.scale.y + object.scale.z) / 3);
+                        localThresholdSq = localThreshold * localThreshold;
+                    }
+
+                    if (distancesToRaySq < localThresholdSq) {
+                        const distanceToPoint = ray.origin.distanceTo(triangle.a);
+
+                        if (distanceToPoint < closestDistance) {
+                            closestDistance = distanceToPoint;
+
+                            ret = {
+                                object: object,
+                                point: triangle.a,
+                                distance: distanceToPoint,
+                                index: triangleIndex
+                            }
+                        }
+                    }
+                }
+            });
+
+            if (closestDistance !== Infinity) {
+                intersects.push(ret);
+            }
+
+            return intersects;
+        }
+    },
+};

js/src/providers/threejs/objects/MeshStandard.js

@@ -32,6 +32,7 @@ module.exports = {
             const colorMap = (config.color_map && config.color_map.data) || null;
             const attribute = (config.attribute && config.attribute.data) || null;
             const triangleAttribute = (config.triangles_attribute && config.triangles_attribute.data) || null;
+            const normals = (config.normals && config.normals.data) || null;
             const vertices = (config.vertices && config.vertices.data) || null;
             const indices = (config.indices && config.indices.data) || null;
             const uvs = (config.uvs && config.uvs.data) || null;
@@ -40,11 +41,17 @@ module.exports = {
             let object;
             let preparedtriangleAttribute;
 
+            const hasNormals = (normals !== null && normals.length > 0);
+
             modelMatrix.set.apply(modelMatrix, config.model_matrix.data);
 
             geometry.setAttribute('position', new THREE.BufferAttribute(vertices, 3));
             geometry.setIndex(new THREE.BufferAttribute(indices, 1));
 
+            if (config.flat_shading === false && hasNormals) {
+                geometry.setAttribute('normal', new THREE.BufferAttribute(normals, 3));
+            }
+
             const material = new MaterialConstructor({
                 color: config.color,
                 emissive: 0,
@@ -59,7 +66,7 @@ module.exports = {
             });
 
             function finish() {
-                if (config.flat_shading === false) {
+                if (config.flat_shading === false && !hasNormals) {
                     geometry.computeVertexNormals();
                 }