Auto-commit: Wed Nov 1 12:14:39 CDT 2023

UIUC-iSchool-DataViz · Nov 1, 2023 · 2c6187b · 2c6187b
1 parent 23323ac
commit 2c6187b
Showing 1 changed file with 59 additions and 7 deletions.
diff --git a/week11/prep_notebook_week11.ipynb b/week11/prep_notebook_week11.ipynb
@@ -2792,7 +2792,7 @@
   },
   {
    "cell_type": "markdown",
-   "id": "c70d0814",
+   "id": "8d18325c",
    "metadata": {},
    "source": [
     "## 6. Quick drop-down interactivity (if time)"
@@ -2801,47 +2801,99 @@
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "d4889248",
+   "id": "3e2c217b",
    "metadata": {},
    "outputs": [],
    "source": []
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "0984d666",
+   "id": "de34c93a",
+   "metadata": {},
+   "outputs": [],
+   "source": []
+  },
+  {
+   "cell_type": "markdown",
+   "id": "b16c039f",
+   "metadata": {},
+   "source": [
+    "Final plot all together:"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "b8946029",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "brush = alt.selection_interval(encodings=['x','y']) # to select bins of student-teacher ratio and state\n",
+    "\n",
+    "# select what is plotted in the histogram\n",
+    "input_dropdown = alt.binding_select(options=['Mobility','Population','min','max','std'], \n",
+    "                                    name='Statistic')\n",
+    "\n",
+    "\n",
+    "chart1 = alt.Chart(mobility).mark_rect().encode(\n",
+    "    alt.X(\"Student_teacher_ratio:Q\", bin=alt.Bin(maxbins=10)),\n",
+    "    alt.Y(\"State:O\"),\n",
+    "    alt.Color(\"count()\")\n",
+    ").properties(\n",
+    "   height=400\n",
+    ").add_selection(\n",
+    "        brush\n",
+    ")\n",
+    "\n",
+    "chart2 = alt.Chart(mobility_url).mark_bar().encode(\n",
+    "    alt.X(\"Mobility:Q\", bin=True,axis=alt.Axis(title='Mobility Score')),\n",
+    "    alt.Y('count()', axis=alt.Axis(title='Mobility Score Distribution'))\n",
+    ").transform_filter(\n",
+    "    brush\n",
+    ")\n",
+    "\n",
+    "chart = (chart1.properties(width=300) | chart2.properties(width=300))\n",
+    "\n",
+    "chart"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "3b866cfe",
    "metadata": {},
    "outputs": [],
    "source": []
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "39e48b29",
+   "id": "7b351220",
    "metadata": {},
    "outputs": [],
    "source": []
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "a3ffe75d",
+   "id": "6a5ad027",
    "metadata": {},
    "outputs": [],
    "source": []
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "d43ee2bc",
+   "id": "08e5072c",
    "metadata": {},
    "outputs": [],
    "source": []
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "id": "523693da",
+   "id": "a73889de",
    "metadata": {},
    "outputs": [],
    "source": []