Merge branch 'dev' into feature/color-utils

Author: stfnkth

docs/changelog.md

@@ -2,6 +2,8 @@
 
 ## maplibre v0.2.7 (unreleased)
 
+* Add `sources.VectorTileSource` ([Martenz](https://github.com/Martenz))
+
 * Shiny
   * Add `input.{output_id}_view_state` dict containing `{"center", "zoom", "bounds", "pitch", "bearing"}`
   * Rename `input.{output_id}` to `input.{output_id}_clicked`

docs/examples/vector_tiles/app.html

@@ -0,0 +1,53 @@
+# Example taken from here:
+# https://maplibre.org/maplibre-gl-js/docs/API/classes/VectorTileSource/
+# https://maplibre.org/maplibre-style-spec/sources/
+
+import webbrowser
+
+from maplibre import Layer, LayerType, Map, MapOptions, render_maplibregl
+from maplibre.basemaps import Carto
+from maplibre.controls import NavigationControl
+from maplibre.sources import VectorTileSource
+from shiny.express import input, render, ui
+
+# Get layer ids and pbf url from here
+VECTOR_TILES_URL = "https://demotiles.maplibre.org/tiles/tiles.json"
+LAYER_ID = "countries"
+
+vector_source = VectorTileSource(
+    url=VECTOR_TILES_URL,
+    # tiles=["https://demotiles.maplibre.org/tiles/{z}/{x}/{y}.pbf"],
+    min_zoom=0,
+    max_zoom=6,
+)
+
+vector_layer = Layer(
+    type=LayerType.FILL,
+    id=LAYER_ID,
+    source=vector_source,
+    paint={"fill-color": "lightgreen", "fill-outline-color": "black"},
+    source_layer="countries",
+)
+
+
+def create_map():
+    m = Map(MapOptions(style=Carto.POSITRON, center=(11, 42), zoom=3, hash=True))
+    m.add_control(NavigationControl())
+    m.add_layer(vector_layer)
+    m.add_tooltip(LAYER_ID)
+    return m
+
+
+@render_maplibregl
+def render_map():
+    return create_map()
+
+
+if __name__ == "__main__":
+    file_name = "docs/examples/vector_tiles/app.html"
+
+    m = create_map()
+    with open(file_name, "w") as f:
+        f.write(m.to_html())
+
+    webbrowser.open(file_name)

docs/examples/vector_tiles/app.py

@@ -0,0 +1,13 @@
+<!-- <a href="app.html" target="_blank">See example in action</a> -->
+
+<iframe src="app.html" height="620px", width="100%" style="border:none;"></iframe>
+
+```python
+-8<-- "vector_tiles/app.py"
+```
+
+Run example:
+
+``` bash
+shiny run docs/examples/vector_tiles/app.py
+```

docs/examples/vector_tiles/index.md

@@ -1,7 +1,7 @@
 from __future__ import annotations
 
 from enum import Enum
-from typing import Union
+from typing import Optional, Union
 
 from pydantic import ConfigDict, Field, computed_field
 
@@ -35,7 +35,8 @@ class GeoJSONSource(Source):
     Examples:
         >>> from maplibre.sources import GeoJSONSource
 
-        >>> source = GeoJSONSource(data="https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson")
+        >>> geojson = "https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson"
+        >>> source = GeoJSONSource(data=geojson)
     """
 
     data: Union[str, dict]
@@ -64,7 +65,8 @@ class RasterTileSource(Source):
 
     Examples:
         >>> from maplibre.sources import RasterTileSource
-        >>> raster_source = RasterTileSource(
+
+        >>> raster_tile_source = RasterTileSource(
         ...     tiles=["https://tile.openstreetmap.org/{z}/{x}/{y}.png"],
         ...     tile_size=256,
         ...     min_zoom=0,
@@ -86,3 +88,40 @@ class RasterTileSource(Source):
     @property
     def type(self) -> str:
         return SourceType.RASTER.value
+
+
+class VectorTileSource(Source):
+    """Vector tile source
+
+    Examples:
+        >>> from maplibre.sources import VectorTileSource
+        >>> from maplibre import LayerType, Layer
+
+        >>> vector_tile_source = VectorTileSource(
+        ...     tiles=["https://demotiles.maplibre.org/tiles/{z}/{x}/{y}.pbf"],
+        ...     min_zoom=0,
+        ...     max_zoom=6,
+        ... )
+
+        >>> layer = Layer(
+        ...     type=LayerType.LINE,
+        ...     id="countries",
+        ...     source=vector_tile_source,
+        ...     source_layer="countries",
+        ...     paint={"fill-color": "lightgreen", "fill-outline-color": "black"},
+        ... )
+    """
+
+    attribution: str = None
+    bounds: tuple = None
+    max_zoom: int = Field(None, serialization_alias="maxzoom")
+    min_zoom: int = Field(None, serialization_alias="minzoom")
+    scheme: str = None
+    tiles: Union[tuple, list] = None
+    url: str = None
+    volatile: bool = None
+
+    @computed_field
+    @property
+    def type(self) -> str:
+        return SourceType.VECTOR.value

maplibre/sources.py

@@ -41,6 +41,7 @@ nav:
       - PMTiles: examples/pmtiles/index.md
       - Mapbox Draw Plugin: examples/mapbox_draw_plugin/index.md
       - Layer Switcher: examples/layer_switcher/index.md
+      - Vector Tiles: examples/vector_tiles/index.md
 plugins:
   - search:
   - mkdocstrings:

mkdocs.yml

@@ -21,3 +21,25 @@ def test_geojson_source():
         "clusterRadius": 2,
         "clusterMinPoints": 10,
     }
+
+
+def test_vector_tile_source():
+    # Prepare
+    tiles = ["https://demotiles.maplibre.org/tiles/{z}/{x}/{y}.pbf"]
+    min_zoom = 0
+    max_zoom = 6
+
+    # Act
+    vector_tile_source = VectorTileSource(
+        tiles=tiles, min_zoom=min_zoom, max_zoom=max_zoom
+    )
+    print(vector_tile_source)
+    print(vector_tile_source.to_dict())
+
+    # Assert
+    assert vector_tile_source.to_dict() == {
+        "maxzoom": max_zoom,
+        "minzoom": min_zoom,
+        "tiles": tiles,
+        "type": "vector",
+    }