Plotly Choropleth not Displaying in Streamlit

[Jackson8]

Hello!

I’m working on a Streamlit app that’s living inside Snowflake. I would like to have a plotly choropleth included to represent some state-specific data, however, the chart isn’t getting drawn correctly. The plotly chart and color legend gets displayed, but the actual map of the states isn’t available.

I could provide code, but the same issue occurs regardless of what choropleth code I use, including the examples from plotly: Choropleth maps in Python . Additionally, I can’t use the “download plot as a png” feature in the plotly chart. My other plotly figures get drawn just fine so I think this is choropleth specific. Please let me know how I can fix this!

[Cecilia]

I am having the same issue. Please, let us know if you find any workaround to resolve it!

[coffeeforkevin]

This is due to Snowflakes content security policy. The only external domain that can be loaded is mapbox. When you run the Plotly map, it is calling their CDN which Snowflake blocks.

More info in their docs here.

[Jackson8]

I was able to get a workaround using pydeck. Thank you to coffeeforkevin for the reply with the relevant documentation!

Mapbox appears to be the only supported service for drawing geospatial data for Streamlit in Snowflake due to security considerations. This means only st.map and st.pydeck_chart work. Additionally, geojson data cannot be loading in from external sources for similar reasons.

To work around this, I got geojson data from this website and stored it as a file in the Streamlit directory within Snowflake as “state_data.json”. I then used pydeck to build the chart. I can’t include my actual implementation as its part of an internal tool that has sensitive company information, but here’s a very basic choropleth implementation that should work in Streamlit in Snowflake.

import streamlit as st
import pandas as pd
import pydeck as pdk
import json

# Load GeoJSON file of U.S. states
with open("state_data.json") as f:
    geojson_data = json.load(f)

# Dummy data: state and value
df = pd.DataFrame({
    'state_name': ['California', 'Texas', 'New York', 'Florida', 'Illinois'],
    'value': [100, 80, 60, 40, 20]
})

# Create a dictionary from state name to value for quick lookup
value_map = dict(zip(df['state_name'], df['value']))

# Add a new 'value' property to each feature in the GeoJSON
for feature in geojson_data['features']:
    state_name = feature['properties']['NAME']
    feature['properties']['value'] = value_map.get(state_name, 0)  # 0 if not in dataset

# Define a color scale based on the 'value' property
def color_scale(value):
    # Scale from light to dark blue based on value (0–100)
    return [0, 0, 200, int(20 + 2 * value)]

# Add color to each feature
for feature in geojson_data['features']:
    val = feature['properties']['value']
    feature['properties']['fill_color'] = color_scale(val)

# Create the GeoJsonLayer
geojson_layer = pdk.Layer(
    "GeoJsonLayer",
    geojson_data,
    opacity=0.8,
    stroked=True,
    filled=True,
    extruded=False,
    get_fill_color="properties.fill_color",
    get_line_color=[150, 150, 150],
    pickable=True,
)

# Set viewport centered on the U.S.
view_state = pdk.ViewState(
    longitude=-98.5795,
    latitude=39.8283,
    zoom=3,
    min_zoom=2,
    max_zoom=15,
    pitch=0,
    bearing=0
)

# Render it in Streamlit with a light basemap style
st.pydeck_chart(pdk.Deck(
    layers=[geojson_layer],
    initial_view_state=view_state,
    tooltip={"text": "{NAME}: {value}"},
    map_style='mapbox://styles/mapbox/light-v10'  # light mode
))