plotly / dash-deck

Bringing deck.gl and pydeck into Dash
https://dash-gallery.plotly.host/dash-deck-explorer/
MIT License
92 stars 19 forks source link

How to use TileLayer? #28

Open fhg-isi opened 1 month ago

fhg-isi commented 1 month ago

Is TileLayer like

https://deck.gl/docs/api-reference/geo-layers/tile-layer

supported by dash-deck?

If I run the example below I get a "white screen" and following error:

layers-pass.js:96 Uncaught Error: GeoJSON does not have type
    at y (assert.js:3:11)
    at t.value (log.js:109:7)
    at geojson.js:7:7
    at e.value (geojson-layer.js:87:22)
    at e.value (layer.js:775:14)
    at e.value (layer.js:755:14)
    at e.value (layer.js:515:14)
    at e.value (layers-pass.js:238:15)
    at e.value (layers-pass.js:118:36)
    at e.value (layers-pass.js:54:38)

Then I tried to include

render_sub_layers=lambda props: pdk.Layer(
        "BitmapLayer",
        data=None,
        image=props.tile,
        bounds=props.tile_bounds,
    ),

and got

error.js:16 TypeError: this.props.renderSubLayers is not a function

=> Could you please provide an example for TileLayers in the demo folder or clarify what features of deckgl are supported in the documentation?

import dash
import dash_deck
from dash import html
import pydeck as pdk

app = dash.Dash(__name__)

# Define a TileLayer for OpenStreetMap tiles
osm_layer = pdk.Layer(
    "TileLayer",
    data="https://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
    min_zoom=0,
    max_zoom=19,
    tile_size=256,
)

# Define the initial view state
view_state = pdk.ViewState(
    longitude=-122.4,  # Centered around San Francisco
    latitude=37.8,
    zoom=10,
    pitch=0,
    bearing=0,
)

# Create the deck.gl instance
r = pdk.Deck(
    layers=[osm_layer],
    initial_view_state=view_state,
)

# Define the layout of the Dash app
app.layout = html.Div(
    [
        dash_deck.DeckGL(
            r.to_json(),
            id="deck-gl",
            style={"height": "100vh"},
        ),
    ]
)

if __name__ == "__main__":
    app.run_server(debug=True)
fhg-isi commented 1 month ago

dash-deck seems to use pydeck and pydeck did not implement TileLayer:

https://github.com/visgl/deck.gl/issues/4637