Add top-5-income-share-shiny (#106)

* Add top-5-income-share-shiny
* Use example category

---------

Co-authored-by: Jordan Jensen <[email protected]>

Author: cgraham-rs

.github/workflows/extensions.yml

@@ -34,6 +34,7 @@ jobs:
             quarto-stock-report-python: extensions/quarto-stock-report-python/**
             quarto-website: extensions/quarto-website/**
             portfolio-dashboard: extensions/portfolio-dashboard/**
+            top-5-income-share-shiny: extensions/top-5-income-share-shiny/**
             quarto-document: extensions/quarto-document/**
             stock-api-plumber: extensions/stock-api-plumber/**
             stock-api-flask: extensions/stock-api-flask/**

extensions/top-5-income-share-shiny/README.md

@@ -0,0 +1,15 @@
+# Top 5% income share
+
+## About this example
+
+A Shiny application makes it easy to transform your analysis into an interactive application using Python so users can ask and answer their own questions in real-time.
+
+
+## Learn more
+
+* [Shiny for Python documentation](https://shiny.posit.co/py/)
+* [Shiny for Python examples](https://shinylive.io/py/examples/)
+
+## Requirements
+
+* Python version 3.9 or higher

extensions/top-5-income-share-shiny/app.py

@@ -0,0 +1,90 @@
+import altair as alt
+import pandas as pd
+from shinywidgets import output_widget, render_widget
+from shiny import App, reactive, ui
+
+income_shares = pd.read_csv("data.csv")
+countries = income_shares["Entity"].unique().tolist()
+
+select_countries = {
+    "default": ["Australia", "China", "Germany", "Japan", "United States"],
+    "latam": ["Argentina", "Uruguay"],
+    "apac": ["Australia", "China", "Singapore", "Japan", "Korea, South"],
+    "emea": ["Mauritius", "France", "Italy", "Norway", "Spain"],
+    "na": ["United States", "Canada"],
+}
+
+app_ui = ui.page_fluid(
+    ui.panel_title("Top 5% Income Share"),
+    ui.p("Share of income received by the richest 5% of the population"),
+    ui.layout_sidebar(
+        ui.sidebar(
+            ui.input_selectize(
+                "countries",
+                "Countries:",
+                choices=countries,
+                multiple=True,
+                selected=select_countries["default"],
+            ),
+            ui.p("Regions:"),
+            ui.TagList(
+                ui.div(
+                    {"class": "btn-group"},
+                    ui.input_action_button("apac", "APAC"),
+                    ui.input_action_button("emea", "EMEA"),
+                    ui.input_action_button("latam", "LATAM"),
+                    ui.input_action_button("na", "NA"),
+                )
+            ),
+            ui.input_slider(
+                "year_range",
+                "Year Range:",
+                min=1946,
+                max=2015,
+                value=(1946, 2015),
+                sep="",
+            ),
+        ),
+        output_widget("income_plot", width="800px"),
+    ),
+)
+
+
+def server(input, output, session):
+    @reactive.Calc
+    def plot_data():
+        df = income_shares.loc[
+            (income_shares["Entity"].isin(input.countries()))
+            & (income_shares["Year"] >= input.year_range()[0])
+            & (income_shares["Year"] <= input.year_range()[1])
+        ]
+        return df
+
+    @output
+    @render_widget
+    def income_plot():
+        chart = (
+            alt.Chart(plot_data())
+            .mark_line()
+            .encode(
+                x=alt.X("Year", axis=alt.Axis(format="d")),
+                y=alt.Y("Percent", axis=alt.Axis(format="~s")),
+                color="Entity",
+                strokeDash="Entity",
+            )
+        )
+        return chart
+
+    def make_button_listener(name):
+        @reactive.Effect
+        @reactive.event(input[name])
+        def _():
+            ui.update_selectize("countries", selected=select_countries[name])
+
+    for name in select_countries.keys():
+        make_button_listener(name)
+
+
+app = App(app_ui, server)
+if __name__ == "__main__":
+    app.run()