added style

QuantStack · Jul 25, 2024 · 78cb921 · 78cb921
1 parent fb1514b
commit 78cb921
Show file tree

Hide file tree

Showing 8 changed files with 2,546 additions and 2,491 deletions.
diff --git a/.gitignore b/.gitignore
@@ -128,7 +128,7 @@ ehthumbs.db
 
 # Folder config file
 Desktop.ini
-.config
+.config.ini
 
 # Recycle Bin used on file shares
 $RECYCLE.BIN/

diff --git a/examples/RasterLayer.ipynb b/examples/RasterLayer.ipynb
@@ -38,7 +38,7 @@
     {
      "data": {
       "application/vnd.jupyter.widget-view+json": {
-       "model_id": "",
+       "model_id": "bf54f7b270eb4c12ba2fbcaeea2583da",
        "version_major": 2,
        "version_minor": 0
       },

diff --git a/examples/VectorTileLayer.ipynb b/examples/VectorTileLayer.ipynb
@@ -2,7 +2,7 @@
  "cells": [
   {
    "cell_type": "code",
-   "execution_count": 33,
+   "execution_count": 23,
    "id": "3e872bf4-ebce-4bf9-a693-45bbe7296b50",
    "metadata": {},
    "outputs": [],
@@ -12,7 +12,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 34,
+   "execution_count": 24,
    "id": "b86d142b-3904-4340-ab94-285b25998834",
    "metadata": {},
    "outputs": [],
@@ -25,22 +25,22 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 35,
+   "execution_count": 25,
    "id": "7fa3311c-d409-4c46-9493-5d99cc92bd49",
    "metadata": {},
    "outputs": [
     {
      "data": {
       "application/vnd.jupyter.widget-view+json": {
-       "model_id": "3057141b3f094af59902b5c157349fdd",
+       "model_id": "",
        "version_major": 2,
        "version_minor": 0
       },
       "text/plain": [
        "Map(center=[4.299875503991089, 46.85012303279379], zoom=0.0)"
       ]
      },
-     "execution_count": 35,
+     "execution_count": 25,
      "metadata": {},
      "output_type": "execute_result"
     }
@@ -52,21 +52,18 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 36,
+   "execution_count": 26,
    "id": "45bcff0e-d17e-45c1-8ae3-cde10b6936a8",
    "metadata": {},
    "outputs": [],
    "source": [
-    "attributions = '<a href=\"https://www.maptiler.com/copyright/\" target=\"_blank\">&copy; MapTiler</a> ' +'<a href=\"https://www.openstreetmap.org/copyright\" target=\"_blank\">&copy; OpenStreetMap contributors</a>';\n",
-    "\n",
-    "raster = RasterTileLayer(attributions=attributions,url='https://api.maptiler.com/maps/dataviz-dark/{z}/{x}/{y}.png?key=' + key,\n",
-    "    tileSize= 512)\n",
+    "raster=RasterTileLayer()\n",
     "m.add_layer(raster) "
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 37,
+   "execution_count": 27,
    "id": "925df5fd-5165-4e6f-a2bd-aa9c875c3b42",
    "metadata": {},
    "outputs": [],
@@ -83,7 +80,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 38,
+   "execution_count": 28,
    "id": "52a18ec7-981b-4182-846f-91c372aeac98",
    "metadata": {},
    "outputs": [],
@@ -93,7 +90,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 39,
+   "execution_count": 29,
    "id": "2a617173-7a1e-4e9a-a9db-3b3d6085b5ea",
    "metadata": {},
    "outputs": [],
@@ -105,7 +102,6 @@
     "        'type': 'MVT',\n",
     "    }\n",
     ")\n",
-    "\n",
     "# Configuration des autres propriétés du layer\n",
     "layer.attribution =   '<a href=\"https://www.maptiler.com/copyright/\" target=\"_blank\">&copy; MapTiler</a> ' + '<a href=\"https://www.openstreetmap.org/copyright\" target=\"_blank\">&copy; OpenStreetMap contributors</a>'\n",
     "layer.opacity = 0.8\n",
@@ -116,61 +112,45 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 40,
-   "id": "afc43b3c-805f-4144-97a1-43c9987e9558",
+   "execution_count": 30,
+   "id": "ba96582e-a837-49df-b98d-aa1f2fa9ada5",
    "metadata": {},
    "outputs": [],
    "source": [
-    "m.remove_layer(layer)"
+    "style = {\n",
+    "    'strokeColor': '#1E90FF',  # Dodger Blue for stroke\n",
+    "    'strokeWidth': 2,          # Moderate width for visibility\n",
+    "    'pointRadius': 7,          # Medium radius for points\n",
+    "    'fillColor': '#FFB6C1',    # Light Pink for fill\n",
+    "    'pointFillColor': '#98FB98',  # Pale Green for point fill\n",
+    "    'pointStrokeColor': '#8A2BE2', # Blue Violet for point stroke\n",
+    "    'pointStrokeWidth': 1.5       # Slightly increased width for point stroke\n",
+    "}"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 22,
-   "id": "b6538136-72ca-4bf7-b534-43d99c1f06ba",
-   "metadata": {},
-   "outputs": [],
-   "source": [
-    "#MVT\n",
-    "layer_mvt = VectorTileLayer(\n",
-    "    url='https://ahocevar.com/geoserver/gwc/service/tms/1.0.0/' +'ne:ne_10m_admin_0_countries@EPSG%3A900913@pbf/{z}/{x}/{-y}.pbf',\n",
-    "    source_format={\n",
-    "        'type': 'MVT',\n",
-    "        #'geometry_name': '',  # Décommenter et remplir si nécessaire\n",
-    "        #'layer_name': '',     # Décommenter et remplir si nécessaire\n",
-    "        #'layers': ['', ''],   # Décommenter et remplir si nécessaire\n",
-    "    }\n",
-    ")\n",
-    "layer.attribution = \"© OpenStreetMap contributors\"\n",
-    "layer.opacity = 0.8\n",
-    "layer.min_zoom = 1\n",
-    "layer.max_zoom = 20\n",
-    "m.add_layer(layer_mvt)"
-   ]
-  },
-  {
-   "cell_type": "code",
-   "execution_count": 23,
-   "id": "ad320792-4cbd-412d-927d-212c9129fbce",
+   "execution_count": 31,
+   "id": "cc12097b-8d4c-4cc1-a43e-126137249db8",
    "metadata": {},
    "outputs": [],
    "source": [
-    "layer_mvt.url='https://basemaps.arcgis.com/arcgis/rest/services/World_Basemap_v2/VectorTileServer/tile/{z}/{y}/{x}.pbf'\n"
+    "layer.style=style"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 24,
-   "id": "dc29f47d-6517-4ecf-97f6-3606f6c568bd",
+   "execution_count": 32,
+   "id": "afc43b3c-805f-4144-97a1-43c9987e9558",
    "metadata": {},
    "outputs": [],
    "source": [
-    "m.remove_layer(layer_mvt)"
+    "m.remove_layer(layer)"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 25,
+   "execution_count": 47,
    "id": "5b8fe6af-f413-4244-b94d-88bcf114bb0d",
    "metadata": {},
    "outputs": [],
@@ -180,9 +160,9 @@
     "    url='https://openlayers.org/data/vector/ecoregions.json',\n",
     "    source_format={\n",
     "        'type': 'GeoJSON',\n",
-    "        #'geometry_name': '',  # Décommenter et remplir si nécessaire\n",
-    "        #'layer_name': '',     # Décommenter et remplir si nécessaire\n",
-    "        #'layers': ['', ''],   # Décommenter et remplir si nécessaire\n",
+    "        #'geometry_name': '',  \n",
+    "        #'layer_name': '',     \n",
+    "        #'layers': ['', ''], \n",
     "    }\n",
     ")\n",
     "layer_Geo.attribution = \"© OpenStreetMap contributors\"\n",
@@ -194,7 +174,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 26,
+   "execution_count": 34,
    "id": "1bd06741-2430-42f6-a97a-ce73d73eb9e1",
    "metadata": {},
    "outputs": [],
@@ -204,53 +184,116 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 27,
-   "id": "93efaf21-c8a0-43cb-9e6b-efe7851ef9b1",
+   "execution_count": 35,
+   "id": "b6538136-72ca-4bf7-b534-43d99c1f06ba",
    "metadata": {},
    "outputs": [],
    "source": [
-    "layer.source_format={\n",
-    "        'type': 'GeoJSON'}"
+    "#MVT\n",
+    "layer_mvt = VectorTileLayer(\n",
+    "    url='https://ahocevar.com/geoserver/gwc/service/tms/1.0.0/' +'ne:ne_10m_admin_0_countries@EPSG%3A900913@pbf/{z}/{x}/{-y}.pbf',\n",
+    "    source_format={\n",
+    "        'type': 'MVT',\n",
+    "        #'geometry_name': '',  \n",
+    "        #'layer_name': '',     \n",
+    "        #'layers': ['', ''],\n",
+    "    }\n",
+    ")\n",
+    "layer_mvt.attribution = \"© OpenStreetMap contributors\"\n",
+    "layer_mvt.opacity = 0.8\n",
+    "layer_mvt.min_zoom = 1\n",
+    "layer_mvt.max_zoom = 20\n",
+    "m.add_layer(layer_mvt)"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 28,
-   "id": "84fcf518-e268-4836-a675-b628e731ba3b",
+   "execution_count": 36,
+   "id": "b7b77d74-d657-4109-b892-5a0823faf59c",
    "metadata": {},
    "outputs": [],
    "source": [
-    "layer.url='https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson'"
+    "style = {\n",
+    "    'strokeColor': '#FF4500',  # Orange Red for stroke\n",
+    "    'strokeWidth': 2,          # Moderate width for visibility\n",
+    "    'pointRadius': 8,          # Medium radius for points\n",
+    "    'fillColor': '#2E8B57',    # Sea Green for fill\n",
+    "    'pointFillColor': '#FFD700',  # Gold for point fill\n",
+    "    'pointStrokeColor': '#4B0082', # Indigo for point stroke\n",
+    "    'pointStrokeWidth': 1.5       # Slightly increased width for point stroke\n",
+    "}"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 29,
-   "id": "d79c4f8d-ee37-4590-98eb-653975f4c737",
+   "execution_count": 37,
+   "id": "476f7a69-2efa-4c78-9ea5-f4483a820cbb",
    "metadata": {},
    "outputs": [],
    "source": [
-    "m.add_layer(layer)"
+    "layer_mvt.style=style"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 30,
+   "execution_count": 38,
+   "id": "ad320792-4cbd-412d-927d-212c9129fbce",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "layer_mvt.url='https://basemaps.arcgis.com/arcgis/rest/services/World_Basemap_v2/VectorTileServer/tile/{z}/{y}/{x}.pbf'\n"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 39,
+   "id": "dc29f47d-6517-4ecf-97f6-3606f6c568bd",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "m.remove_layer(layer_mvt)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 40,
+   "id": "93efaf21-c8a0-43cb-9e6b-efe7851ef9b1",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "layer_mvt.source_format={\n",
+    "        'type': 'GeoJSON'}"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 42,
+   "id": "84fcf518-e268-4836-a675-b628e731ba3b",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "layer_mvt.url='https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson'\n",
+    "m.add_layer(layer_mvt)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 44,
    "id": "6bf30428-a7c8-4798-b4fc-1b9ebb50edcd",
    "metadata": {},
    "outputs": [],
    "source": [
-    "layer.opacity = 0.8"
+    "layer_mvt.opacity = 0.1"
    ]
   },
   {
    "cell_type": "code",
-   "execution_count": 31,
+   "execution_count": 45,
    "id": "4a9f7252-456c-4d0e-ba73-1a1af144bab0",
    "metadata": {},
    "outputs": [],
    "source": [
-    "m.remove_layer(layer)"
+    "m.remove_layer(layer_mvt)"
    ]
   },
   {

diff --git a/package.json b/package.json
@@ -50,7 +50,6 @@
   },
   "dependencies": {
     "@jupyter-widgets/base": "^1.1.10 || ^2 || ^3 || ^4 || ^5 || ^6",
-    "dotenv": "^16.4.5",
     "ol": "^9.1.0"
   },
   "devDependencies": {

diff --git a/src/geojson.ts b/src/geojson.ts
@@ -39,7 +39,7 @@ export class OpenLayersGeoJSONModel extends LayerModel {
 }
 
 export class OpenLayersGeoJSONView extends LayerView {
-  obj: VectorLayer<VectorSource>;
+  obj: VectorLayer<any>;
   render() {
     this.initVectorLayer();
     this.create_obj();
@@ -109,6 +109,6 @@ export class OpenLayersGeoJSONView extends LayerView {
     this.listenTo(this.model, 'change:data', this.updateData);
     this.listenTo(this.model, 'change:visible', this.updateVisibility);
   }
-  vectorLayer: VectorLayer<VectorSource>;
+  vectorLayer: VectorLayer<any>;
   vectorSource: VectorSource;
 }
diff --git a/src/heatmap.ts b/src/heatmap.ts
@@ -36,7 +36,7 @@ export class HeatmapLayerModel extends LayerModel {
 }
 
 export class HeatmapLayerView extends LayerView {
-  obj: Heatmap;
+  obj: Heatmap<any>;
 
   render() {
     this.create_obj();