Merge pull request #13 from MetacityTools/dev

Releasing v0.2.1

Author: vojtatom

README.md

@@ -2,7 +2,7 @@
 
 ![Screenshot](./studio.png)
 
-Metacity Studio is an online tool for integrating and visualizing spatial and tabular data.
+Metacity Studio is an online tool for integrating and visualization of spatial data.
 
 Running at [studio.metacity.cc](https://studio.metacity.cc)
 
@@ -11,7 +11,7 @@ Running at [studio.metacity.cc](https://studio.metacity.cc)
 Prepare urban visualizations online. Load your data, align it, and export it for viewing online.
 
 -   works best with small to medium-sized datasets
--   allows yout to connect 3D models and tabular data
+-   allows yout to connect 3D models and metadata
 
 ## What formats can you load in?
 
@@ -25,20 +25,31 @@ Currently:
 
 The project is in active development. The roadmap is as follows:
 
-### v0.3.0
+### v0.4.0
 
--   [ ] Viewer - Details TBA
 -   [ ] Optional interactivity - build BVH only if user opts-in to make the loaded models clickable
--   [ ] Integrate Google Sheets imports
+-   [ ] Hide and show models
+-   [ ] Viewer - Details TBA
 
-### v0.2.1
+### v0.3.1
 
--   [ ] Project export
--   [ ] Resize guard update graphics (The "Oops" message is pretty lame)
--   [ ] Transforming original metadata to a table
+-   [ ] Loading points and lines from SHP
 -   [ ] Extract Utils to separate SDK form metacity editors
 
-### v0.2.0 - 👨‍💻 In progress
+### v0.3.2 - 👨‍💻 In progress
+
+-   [ ] Projecting models onto models (2D onto 3D) - ✨WIP https://github.com/vojtatom/geometry
+-   [ ] Project export
+-   [ ] Styling???
+
+### v0.2.1 - ✅ Released
+
+-   [x] Auto setup shading based on height
+-   [x] JSON metadata for nodes in hierarchy
+    -   [x] Assign metadata to model nodes
+-   [x] Resize guard update graphics (The "Oops" message is pretty lame)
+
+### v0.2.0 - ✅ Released
 
 -   [x] Infrastructure for the built-in viewer (vite setup, etc.)
 -   [x] Building a hierarchy of models (floors, buildings, blocks, etc.) - ✨WIP
@@ -103,7 +114,6 @@ The project is in active development. The roadmap is as follows:
 ## Backlog
 
 -   [ ] Merge whole models
--   [ ] Loading points and lines from SHP
 -   [ ] Loading GeoJSON
 -   [ ] Loading IFC metadata loading (memory-efficiency???)
 -   [ ] Remesh models - intersection of triangles

package-lock.json

@@ -1,17 +1,18 @@
 {
     "name": "metacity-studio",
     "private": true,
-    "version": "0.2.0",
+    "version": "0.2.1",
     "type": "module",
     "scripts": {
         "dev": "vite",
-        "build": "tsc && vite build",
+        "build": "tsc && vite build --emptyOutDir",
         "preview": "vite preview"
     },
     "dependencies": {
         "@headlessui/react": "^1.7.14",
         "@loaders.gl/core": "^3.3.3",
         "@loaders.gl/gltf": "^3.3.3",
+        "@monaco-editor/react": "^4.5.1",
         "@vojtatom/csvts": "^0.1.0",
         "allotment": "^1.18.1",
         "clsx": "^1.2.1",

package.json

@@ -37,6 +37,15 @@ body,
     }
 }
 
+@layer components {
+    .disable-blur {
+        -webkit-image-rendering: pixelated;
+        -moz-image-rendering: pixelated;
+        -o-image-rendering: pixelated;
+        image-rendering: pixelated;
+    }
+}
+
 @layer components {
     input[type='range'] {
         @apply appearance-none bg-transparent cursor-pointer outline-none;

studio/src/assets/cat.gif

@@ -5,8 +5,9 @@ import { Attributes } from './models/attributes';
 import { Buffer, ElementBuffer } from './models/buffer';
 import { Model } from './models/model';
 import { Pickable } from './models/pickable';
-import { Renderable } from './models/renderable';
+import { PRIMITIVE_MODE, PrimitiveMode, Renderable } from './models/renderable';
 import { Selectable } from './models/selectable';
+import { BBox } from './picking/bbox';
 import { Ray } from './picking/ray';
 import { Renderer } from './renderer/renderer';
 import { mountRenderer, unmountRenderer } from './renderer/setup';
@@ -37,9 +38,11 @@ export {
     Profiler,
     ShortcutOnPress,
     ShortcutOnMouseMove,
+    BBox,
     mountRenderer,
     unmountRenderer,
     cloneUniforms,
+    PrimitiveMode,
 };
 
-export type { Selectable, Shortcut, TypedArray };
+export type { Selectable, Shortcut, TypedArray, PRIMITIVE_MODE };

studio/src/assets/cat2.gif

@@ -4,15 +4,24 @@ import { Shader, UniformValue } from '@bananagl/shaders/shader';
 
 import { Attributes } from './attributes';
 
+export type TRIANGLES_MODE = WebGLRenderingContextBase['TRIANGLES'];
+export type LINES_MODE = WebGLRenderingContextBase['LINES'];
+export type PRIMITIVE_MODE = TRIANGLES_MODE | LINES_MODE;
+
+export enum PrimitiveMode {
+    TRIANGLES = 4,
+    LINES = 1,
+    POINTS = 4,
+}
+
 export abstract class Renderable {
     private attributes_: Attributes = new Attributes();
     private position_: vec3 = [0, 0, 0];
     private rotation_: vec3 = [0, 0, 0];
     private scale_: vec3 = [1, 1, 1];
     private disposed_ = false;
     private visible_ = true;
-    public mode: WebGLRenderingContextBase['TRIANGLES'] | WebGLRenderingContextBase['LINES'] = 4;
-
+    public mode: PRIMITIVE_MODE = PrimitiveMode.TRIANGLES;
 
     private uniforms_: { [name: string]: UniformValue } = {
         uModelMatrix: mat4.identity(mat4.create()),

studio/src/assets/index.css

@@ -1,4 +1,4 @@
-import { vec3 } from 'gl-matrix';
+import { vec2, vec3 } from 'gl-matrix';
 
 import { TypedArray } from '@bananagl/shaders/shader';
 
@@ -60,6 +60,15 @@ export class BBox {
         );
     }
 
+    overlapedBy(from: vec2, to: vec2): boolean {
+        return !(
+            from[0] > this.max[0] ||
+            to[0] < this.min[0] ||
+            from[1] > this.max[1] ||
+            to[1] < this.min[1]
+        );
+    }
+
     get longestSide(): number {
         const [x, y, z] = this.max.map((v, i) => v - this.min[i]);
         return Math.max(x, y, z);

studio/src/bananagl/bananagl.ts

@@ -1,4 +1,4 @@
-import { vec3 } from 'gl-matrix';
+import { vec2, vec3 } from 'gl-matrix';
 
 import { Attribute } from '@bananagl/models/attribute';
 import { Renderable } from '@bananagl/models/renderable';
@@ -167,4 +167,38 @@ export class TriangleBVH implements BVH {
             if (hit) indices.push(i);
         }
     }
+
+    //--------------------------------------------------------------------------------
+    traceArea(from: vec2, to: vec2) {
+        if (!this.root) return [];
+
+        const stack = new Array<BVHNode>();
+        stack.push(this.root);
+
+        const indices: number[] = [];
+
+        while (stack.length > 0) {
+            const node = stack.pop();
+            if (!node) continue;
+            if (node.bbox) {
+                if (!node.bbox.overlapedBy(from, to)) continue;
+
+                if (node.left) stack.push(node.left);
+                if (node.right) stack.push(node.right);
+
+                if (node.from !== undefined) {
+                    this.traverseLeafTriangleArea(node, indices);
+                }
+            }
+        }
+
+        return indices;
+    }
+
+    private traverseLeafTriangleArea(node: BVHNode, indices: number[]) {
+        for (let i = node.from!; i < node.to!; i++) {
+            //TODO optimize, not all triangles are inside the area
+            indices.push(i);
+        }
+    }
 }