28:null 29:["$","title",null,{"children":"Parabolas | Charles Redmond | Observable"}] 2e:[] 2c:{"id":"052b8f2d612cbc52","slug":"parabolas","title":"Parabolas","thumbnail":"146e883d84aed005231bed982fdeaf6c6fb69546a54334db73a48072e4f7b19c","access_level":"public","create_time":"$D2020-05-17T15:09:37.261Z","update_time":"$D2020-05-18T01:43:17.452Z","view_time":null,"first_public_time":"$D2020-05-17T16:00:50.197Z","has_unpublished_edits":null,"fork":{"id":"e8e77064618045e5","slug":"heres-x-whats-y","title":"Here's x, what's y?","owner":{"id":"66151b62b45d9fca","login":"credmond","name":"Charles Redmond"}},"stars":2,"starred":false,"owner":{"type":"team","id":"66151b62b45d9fca","login":"credmond","name":"Charles Redmond","avatar_url":"https://avatars-next.observableusercontent.com/50425ed9f407a7b47d1c471a09963f335e0652ab9acc237869e2d7949fb04a77","tier":"starter_2024"},"version":564,"publish_version":564,"role":null,"authored":false,"authors":[{"type":"individual","id":"37a987477e8b6db3","login":"credmond","name":"Charles Redmond","avatar_url":"https://avatars-next.observableusercontent.com/50425ed9f407a7b47d1c471a09963f335e0652ab9acc237869e2d7949fb04a77","tier":null}],"members":[{"type":"individual","id":"37a987477e8b6db3","login":"credmond","name":"Charles Redmond","avatar_url":"https://avatars-next.observableusercontent.com/50425ed9f407a7b47d1c471a09963f335e0652ab9acc237869e2d7949fb04a77","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"d3efbe39d1eb29fb","slug":"functions","title":"Functions","owner":{"id":"66151b62b45d9fca","login":"credmond","name":"Charles Redmond"}},"type":"notebook","body":{"title":"Parabolas","cells":[{"id":0,"value":"md`# Parabolas`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":547,"value":"html`The general vertex form of the equation of a parabola is:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":549,"value":"tex`y = a(x-h)^{2} + k`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":552,"value":"html`The shift left or right is determined by h. The shift up or down is determined by k. The width of the parabola is determined by a.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":557,"value":"html`Below, the students can experiment by changing the values of a, h, or k with the sliders.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":531,"value":"{ \n if(a == 1 || a == 0){\n var p1 = ``\n }else if(a == -1){\n var p1 = `-`\n }else{\n var p1 = a\n }\n \n if(a == 0){\n var p2 = ``\n }else if(h == 0){\n var p2 = `x^{2}`\n }else if(h < 0){\n var p2 = `(x + ${-h})^{2}`\n }else{\n var p2 = `(x - ${h})^{2}`\n }\n \n if(a == 0){\n var p3 = k\n }else if(k == 0){\n var p3 = ``\n }else if(k < 0){\n var p3 = `- ${-k}`\n }else{\n var p3 = `+ ${k}`\n }\n return tex`y = ${p1}${p2}${p3}`\n\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"{\n const svgDims = [600,600]\n const svg = d3.select(DOM.svg(svgDims[0],svgDims[1])).attr(\"style\",\"background:white;border:1px solid white\")\n \n //scales and axes\n const xScale = d3.scaleLinear().domain([-5,5]).range([30,570])\n const xAxis = svg.append(\"g\").attr(\"transform\",\"translate(0,300)\").call(d3.axisBottom(xScale).ticks(10))\n \n const yScale = d3.scaleLinear().domain([-25,25]).range([570,30])\n const yAxis = svg.append(\"g\").attr(\"transform\",\"translate(300,0)\").call(d3.axisLeft(yScale).ticks(10))\n \n const clip = svg.append(\"clipPath\")\n .attr(\"id\",\"clip\")\n\n const box = clip.append(\"rect\")\n .attr(\"width\",540)\n .attr(\"height\",540)\n .attr(\"x\",xScale(-5))\n .attr(\"y\",yScale(25))\n \n const pathData = d3.line().x(d => xScale(d)).y(d => yScale(a*((d-h)*(d-h))+ k) )(data)\n \n svg.append(\"path\")\n .attr(\"d\",pathData)\n .attr(\"stroke\",\"black\")\n .attr(\"fill\",\"none\")\n .attr(\"clip-path\",\"url(#clip)\")\n \n\n yield svg.node()\n}\n ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":343,"value":"viewof a = slider({min:-10,max:10,step:1,value: 1,description:\"set a\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":519,"value":"viewof h = slider({min:-5,max:5,step: 1,value: 0,description:\"set h\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":527,"value":"viewof k = slider({min:-25,max:25,step: 1,value: 0,description:\"set k\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":368,"value":"html`

Variables and Code

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":502,"value":"data = {\n const data = []\n for(let i = -5; i <= 5; i = i + .1){\n data.push(i)\n }\n return data\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"html`

Libraries

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"import {slider,button,select,text,radio,checkbox,number} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2e","stdlib":"1","titling":"auto"}} 2d:"$2c:body"