Display map with localtileserver and dcc.Graph

[zy45]

Hi folks,

I am trying to visualize georeferenced tiff image with dash.

First, I built local tileserver:

from localtileserver import TileClient, get_leaflet_tile_layer

# Map layer
wsi_client = TileClient('../output.tiff')
wsi_tile_layer = get_leaflet_tile_layer(wsi_client)

Then, I used dash_leaflet:

import dash_leaflet as dl

dl.Map(
    id='wsi-map',
    center=wsi_client.center(),
    children=[
        dl.TileLayer(url=wsi_tile_layer.url),
    ],
    style={
        'width': '500pt',
        'height': '500pt',
        'margin': 'auto',
    },
),

The image was sucessfully displayed. However, I do NOT want to use dash_leaflet because it does not have the functionality (lots of hovering options) of dcc.Graph. As suggested in this official post, I tried dcc.Graph and mapbox by the following:

from dash import dcc

dcc.Graph(
    id='wsi-map-dcc',
    figure=dict(
        layout={
            'mapbox_style': 'white-bg',
            'mapbox_layers': {
                'below': 'traces',
                'source': [
                    wsi_tile_layer.url,
                ],
                'sourcetype': 'image',
            }
        }
    )
),

It only shows me blank area. Anyone has a suggestion? I really appreciate any help from you.

[Emil]

Could you elaborate on what hover options that you are missing in dash-leaflet?

[zy45]

Hi Emil. Thank you so much for your reply. Here is a sample figure produced by dcc.Graph. There are some tools on the top of the image. It allows lasso selection, box selection, auto scale, reset axis, etc.

So my current plan is either adding those hover options to dash_leaflet, or trying to use dcc.Graph instead. Any kind of help is appreciated