Upload with huggingface_hub

README.md

@@ -1,12 +1,11 @@
+
 ---
-title: Altair Plot Main
+title: altair_plot_main 
 emoji: 🔥
-colorFrom: purple
-colorTo: red
+colorFrom: indigo
+colorTo: indigo
 sdk: gradio
 sdk_version: 3.12.0
-app_file: app.py
+app_file: run.py
 pinned: false
 ---
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

requirements.txt

@@ -0,0 +1,3 @@
+altair
+vega_datasets
+https://gradio-main-build.s3.amazonaws.com/bed288a509ebd0edd56f812bc14fd947084e0933/gradio-3.12.0-py3-none-any.whl

run.ipynb

@@ -0,0 +1 @@
+{"cells": [{"cell_type": "markdown", "id": 302934307671667531413257853548643485645, "metadata": {}, "source": ["# Gradio Demo: altair_plot"]}, {"cell_type": "code", "execution_count": null, "id": 272996653310673477252411125948039410165, "metadata": {}, "outputs": [], "source": ["!pip install -q gradio altair vega_datasets"]}, {"cell_type": "code", "execution_count": null, "id": 288918539441861185822528903084949547379, "metadata": {}, "outputs": [], "source": ["import altair as alt\n", "import gradio as gr\n", "import numpy as np\n", "import pandas as pd\n", "from vega_datasets import data\n", "\n", "\n", "def make_plot(plot_type):\n", "    if plot_type == \"scatter_plot\":\n", "        cars = data.cars()\n", "        return alt.Chart(cars).mark_point().encode(\n", "            x='Horsepower',\n", "            y='Miles_per_Gallon',\n", "            color='Origin',\n", "        )\n", "    elif plot_type == \"heatmap\":\n", "        # Compute x^2 + y^2 across a 2D grid\n", "        x, y = np.meshgrid(range(-5, 5), range(-5, 5))\n", "        z = x ** 2 + y ** 2\n", "\n", "        # Convert this grid to columnar data expected by Altair\n", "        source = pd.DataFrame({'x': x.ravel(),\n", "                            'y': y.ravel(),\n", "                            'z': z.ravel()})\n", "        return alt.Chart(source).mark_rect().encode(\n", "            x='x:O',\n", "            y='y:O',\n", "            color='z:Q'\n", "        )\n", "    elif plot_type == \"us_map\":\n", "        states = alt.topo_feature(data.us_10m.url, 'states')\n", "        source = data.income.url\n", "\n", "        return alt.Chart(source).mark_geoshape().encode(\n", "            shape='geo:G',\n", "            color='pct:Q',\n", "            tooltip=['name:N', 'pct:Q'],\n", "            facet=alt.Facet('group:N', columns=2),\n", "        ).transform_lookup(\n", "            lookup='id',\n", "            from_=alt.LookupData(data=states, key='id'),\n", "            as_='geo'\n", "        ).properties(\n", "            width=300,\n", "            height=175,\n", "        ).project(\n", "            type='albersUsa'\n", "        )\n", "    elif plot_type == \"interactive_barplot\":\n", "        source = data.movies.url\n", "\n", "        pts = alt.selection(type=\"single\", encodings=['x'])\n", "\n", "        rect = alt.Chart(data.movies.url).mark_rect().encode(\n", "            alt.X('IMDB_Rating:Q', bin=True),\n", "            alt.Y('Rotten_Tomatoes_Rating:Q', bin=True),\n", "            alt.Color('count()',\n", "                scale=alt.Scale(scheme='greenblue'),\n", "                legend=alt.Legend(title='Total Records')\n", "            )\n", "        )\n", "\n", "        circ = rect.mark_point().encode(\n", "            alt.ColorValue('grey'),\n", "            alt.Size('count()',\n", "                legend=alt.Legend(title='Records in Selection')\n", "            )\n", "        ).transform_filter(\n", "            pts\n", "        )\n", "\n", "        bar = alt.Chart(source).mark_bar().encode(\n", "            x='Major_Genre:N',\n", "            y='count()',\n", "            color=alt.condition(pts, alt.ColorValue(\"steelblue\"), alt.ColorValue(\"grey\"))\n", "        ).properties(\n", "            width=550,\n", "            height=200\n", "        ).add_selection(pts)\n", "\n", "        plot = alt.vconcat(\n", "            rect + circ,\n", "            bar\n", "        ).resolve_legend(\n", "            color=\"independent\",\n", "            size=\"independent\"\n", "        )\n", "        return plot\n", "    elif plot_type == \"radial\":\n", "        source = pd.DataFrame({\"values\": [12, 23, 47, 6, 52, 19]})\n", "\n", "        base = alt.Chart(source).encode(\n", "            theta=alt.Theta(\"values:Q\", stack=True),\n", "            radius=alt.Radius(\"values\", scale=alt.Scale(type=\"sqrt\", zero=True, rangeMin=20)),\n", "            color=\"values:N\",\n", "        )\n", "\n", "        c1 = base.mark_arc(innerRadius=20, stroke=\"#fff\")\n", "\n", "        c2 = base.mark_text(radiusOffset=10).encode(text=\"values:Q\")\n", "\n", "        return c1 + c2\n", "    elif plot_type == \"multiline\":\n", "        source = data.stocks()\n", "\n", "        highlight = alt.selection(type='single', on='mouseover',\n", "                                fields=['symbol'], nearest=True)\n", "\n", "        base = alt.Chart(source).encode(\n", "            x='date:T',\n", "            y='price:Q',\n", "            color='symbol:N'\n", "        )\n", "\n", "        points = base.mark_circle().encode(\n", "            opacity=alt.value(0)\n", "        ).add_selection(\n", "            highlight\n", "        ).properties(\n", "            width=600\n", "        )\n", "\n", "        lines = base.mark_line().encode(\n", "            size=alt.condition(~highlight, alt.value(1), alt.value(3))\n", "        )\n", "\n", "        return points + lines\n", "\n", "\n", "with gr.Blocks() as demo:\n", "    button = gr.Radio(label=\"Plot type\",\n", "                      choices=['scatter_plot', 'heatmap', 'us_map',\n", "                               'interactive_barplot', \"radial\", \"multiline\"], value='scatter_plot')\n", "    plot = gr.Plot(label=\"Plot\")\n", "    button.change(make_plot, inputs=button, outputs=[plot])\n", "    demo.load(make_plot, inputs=[button], outputs=[plot])\n", "\n", "\n", "if __name__ == \"__main__\":\n", "    demo.launch()\n"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}

run.py

@@ -0,0 +1,140 @@
+import altair as alt
+import gradio as gr
+import numpy as np
+import pandas as pd
+from vega_datasets import data
+
+
+def make_plot(plot_type):
+    if plot_type == "scatter_plot":
+        cars = data.cars()
+        return alt.Chart(cars).mark_point().encode(
+            x='Horsepower',
+            y='Miles_per_Gallon',
+            color='Origin',
+        )
+    elif plot_type == "heatmap":
+        # Compute x^2 + y^2 across a 2D grid
+        x, y = np.meshgrid(range(-5, 5), range(-5, 5))
+        z = x ** 2 + y ** 2
+
+        # Convert this grid to columnar data expected by Altair
+        source = pd.DataFrame({'x': x.ravel(),
+                            'y': y.ravel(),
+                            'z': z.ravel()})
+        return alt.Chart(source).mark_rect().encode(
+            x='x:O',
+            y='y:O',
+            color='z:Q'
+        )
+    elif plot_type == "us_map":
+        states = alt.topo_feature(data.us_10m.url, 'states')
+        source = data.income.url
+
+        return alt.Chart(source).mark_geoshape().encode(
+            shape='geo:G',
+            color='pct:Q',
+            tooltip=['name:N', 'pct:Q'],
+            facet=alt.Facet('group:N', columns=2),
+        ).transform_lookup(
+            lookup='id',
+            from_=alt.LookupData(data=states, key='id'),
+            as_='geo'
+        ).properties(
+            width=300,
+            height=175,
+        ).project(
+            type='albersUsa'
+        )
+    elif plot_type == "interactive_barplot":
+        source = data.movies.url
+
+        pts = alt.selection(type="single", encodings=['x'])
+
+        rect = alt.Chart(data.movies.url).mark_rect().encode(
+            alt.X('IMDB_Rating:Q', bin=True),
+            alt.Y('Rotten_Tomatoes_Rating:Q', bin=True),
+            alt.Color('count()',
+                scale=alt.Scale(scheme='greenblue'),
+                legend=alt.Legend(title='Total Records')
+            )
+        )
+
+        circ = rect.mark_point().encode(
+            alt.ColorValue('grey'),
+            alt.Size('count()',
+                legend=alt.Legend(title='Records in Selection')
+            )
+        ).transform_filter(
+            pts
+        )
+
+        bar = alt.Chart(source).mark_bar().encode(
+            x='Major_Genre:N',
+            y='count()',
+            color=alt.condition(pts, alt.ColorValue("steelblue"), alt.ColorValue("grey"))
+        ).properties(
+            width=550,
+            height=200
+        ).add_selection(pts)
+
+        plot = alt.vconcat(
+            rect + circ,
+            bar
+        ).resolve_legend(
+            color="independent",
+            size="independent"
+        )
+        return plot
+    elif plot_type == "radial":
+        source = pd.DataFrame({"values": [12, 23, 47, 6, 52, 19]})
+
+        base = alt.Chart(source).encode(
+            theta=alt.Theta("values:Q", stack=True),
+            radius=alt.Radius("values", scale=alt.Scale(type="sqrt", zero=True, rangeMin=20)),
+            color="values:N",
+        )
+
+        c1 = base.mark_arc(innerRadius=20, stroke="#fff")
+
+        c2 = base.mark_text(radiusOffset=10).encode(text="values:Q")
+
+        return c1 + c2
+    elif plot_type == "multiline":
+        source = data.stocks()
+
+        highlight = alt.selection(type='single', on='mouseover',
+                                fields=['symbol'], nearest=True)
+
+        base = alt.Chart(source).encode(
+            x='date:T',
+            y='price:Q',
+            color='symbol:N'
+        )
+
+        points = base.mark_circle().encode(
+            opacity=alt.value(0)
+        ).add_selection(
+            highlight
+        ).properties(
+            width=600
+        )
+
+        lines = base.mark_line().encode(
+            size=alt.condition(~highlight, alt.value(1), alt.value(3))
+        )
+
+        return points + lines
+
+
+with gr.Blocks() as demo:
+    button = gr.Radio(label="Plot type",
+                      choices=['scatter_plot', 'heatmap', 'us_map',
+                               'interactive_barplot', "radial", "multiline"], value='scatter_plot')
+    plot = gr.Plot(label="Plot")
+    button.change(make_plot, inputs=button, outputs=[plot])
+    demo.load(make_plot, inputs=[button], outputs=[plot])
+
+
+if __name__ == "__main__":
+    demo.launch()