Altair geojson map not rendering

I was trying to create a map of NYC boroughs using geojson data. However, in Streamlit, the zones are not displayed at all. So, I checked to see whether I could render the map outside of Streamlit, and it works. Here is my code

import geopandas as gpd
import json
import altair as alt

with open('taxi_zones.geojson', 'r') as json_data:
    geo_data = json.load(json_data)

geo_df = gpd.GeoDataFrame.from_features(geo_data)
geo_df = geo_df[['location_id','zone','geometry']]

choropleth = alt.Chart(alt.Data(values=json.loads(geo_df.to_json())["features"])).mark_geoshape(
    stroke='black',
    strokeWidth=1
).encode(
    color=alt.Color('properties.zone:N', scale=alt.Scale(scheme='viridis'), title="Zone"),
    tooltip=['properties.zone:N']
)
choropleth

Inside streamlit, I use the st.altair_chart() function to render it. Any clue why it doesn’t work.

I tried it with two different versions of altair - 4.2.2 and 5.2.0. It works outside of Streamlit just fine. I am running Python 3.8.3 and Streamlit 1.31.1

The taxi zones geojson is available here

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.