31:T12a1,dataR = [ { "x": -4, "y": 0.0001, "area": 1 }, { "x": -3.9, "y": 0.0002, "area": 1 }, { "x": -3.8, "y": 0.0003, "area": 0.9999 }, { "x": -3.7, "y": 0.0004, "area": 0.9999 }, { "x": -3.6, "y": 0.0006, "area": 0.9998 }, { "x": -3.5, "y": 0.0009, "area": 0.9998 }, { "x": -3.4, "y": 0.0012, "area": 0.9997 }, { "x": -3.3, "y": 0.0017, "area": 0.9995 }, { "x": -3.2, "y": 0.0024, "area": 0.9993 }, { "x": -3.1, "y": 0.0033, "area": 0.999 }, { "x": -3, "y": 0.0044, "area": 0.9987 }, { "x": -2.9, "y": 0.006, "area": 0.9981 }, { "x": -2.8, "y": 0.0079, "area": 0.9974 }, { "x": -2.7, "y": 0.0104, "area": 0.9965 }, { "x": -2.6, "y": 0.0136, "area": 0.9953 }, { "x": -2.5, "y": 0.0175, "area": 0.9938 }, { "x": -2.4, "y": 0.0224, "area": 0.9918 }, { "x": -2.3, "y": 0.0283, "area": 0.9893 }, { "x": -2.2, "y": 0.0355, "area": 0.9861 }, { "x": -2.1, "y": 0.044, "area": 0.9821 }, { "x": -2, "y": 0.054, "area": 0.9772 }, { "x": -1.9, "y": 0.0656, "area": 0.9713 }, { "x": -1.8, "y": 0.079, "area": 0.9641 }, { "x": -1.7, "y": 0.094, "area": 0.9554 }, { "x": -1.6, "y": 0.1109, "area": 0.9452 }, { "x": -1.5, "y": 0.1295, "area": 0.9332 }, { "x": -1.4, "y": 0.1497, "area": 0.9192 }, { "x": -1.3, "y": 0.1714, "area": 0.9032 }, { "x": -1.2, "y": 0.1942, "area": 0.8849 }, { "x": -1.1, "y": 0.2179, "area": 0.8643 }, { "x": -1, "y": 0.242, "area": 0.8413 }, { "x": -0.9, "y": 0.2661, "area": 0.8159 }, { "x": -0.8, "y": 0.2897, "area": 0.7881 }, { "x": -0.7, "y": 0.3123, "area": 0.758 }, { "x": -0.6, "y": 0.3332, "area": 0.7257 }, { "x": -0.5, "y": 0.3521, "area": 0.6915 }, { "x": -0.4, "y": 0.3683, "area": 0.6554 }, { "x": -0.3, "y": 0.3814, "area": 0.6179 }, { "x": -0.2, "y": 0.391, "area": 0.5793 }, { "x": -0.1, "y": 0.397, "area": 0.5398 }, { "x": 0, "y": 0.3989, "area": 0.5 }, { "x": 0.1, "y": 0.397, "area": 0.4602 }, { "x": 0.2, "y": 0.391, "area": 0.4207 }, { "x": 0.3, "y": 0.3814, "area": 0.3821 }, { "x": 0.4, "y": 0.3683, "area": 0.3446 }, { "x": 0.5, "y": 0.3521, "area": 0.3085 }, { "x": 0.6, "y": 0.3332, "area": 0.2743 }, { "x": 0.7, "y": 0.3123, "area": 0.242 }, { "x": 0.8, "y": 0.2897, "area": 0.2119 }, { "x": 0.9, "y": 0.2661, "area": 0.1841 }, { "x": 1, "y": 0.242, "area": 0.1587 }, { "x": 1.1, "y": 0.2179, "area": 0.1357 }, { "x": 1.2, "y": 0.1942, "area": 0.1151 }, { "x": 1.3, "y": 0.1714, "area": 0.0968 }, { "x": 1.4, "y": 0.1497, "area": 0.0808 }, { "x": 1.5, "y": 0.1295, "area": 0.0668 }, { "x": 1.6, "y": 0.1109, "area": 0.0548 }, { "x": 1.7, "y": 0.094, "area": 0.0446 }, { "x": 1.8, "y": 0.079, "area": 0.0359 }, { "x": 1.9, "y": 0.0656, "area": 0.0287 }, { "x": 2, "y": 0.054, "area": 0.0228 }, { "x": 2.1, "y": 0.044, "area": 0.0179 }, { "x": 2.2, "y": 0.0355, "area": 0.0139 }, { "x": 2.3, "y": 0.0283, "area": 0.0107 }, { "x": 2.4, "y": 0.0224, "area": 0.0082 }, { "x": 2.5, "y": 0.0175, "area": 0.0062 }, { "x": 2.6, "y": 0.0136, "area": 0.0047 }, { "x": 2.7, "y": 0.0104, "area": 0.0035 }, { "x": 2.8, "y": 0.0079, "area": 0.0026 }, { "x": 2.9, "y": 0.006, "area": 0.0019 }, { "x": 3, "y": 0.0044, "area": 0.0013 }, { "x": 3.1, "y": 0.0033, "area": 0.001 }, { "x": 3.2, "y": 0.0024, "area": 0.0007 }, { "x": 3.3, "y": 0.0017, "area": 0.0005 }, { "x": 3.4, "y": 0.0012, "area": 0.0003 }, { "x": 3.5, "y": 0.0009, "area": 0.0002 }, { "x": 3.6, "y": 0.0006, "area": 0.0002 }, { "x": 3.7, "y": 0.0004, "area": 0.0001 }, { "x": 3.8, "y": 0.0003, "area": 0.0001 }, { "x": 3.9, "y": 0.0002, "area": 0 }, { "x": 4, "y": 0.0001, "area": 0 } ] 32:[] 2f:{"title":"TTH Midterm One (practice) ","cells":[{"id":0,"value":"html`\n\n

TTH Midterm One (practice)

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"vl.hconcat(layer1,layer2)\n.render()","pinned":false,"hidden":false,"mode":"ojs"},{"id":246,"value":"layer1 = vl.layer(Red,Green)\n.title(`Tail Area: ${datafilter1[0].area}`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":330,"value":"layer2 = vl.layer(Red,Green2)\n.title(`Tail Area: ${2*datafilter1[0].area}`)","pinned":false,"hidden":false,"mode":"ojs"},{"id":268,"value":"viewof graph = slider({min:0,max:4,step:0.1,value:-2,\n title: 'Graph',\n description: 'Please select your which year you want'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":38,"value":"md`\n---\n## Appendix\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":56,"value":"import {printTable} from '@uwdata/data-utilities'","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"import {vl} from '@vega/vega-lite-api'","pinned":false,"hidden":false,"mode":"ojs"},{"id":63,"value":"import {slider,button,select,text,radio,checkbox,number} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":184,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":208,"value":"datafilter = dataR.filter(d => d.x <= graph) ","pinned":false,"hidden":false,"mode":"ojs"},{"id":260,"value":"datafilter1 = dataR.filter(d => d.x == graph) ","pinned":false,"hidden":false,"mode":"ojs"},{"id":192,"value":"Green = vl.markArea({size:2,stroke:\"black\",fill:\"#6acc88\"})\n .width(400)\n .height(300)\n .data(dataR)\n .transform(\n vl.filter(`datum.x <= ${graph}`)\n )\n .encode(\n vl.x().fieldQ(\"x\").axis({title:\"x\"}).scale({domain:[-4,4]}),\n vl.y().fieldQ(\"y\").axis({title:\"y\"}).scale({domain:[0,0.5]})\n )","pinned":false,"hidden":false,"mode":"ojs"},{"id":238,"value":"Red = vl.markArea({size:2,stroke:\"black\",fill:\"red\"})\n .width(400)\n .height(300)\n .data(dataR)\n .encode(\n vl.x().fieldQ(\"x\").axis({title:\"x\"}).scale({domain:[-4,4]}),\n vl.y().fieldQ(\"y\").axis({title:\"y\"}).scale({domain:[0,0.5]})\n )","pinned":false,"hidden":false,"mode":"ojs"},{"id":351,"value":"Green2 = vl.markArea({size:2,stroke:\"black\",fill:\"#6acc88\"})\n .width(400)\n .height(300)\n .data(dataR)\n .transform(\n vl.filter(`datum.x <= ${graph} && datum.x >=${-graph}`)\n )\n .encode(\n vl.x().fieldQ(\"x\").axis({title:\"x\"}).scale({domain:[-4,4]}),\n vl.y().fieldQ(\"y\").axis({title:\"y\"}).scale({domain:[0,0.5]})\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":371,"value":"html`\n

How to filter the data here

\nThe vl.filter here is key\n\nThe first part: datum.x <= $ { graph }  \nsays: that datum.x has to equal to or less than \"graph\" (graph is the name of my slider)\nThe && sign means ALSO (like an and function in excel)\n\n\n

\n`","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}