How to overlay density heatmap with scattermapbox?

I am using scattermapbox in my application and plotting a few point coordinates. Now, I have some census tract level data with geometries and would like to add a layer on top of the point coordinates data from a callback.

I’d like to overlay demographic data based on callback from the checklist with population field as key.

Census data with geometries:


layout = html.Div([


                                               {'label': 'Income', 'value': 'Income'},
                                               {'label': 'Population', 'value': 'Population'}




                          Output("map-graph", "figure")


                          Input("address_dropdown", "value"),
def update_graph(address):

    # Default map view
    layout_lat = 37.7749
    layout_lon = -122.4194

    zoom = 12

    data = []


                        "type": "scattermapbox",
                        "lat": df['Lat'],
                        "lon": df['Long'],
                        "name": "Location",
                        "hovertext": propname,
                        "showlegend": False,
                        "hoverinfo": "text",
                        "mode": "markers",
                        "clickmode": "event+select",
                        "customdata": df.loc[:,cd_cols].values,
                        "marker": {
                            "symbol": "circle",
                            "size": 8,
                            "opacity": 0.8,
                            "color": "black"

        layout = {

                     "autosize": True,
                     "hovermode": "closest",
                     "mapbox": {

                         "accesstoken": MAPBOX_KEY,
                         "bearing": 0,
                         "center": {
                             "lat": layout_lat,
                             "lon": layout_lon
                         "pitch": 0,
                         "zoom": zoom,
                         "style": "streets",


                     "margin": {
                        "r": 0,
                        "t": 0,
                        "l": 0,
                        "b": 0,
                        "pad": 0


Reference docs:

This is what I have been using for a similar purpose