synch with TileDB-Viz (#50)

* streaming added * rename variables * updated yarn.lock * Update node version to v14 for azure-pipelines * tiledb-env added * Update viz-core to latest * Update widget.ts * Update widget.ts * Update viz-core * Update viz-core to latest Co-authored-by: Sarantopoulos Konstantinos <[email protected]>
TileDB-Inc · Dec 16, 2022 · 6cdca1d · 6cdca1d
1 parent 9cfe23e
commit 6cdca1d
Show file tree

Hide file tree

Showing 19 changed files with 468 additions and 1,156 deletions.
diff --git a/README.md b/README.md
@@ -5,7 +5,12 @@
 [![Build Status](https://dev.azure.com/TileDB-Inc/CI/_apis/build/status/TileDB-Inc.TileDB-PyBabylonJS?branchName=main)](https://dev.azure.com/TileDB-Inc/CI/_build/latest?definitionId=37&branchName=main)
 
 
-The TileDB-PyBabylonJS library is a geospatial data visualization Python library that interactively visualizes TileDB arrays with [Babylon.js](https://www.babylonjs.com) in a Jupyter notebook widget. 
+The TileDB-PyBabylonJS library is a geospatial data visualization Python library that interactively visualizes TileDB arrays with [Babylon.js](https://www.babylonjs.com) in a Jupyter notebook widget.
+
+The package is under development and currently contains:
+
+* point cloud visualizations with the option to stream all data from a TileDB array or define a bounding box to load a slice of the array
+* MBRS visualization showing the minimum bounding rectangles of the [fragments](https://docs.tiledb.com/main/background/key-concepts-and-data-format#fragments) in the sparse array containing point cloud data
 
 ## Installation
 
@@ -15,15 +20,14 @@ This project is available from [PyPI](https://pypi.org/project/pybabylonjs/) and
 pip install pybabylonjs
 ```
 
-If you are using Jupyter Notebook 5.2 or earlier, you may also need to enable
-the nbextension:
+If you are using Jupyter Notebook 5.2 or earlier, you may also need to enable the nbextension:
 ```bash
 jupyter nbextension enable --py [--sys-prefix|--user|--system] pybabylonjs
 ```
 
 ## Development Installation
 
-Create and activate a dev environment:
+Create and activate a development environment:
 
 ```bash
 conda install -c conda-forge mamba
@@ -35,21 +39,21 @@ conda activate pybabylonjs-dev
 pip install opencv-python
 ```
 
-Fork or clone the repo and go the main directory. Install the TileDB-PyBabylonJS Python package that will also build the TypeScript package:
+Fork or clone the repo and go to the main directory. Install the TileDB-PyBabylonJS Python package that will also build the TypeScript package:
 
 ```bash
 pip install -e ".[test, examples]"
 ```
 
-When developing your extensions, you need to manually enable your extensions with the notebook / lab frontend. For jupyter lab, this is done by the command:
+When developing your extensions you need to manually enable your extensions with the notebook / lab frontend. For jupyter lab this is done by the command:
 
 ```bash
 jupyter labextension install @jupyter-widgets/jupyterlab-manager
 yarn run build
 jupyter labextension install .
 ```
 
-For a classic notebook, you need to run:
+For a classic notebook you need to run:
 
 ```bash
 jupyter nbextension install --sys-prefix --symlink --overwrite --py pybabylonjs
@@ -58,14 +62,13 @@ jupyter nbextension enable --sys-prefix --py pybabylonjs
 
 Note that the `--symlink` flag doesn't work on Windows, so you will here have to run
 the `install` command every time that you rebuild your extension. For certain installations
-you might also need another flag instead of `--sys-prefix`, but we won't cover the meaning
-of those flags here.
+you might also need another flag instead of `--sys-prefix`.
 
 ### How to see your changes
 
 #### TypeScript
 
-The TypeScript code for the visualizations can be found in the [TileDB-Viz](https://github.com/TileDB-Inc/TileDB-Viz) package. After making changes in TileDB-Viz build the package with:
+The TypeScript code for the visualizations can be found in the [TileDB-Viz](https://github.com/TileDB-Inc/TileDB-Viz) repository. After making changes in TileDB-Viz build the package with:
 
 `yarn build`
 
@@ -85,41 +88,49 @@ When you make a change to the Python code rebuild the package and restart the no
 
 ### Point clouds
 
-Jupyter notebooks are provided in the [Examples folder](https://github.com/TileDB-Inc/TileDB-PyBabylonJS/tree/main/examples) for the following visualizations:
+Jupyter notebooks are provided in the [examples folder](https://github.com/TileDB-Inc/TileDB-PyBabylonJS/tree/main/examples) for the following visualizations:
 
-* [Point cloud](/examples/point_cloud.ipynb)
-* [Point cloud with a time slider](/examples/point-cloud-time.ipynb)
-* [Point cloud with a classes slider](/examples/point-cloud-classes.ipynb)
-* [Point cloud with a Mapbox base map](/examples/point-cloud-topo.ipynb)
-* [Point cloud with gltf models](/examples/point-cloud-gltf.ipynb)
-* [MBRS of a point cloud](/examples/mbrs.ipynb)
+* [Slice of the Autzen point cloud](/examples/autzen_slice.ipynb)
+* [Streaming the Autzen point cloud](/examples/autzen-streaming.ipynb)
+* [Slice of the Boulder point cloud](/examples/point-cloud-boulder.ipynb)
 
-Display a point cloud visualization from a local sparse array by specifying the bounding box of a slice of the data:
+Display a point cloud visualization from a TileDB cloud sparse array by specifying the bounding box of a slice of the data:
 
 ```python
 from pybabylonjs import Show as show
 
 bbox = {
-    'X': [636800, 637800],
-    'Y': [851000, 853000],
+    'X': [636800, 637200],
+    'Y': [852800, 853100],
     'Z': [406.14, 615.26]
 }
 
 lidar_array = "autzen-classified"
 
-show.point_cloud(source="local",
-                 uri=lidar_array,
-                 bbox = bbox)
+show.point_cloud(source="cloud",
+                 uri = "tiledb://TileDB-Inc/autzen_classified_tiledb",
+                 token = "***",
+                 bbox = bbox,
+                 particle_size = 2.5,
+                 width = 1000,
+                 height = 900,
+                 rgb_max = 65535,
+                 camera_radius = 700)
 ```
 
-<img src="examples/pointcloud.png"  width="400" height="300" />
-
-To add a slider over `GpsTime` change the `mode` to `time`:
+Or stream all data from a group of arrays:
 
 ```python
-show.point_cloud(source="local",
-                 mode="time",
-                 uri=uri,
-                 bbox=bbox)
-```    
+show.point_cloud(streaming=True,
+                 uri="***",
+                 token="***",
+                 max_levels=6,
+                 particle_size = 3,
+                 color_scheme = 'light',
+                 width = '1200px',
+                 height = '800px',
+                 rgb_max = 255,
+                 camera_radius = 800,
+                 particle_budget = 8000000)
+```
 
diff --git a/azure-pipelines.yaml b/azure-pipelines.yaml
@@ -67,7 +67,7 @@ stages:
 
     - task: NodeTool@0
       inputs:
-        versionSpec: '12.x'
+        versionSpec: '14.x'
     - script: yarn
       displayName: 'Install labextension dependencies'
       env:
@@ -121,7 +121,7 @@ stages:
 
     - task: NodeTool@0
       inputs:
-        versionSpec: '12.x'
+        versionSpec: '14.x'
     - script: |
         echo "//registry.npmjs.org/:_authToken=${NPM_TOKEN}" > ~/.npmrc
         yarn

diff --git a/examples/autzen-streaming.ipynb b/examples/autzen-streaming.ipynb
@@ -0,0 +1,119 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "id": "ea5e39c9-72ce-4032-8645-67445ab34074",
+   "metadata": {},
+   "source": [
+    "# Stream and visualize the Autzen point cloud"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "4cbfca2f-4088-4605-843f-6de49ed74b3b",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import requests\n",
+    "import json\n",
+    "\n",
+    "import pandas as pd\n",
+    "import pdal\n",
+    "from pybabylonjs import Show as show\n",
+    "import tiledb"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "e9df8cc1-8f12-46f0-86bf-5af11b76959c",
+   "metadata": {},
+   "source": [
+    "### Cloud array\n",
+    "Load and display point cloud data from cloud arrays with different levels of detail (LOD)."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "f68dfda1-7582-45f7-bc1f-f993448a9a1d",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "token = \"<token>\""
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "12fbeff2-73a2-4ff0-bc8f-bb69870948af",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "uri = \"tiledb://norman/autzen\""
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "c927a1a2-0371-4af3-bf96-1ab8ed94e337",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "show.point_cloud(streaming=True,\n",
+    "                 uri=uri,\n",
+    "                 token=token,\n",
+    "                 max_levels=6,\n",
+    "                 point_size = 3,\n",
+    "                 color_scheme = 'light',\n",
+    "                 width = '1200px',\n",
+    "                 height = '800px',\n",
+    "                 rgb_max = 255,\n",
+    "                 camera_radius = 800,\n",
+    "                 point_budget = 8000000)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "565b0786-c713-4d01-9bdf-b334db4705e3",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "show.point_cloud(streaming=True,\n",
+    "                 uri=uri,\n",
+    "                 token=token,\n",
+    "                 max_levels=6,\n",
+    "                 point_size = 3,\n",
+    "                 color_scheme = 'light',\n",
+    "                 width = '1200px',\n",
+    "                 height = '800px',\n",
+    "                 rgb_max = 255,\n",
+    "                 camera_radius = 800,\n",
+    "                 point_budget = 8000000,\n",
+    "                 use_shader = True)"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3 (ipykernel)",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.7.10"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}