45:["$","title",null,{"children":"Assignment 2 - Drew Dollison | Drew Dollison | Observable"}] 4d:T5a4,function showScaleGrouping(data, scales) { const margins = { left: 130 }; const x = d3 .scaleLinear() .domain(d3.extent(data)) .range([margins.left, width - 5]); const r = 3; const rectHeight = 10; const chart = svg` `; return chart; }4e:[{"id":"7f63cd60bd780fb581d9a0869fc0fa88e96e3b42d72a56a1b4dd371f15cfb3cd74b48884b9b96cade4aec2653338f9a9a264ff95ed638e2327f10a3350c6ce82","href":"https://static.observableusercontent.com/files/7f63cd60bd780fb581d9a0869fc0fa88e96e3b42d72a56a1b4dd371f15cfb3cd74b48884b9b96cade4aec2653338f9a9a264ff95ed638e2327f10a3350c6ce82","name":"Alaska.json","type":"application/json","lastModified":1676828778408.783,"size":25543},{"id":"cebcca49f80541efc6820907fd1b3096d5c95574ddbbdac4d57fe6bc342d89026ccd851d16cc186eee115565d800dfe8cb3589069d3d4dd16fdcbcc75db6dd3b","href":"https://static.observableusercontent.com/files/cebcca49f80541efc6820907fd1b3096d5c95574ddbbdac4d57fe6bc342d89026ccd851d16cc186eee115565d800dfe8cb3589069d3d4dd16fdcbcc75db6dd3b","name":"Alaska@1.csv","type":"text/csv","lastModified":1676828778408.783,"size":8290},{"id":"a2fef3996463f9ce3fc241315364ef00c1965f12444571ea1ab7f565c1b70c1c53d94f0c9ff999365e58f224b9215e23c32f8a702bc137d804c3688da80f1c79","href":"https://static.observableusercontent.com/files/a2fef3996463f9ce3fc241315364ef00c1965f12444571ea1ab7f565c1b70c1c53d94f0c9ff999365e58f224b9215e23c32f8a702bc137d804c3688da80f1c79","name":"VermontCounties.csv","type":"text/csv","lastModified":1676828814420.816,"size":5697},{"id":"e40610bab021ff961aae6a057f0f4f9bb76a6d3065d49ec6fd2b0a28670c40e5d2a081a292d74d539e0c16b09b0f59dbae7ba0f0efce9f961f83712fccf8bc66","href":"https://static.observableusercontent.com/files/e40610bab021ff961aae6a057f0f4f9bb76a6d3065d49ec6fd2b0a28670c40e5d2a081a292d74d539e0c16b09b0f59dbae7ba0f0efce9f961f83712fccf8bc66","name":"VermontCounties.json","type":"application/json","lastModified":1676828818770.141,"size":163786},{"id":"b7acc3a94584ba8458cb571eb2b3fd1e219f1e29c7cac707b782c228a086eefa2cae5cef33a88da77ef61f8bc571d565d7e300590965823fe1d5e9a95908ae49","href":"https://static.observableusercontent.com/files/b7acc3a94584ba8458cb571eb2b3fd1e219f1e29c7cac707b782c228a086eefa2cae5cef33a88da77ef61f8bc571d565d7e300590965823fe1d5e9a95908ae49","name":"ArizonaCounty@1.csv","type":"text/csv","lastModified":1676913392076.07,"size":41780},{"id":"b502efb517f0ea8f2f0298f49854eaee633d0ec693a2190b0a74b1db8a3ff683483b30abfacded8a995628953b8ff98586bca7596aaef79b999f646918750dad","href":"https://static.observableusercontent.com/files/b502efb517f0ea8f2f0298f49854eaee633d0ec693a2190b0a74b1db8a3ff683483b30abfacded8a995628953b8ff98586bca7596aaef79b999f646918750dad","name":"ArizonaCounty.csv","type":"text/csv","lastModified":1676912559888.707,"size":54903},{"id":"4ca391b1faca4327bd4304366649ad6d682c1f2458646964151c7d7b95ba22f5361efa214e14e1286c6786662981e207b7bcb5b530b6eb9ce6978a02da5af9d2","href":"https://static.observableusercontent.com/files/4ca391b1faca4327bd4304366649ad6d682c1f2458646964151c7d7b95ba22f5361efa214e14e1286c6786662981e207b7bcb5b530b6eb9ce6978a02da5af9d2","name":"ArizonaCounty.json","type":"application/json","lastModified":1676912555703.673,"size":541532}] 49:{"id":"d1ac3763d866ad74","slug":"assignment-2-drew-dollison","title":"Assignment 2 - Drew Dollison","thumbnail":"7c8022b8df188c8ac1feb06918ee5da2c6336e9acedc17ca3b54429edd3a7d1f","access_level":"public","create_time":"$D2023-02-19T17:46:18.408Z","update_time":"$D2023-02-20T22:45:14.181Z","view_time":null,"first_public_time":"$D2023-02-19T17:46:18.408Z","has_unpublished_edits":null,"fork":{"id":"c68fb87dffeeb9bc","slug":"second-exercise-on-observable","title":"Second Exercise on Observable: Classification and Colors","owner":{"id":"22130e106df70095","login":"geoviz","name":"Geographic Visualization (GEOG 3540) - University of Iowa"}},"stars":0,"starred":false,"owner":{"type":"team","id":"6d3427e79eec86aa","login":"ddollison","name":"Drew Dollison","avatar_url":"https://avatars-next.observableusercontent.com/d491d6a4957ad66ce6a20059a6fc9cc56255e058c042d86aa33a6473b320a954","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":579,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"70dcbdc62ed9e8f5","login":"ddollison","name":"Drew Dollison","avatar_url":"https://avatars-next.observableusercontent.com/d491d6a4957ad66ce6a20059a6fc9cc56255e058c042d86aa33a6473b320a954","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"70dcbdc62ed9e8f5","login":"ddollison","name":"Drew Dollison","avatar_url":"https://avatars-next.observableusercontent.com/d491d6a4957ad66ce6a20059a6fc9cc56255e058c042d86aa33a6473b320a954","tier":null,"role":"editor"}],"comments":[{"id":"c4ea4c7da86b2939","reply_to_id":null,"content":"// P001001 = total population of respective county P0010004 = total population of Black/African American.","create_time":"$D2023-02-19T17:56:15.777Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"70dcbdc62ed9e8f5","login":"ddollison","name":"Drew Dollison","avatar_url":"https://avatars-next.observableusercontent.com/d491d6a4957ad66ce6a20059a6fc9cc56255e058c042d86aa33a6473b320a954","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Assignment 2 - Drew Dollison","cells":[{"id":0,"value":"md`# Assignment 2 - Drew Dollison`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"Arizona = FileAttachment(\"ArizonaCounty.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"county_features = topojson.feature(Arizona, Arizona.objects.ArizonShapfile)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":425,"value":"// TOTAL_POP = total population of each respective county, HISPANIC = total population of Hispanics in each respective county..","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"csv_data = d3.csvParse(await FileAttachment(\"ArizonaCounty@1.csv\").text(),({OBJECTID, HISPANIC, TOTAL_POP}) => [OBJECTID, +HISPANIC/+TOTAL_POP])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":400,"value":"csv_data_objects = Object.assign((d3.csvParse(await FileAttachment(\"ArizonaCounty@1.csv\").text(), d3.autoType)).map(({OBJECTID, HISPANIC, TOTAL_POP}) => ({OBJECTID: +OBJECTID, Hispapct: +HISPANIC/+TOTAL_POP})))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":415,"value":"viewof bins = Inputs.range([0, 20], {step: 1, label: \"Bins\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":394,"value":"Plot.plot({\n marks: [\n Plot.rectY(csv_data_objects, Plot.binX({y: \"count\"}, {x: \"Hispapct\", thresholds: bins})),\n Plot.ruleY([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":572,"value":"// When looking at the histogram above I found that there is a right skewed distribution of the data with the majority of the data sitting below 40% hispanic population. Furthermore, the central point of this distribution seems to be around the 20% hispanic population mark. Along with this, there are also some clear outliers with their percentage of hispanic populations being over 60% and 80% respectively. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"Hispapct = Array.from(csv_data.values(), d => d[1])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"data = Object.assign(new Map(csv_data), {title: [\"Percent Population of Arizona that identifies as Hispanic\"]})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"// To create a color scheme and assign it to your domain you first have to go to mapbrewer. This website will give you several different premade color schemes that you can use. Simply type type \".range([\"color\",\"color\"])\" and put the color codes given from mapbrewer inbetween the quotation marks.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"md`# Linear Scale (Unclassed)`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":541,"value":"// The scale linear function shows the data in order from minimum to maximum with the color getting more saturated as you approach the maximum. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":545,"value":"// For the passing of domain values for the scalelinear function type \".domain([d3.min(yourdata),d3.max(yourdata)])\" which will give the function the max and min of your data.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":548,"value":"// For the passing of colors through the range functing type \".range([\"color\",\"color\"])\". You can tell the function any color or use the color codes given from mapbrewer. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":242,"value":"linear = d3.scaleLinear()\n .domain([d3.min(Hispapct),d3.max(Hispapct)])\n .range([\"white\",\"pink\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":199,"value":"chart(numericSort(Hispapct), linear)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":267,"value":"md`# Quantile Classification`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":553,"value":"// This function will order the data and put an equal amount of data points into however many groups you want. To use this function type 'quantile = d3.scaleQuantile()' and tell it the domain and range you want. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":556,"value":"// To pass the data to the quantile funciton type ' .domain(Yourdata)' into the cell.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"quantile = d3.scaleQuantile()\n .domain(Hispapct)\n .range([\"#e0ecf4\", \"#9ebcda\", \"#8856a7\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":274,"value":"chart(numericSort(Hispapct), quantile)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"md`# Jenks Natural Breaks Classification`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"naturalbreaks = simple.ckmeans(Hispapct, 3).map(v => v.pop())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"jenks = d3\n .scaleThreshold()\n .domain(naturalbreaks)\n .range([\"#e0ecf4\", \"#9ebcda\", \"#8856a7\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":330,"value":"chart(numericSort(Hispapct), jenks)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"md`# Equal Interval Classification (Quantize)`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":562,"value":"// The quantize function is the same thing as equal interval. The function will sudbdivide the data into as many equal intervals as there are classes. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":564,"value":"// For the passing of domain values for the scaleQuantize function type \".domain([d3.min(yourdata),d3.max(yourdata)])\" which will give the function the max and min of your data.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":276,"value":"quantize = d3.scaleQuantize()\n .domain([d3.min(Hispapct),d3.max(Hispapct)])\n .range([\"#ffeda0\",\"#feb24c\", \"#f03b20\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":282,"value":"chart(numericSort(Hispapct), quantize)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"md`# Threshold`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":568,"value":"// d3.scalethreshold changes what would be a continuous and linear scale and switches it to a discrete scale, grouping the data points into classes. ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":570,"value":"// To pass the data into the domain function ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":533,"value":"// I chose these breaks because I thought those values were a rough break of where a hispanic population percentage would be considered lower, moderate, and then high.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"threshold = d3.scaleThreshold()\n .domain([0.15, 0.35])\n .range([\"#ffeda0\",\"#feb24c\", \"#f03b20\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"chart(numericSort(Hispapct), threshold)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":574,"value":"// 2.10: ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":355,"value":"showScaleGrouping(Hispapct, {\n scaleQuantile: quantile,\n scaleThreshold: threshold,\n scaleJenks: jenks,\n scaleQuantize: quantize,\n scaleQuantizeNice: quantize.copy().nice()\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"md`# Annex`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":261,"value":"function numericSort(x) {\n return (\n x\n // ensure the array is not changed in-place\n .slice()\n // comparator function that treats input as numeric\n .sort((a, b) => a - b)\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":201,"value":"function chart(data, scale) {\n const w = 20,\n cols = Math.floor(Math.min(600, width) / w),\n lines = Math.ceil(200 / cols);\n const chart = d3\n .create(\"svg\")\n .attr(\"width\", cols * w)\n .attr(\"height\", lines * w);\n\n chart\n .append(\"g\")\n .attr(\"transform\", \"translate(2,2)\")\n .attr(\"style\", \"stroke:black; fill:white;\")\n .selectAll(\"rect\")\n .data(data)\n .join(\"rect\")\n .attr(\"width\", w - 3)\n .attr(\"height\", w - 3)\n .attr(\"x\", (_, i) => w * (i % cols))\n .attr(\"y\", (_, i) => w * ((i / cols) | 0))\n .style(\"fill\", d => (scale ? scale(d) : \"#ddd\"));\n return chart.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":313,"value":"simple = require(\"simple-statistics@7.0.7/dist/simple-statistics.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":357,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4e","stdlib":"1"}} 44:null