Step 1: Right click the "Open in Github Codespaces" button above, open the link in a new tab and then click Fork!
(Eat a 🍪 while you wait)
Step 2: Press "Create new Codespace"
(Check your bluesky while you wait)
Step 3: After a minute or two, you should see an editor (it may take a few seconds after the page has loaded), and then a browser should open to the right (You can resize the site to see the whole app better)
Step 1: Download one of the csvs above in this repository
Step 2: In a new tab, open https://vizzu-builder.streamlit.app/ and upload the CSV you just downloaded.
Step 3: Choose 1 Category and one or more Values columns and hit Create Charts
to see the different kinds of charts you can make.
Step 4: Pick a chart you like and expand the "Show code" expander and press the Copy button at the top right of the section.
Step 5: Go back to the Codespaces instance, and add a new file in the pages/ folder called my_chart.py
.
Step 6: Paste the code for your chart into the new file and save it. Re-run your app by pressing r
. You should now see a new entry in the sidebar of your app
Step 7: Take a look at the code for "pages/racing.py" to see how you can make your chart dynamically transform with streamlit widgets, and have fun!
config = {}
if st.toggle("Order by total"):
config["sort"] = "byValue"
else:
config["sort"] = "none"
year = st.slider(
"Year",
min_value=df["Year"].min(),
max_value=df["Year"].max(),
value=df["Year"].min(),
step=1,
)
filter = Data.filter(f"record['Year'] == {year}")
chart.animate(Config(config), filter)