31:[] 2f:{"title":"Machine Learning Final Star Wars","cells":[{"id":0,"value":"md`# Machine Learning Final Star Wars`","pinned":false,"hidden":false,"mode":"ojs"},{"id":197,"value":"data = d3.json(\"https://gist.githubusercontent.com/bendazz/1146b6f62eaab1a85b3647688a6cadcb/raw/78dc654b99d3d7478f802333c5ac267392f3de1f/starWars.json\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":200,"value":"characters = data.filter(d => d.height != \"unknown\").filter(d => d.mass != \"unknown\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":321,"value":"charactersAlt = {\n const a = []\n for(let i = 0; i < 58; i = i + 1){\n a.push([parseInt(characters[i].height),parseInt(characters[i].mass)])\n }\n return a.sort(function(a, b){return b[0]-a[0] > 0})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":211,"value":"d3.extent(characters,d => parseInt(d.height))","pinned":false,"hidden":false,"mode":"ojs"},{"id":214,"value":"d3.extent(characters,d => parseInt(d.mass))","pinned":false,"hidden":false,"mode":"ojs"},{"id":249,"value":"html`

Illustration A

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":236,"value":"html`Equation of blue line:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":239,"value":"tex`y = 80`","pinned":false,"hidden":false,"mode":"ojs"},{"id":210,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n const xScale = makeXAxis(container,[0,240],[30,570],270)\n const yScale = makeYAxis(container,[0,160],[270,30],30)\n \n for(let i = 0; i < 58; i = i + 1){\n const circle = container.append(\"circle\")\n .attr(\"r\",3)\n .attr(\"cx\",xScale(characters[i].height))\n .attr(\"cy\",yScale(characters[i].mass))\n if(characters[i].name == \"Chewbacca\"){\n circle.attr(\"r\",5).attr(\"fill\",\"tomato\").attr(\"stroke\",\"black\")\n }\n }\n container.append(\"line\")\n .attr(\"stroke\",\"skyblue\")\n .attr(\"stroke-width\",3)\n .attr(\"x1\",xScale(0))\n .attr(\"y1\",yScale(80))\n .attr(\"x2\",xScale(240))\n .attr(\"y2\",yScale(80))\n \n container.append(\"text\")\n .attr(\"x\",50)\n .attr(\"y\",20)\n .attr(\"font-size\",12)\n .text(\"height vs. mass for characters data set\")\n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":276,"value":"html`

Illustration B

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":287,"value":"html`Equation of blue line:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":294,"value":"tex`y = .375x + 10`","pinned":false,"hidden":false,"mode":"ojs"},{"id":280,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n const xScale = makeXAxis(container,[0,240],[30,570],270)\n const yScale = makeYAxis(container,[0,160],[270,30],30)\n \n for(let i = 0; i < 58; i = i + 1){\n const circle = container.append(\"circle\")\n .attr(\"r\",3)\n .attr(\"cx\",xScale(characters[i].height))\n .attr(\"cy\",yScale(characters[i].mass))\n if(characters[i].name == \"Chewbacca\"){\n circle.attr(\"r\",5).attr(\"fill\",\"tomato\").attr(\"stroke\",\"black\")\n }\n }\n container.append(\"line\")\n .attr(\"stroke\",\"skyblue\")\n .attr(\"stroke-width\",3)\n .attr(\"x1\",xScale(0))\n .attr(\"y1\",yScale(.375*0+10))\n .attr(\"x2\",xScale(240))\n .attr(\"y2\",yScale(.375*240+10))\n \n container.append(\"text\")\n .attr(\"x\",50)\n .attr(\"y\",20)\n .attr(\"font-size\",12)\n .text(\"height vs. mass for characters data set\")\n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":338,"value":"html`

Illustration C

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":344,"value":"html`Equation of blue line:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":347,"value":"tex`x = 170.5`","pinned":false,"hidden":false,"mode":"ojs"},{"id":341,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n const xScale = makeXAxis(container,[0,240],[30,570],270)\n const yScale = makeYAxis(container,[0,160],[270,30],30)\n \n for(let i = 0; i < 58; i = i + 1){\n const circle = container.append(\"circle\")\n .attr(\"r\",3)\n .attr(\"cx\",xScale(characters[i].height))\n .attr(\"cy\",yScale(characters[i].mass))\n if(characters[i].name == \"Chewbacca\"){\n circle.attr(\"r\",5).attr(\"fill\",\"tomato\").attr(\"stroke\",\"black\")\n }\n }\n container.append(\"line\")\n .attr(\"stroke\",\"skyblue\")\n .attr(\"stroke-width\",3)\n .attr(\"x1\",xScale(170.5))\n .attr(\"y1\",yScale(0))\n .attr(\"x2\",xScale(170.5))\n .attr(\"y2\",yScale(160))\n \n container.append(\"text\")\n .attr(\"x\",50)\n .attr(\"y\",20)\n .attr(\"font-size\",12)\n .text(\"height vs. mass for characters data set\")\n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":389,"value":"html`

Illustration D

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":392,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n const xScale = makeXAxis(container,[0,240],[30,570],270)\n const yScale = makeYAxis(container,[0,160],[270,30],30)\n \n for(let i = 0; i < 58; i = i + 1){\n const circle = container.append(\"circle\")\n .attr(\"r\",3)\n .attr(\"cx\",xScale(characters[i].height))\n .attr(\"cy\",yScale(characters[i].mass))\n if(characters[i].name == \"Chewbacca\"){\n circle.attr(\"r\",5).attr(\"fill\",\"tomato\").attr(\"stroke\",\"black\")\n }\n }\n\n const pathData = d3.line().x(d => xScale(d[0])).y(d => yScale(d[1]))(charactersAlt)\n \n container.append(\"path\")\n .attr(\"stroke\",\"skyblue\")\n .attr(\"fill\",\"none\")\n .attr(\"d\",pathData)\n container.append(\"text\")\n .attr(\"x\",50)\n .attr(\"y\",20)\n .attr(\"font-size\",12)\n .text(\"height vs. mass for characters data set\")\n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":409,"value":"html`

Illustration E

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":414,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n const xScale = makeXAxis(container,[0,240],[30,570],150)\n \n for(let i = 0;i < 58; i = i + 1){\n const circle = container.append(\"circle\")\n .attr(\"r\",5)\n .attr(\"fill\",\"tomato\")\n .attr(\"stroke\",\"black\")\n .attr(\"cx\",xScale(characters[i].height))\n .attr(\"cy\",150)\n \n if(characters[i].gender == \"male\"){\n circle.attr(\"fill\",\"skyblue\").attr(\"cy\",130) \n } \n }\n \n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"html`

Libraries

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"import {slider,button,select,text,radio,checkbox,number} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"math = require('mathjs@6.2.1/dist/math.js')","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"stat = require('simple-statistics@7.3.0/dist/simple-statistics.min.js')\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":41,"value":"stdlib = require( \"https://unpkg.com/@stdlib/stdlib@0.0.32/dist/stdlib-flat.min.js\" )","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"normal = stdlib.base.random.normal","pinned":false,"hidden":false,"mode":"ojs"},{"id":20,"value":"{\n const svg = html`` \n const container = d3.select(svg)\n container.attr(\"style\",\"width: 600px; height: 300px; border:1px black solid\")\n \n \n return svg\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":24,"value":"makeXAxis = function(container,domain,range,y,ticks){\n const xScale = d3.scaleLinear().domain(domain).range(range)\n const xAxis = container.append(\"g\").attr(\"transform\",`translate(0,${y})`)\n d3.axisBottom(xScale).ticks(ticks)(xAxis)\n return xScale\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"makeYAxis = function(container,domain,range,x,ticks){\n const yScale = d3.scaleLinear().domain(domain).range(range)\n const yAxis = container.append(\"g\").attr(\"transform\",`translate(${x},0)`)\n d3.axisLeft(yScale).ticks(ticks)(yAxis)\n return yScale\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"makeLine = function(container,xScale,yScale,slope,intercept,x1,x2,stroke){\n container.append(\"line\")\n .attr(\"stroke\",stroke)\n .attr(\"stroke-width\",3)\n .attr(\"x1\",xScale(x1))\n .attr(\"y1\",yScale(slope*x1+intercept))\n .attr(\"x2\",xScale(x2))\n .attr(\"y2\",yScale(slope*x2+intercept))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":68,"value":"makePoint = function(container,xScale,yScale,x,y){\n container.append(\"circle\")\n .attr(\"r\",3)\n .attr(\"cx\",xScale(x))\n .attr(\"cy\",yScale(y))\n}","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}