Black Lives Matter. Please consider donating to Black Girls Code today.
Dash Enterprise delivers an incredible 21x cost savings 💸Download the e-book!

Hoverinfo over fill area of polygon

I can’t get hoverinfo to display above the fill area of a polygon. The popups only display along the coordinates on the boundary of the polygon. Is using Choropleth-Mapbox the only way to have the hoverinfo display over polygons?

Simple example:

I have a sfc df with population and county for some US counties. Hoverinfo only shows up along the boundaries.

df <- st_sf(county = 'some county', 
                 population = 100,
                 st_sfc(st_polygon(list(
      matrix(c(-96.905922, 41.742763, 
               -97.019911, 41.74298,
               -96.82367, 42.09041,
               -96.55551, 42.08996,
               -96.905922, 41.742763), 
             nrow = 5, byrow = T))))) 

plot_mapbox() %>% 
  add_sf(data = df,
         hoverinfo = "text",
         hovertext = ~population,
         name = ~county,
         mode = "lines")

@hiorhi Thanks for your question! When the trace is scatter, I believe you can accomplish this using hoveron = "fills", but for the moment this is not supported when the trace is scatter_mapbox.

Otherwise, I believe you’re correct that choroplethmapbox is the best option for now.

Another options is Dash Leaflet. I guess you could achieve the desired behavior simply by adding a ToopTip. Here is a small example,

import dash
import dash_html_components as html
import dash_leaflet as dl

# Create a geojson object.
polygon = dict(type='Polygon', coordinates=([[(-104, 39), (-104, 45), (-90, 39), (-104, 39)]]))
data = dict(type='FeatureCollection', features=[polygon])
geojson = dl.GeoJSON(id='geojson_layer', data=data, zoomToBounds=True, children=dl.Tooltip("Hello"))
# Create an example app.
app = dash.Dash()
app.layout = html.Div([dl.Map([dl.TileLayer(), geojson], style=dict(height='50vh'), id="map")])

if __name__ == '__main__':
    app.run_server(port=9988)
1 Like

Thanks for the great suggestion @Emil! Since @hiorhi appears to be using Dash for R, I’ve translated your solution.

There isn’t a released version of dashLeaflet for R yet, but I’ve opened a quick PR here: https://github.com/thedirtyfew/dash-leaflet/pull/47.

library(dash)
library(dashHtmlComponents)
library(dashLeaflet)

polygon <- list(
    type = "Polygon",
    coordinates = list(
        list(
            c(-104, 39),
            c(-104, 45),
            c(-90, 39),
            c(-104, 39)
        )
    )
)

featuredata <- list(
    type = "FeatureCollection",
    features = list(polygon)
)

geojson <- dlGeoJSON(
    id = "geojson_layer",
    data = featuredata,
    zoomToBounds = TRUE,
    children = dlTooltip("Hello")
)

app <- Dash$new()

app$layout(htmlDiv(
    list(
        dlMap(
            list(
                dlTileLayer(),
                geojson
            ),
            style = list(height = "50vh"),
            id = "map"
        )
    )
  )
)

app$run_server()
2 Likes

Ah, sorry, i didn’t see the R tag! Thanks for the example and PR, @rpkyle :slight_smile:

1 Like