2e:null 2f:["$","title",null,{"children":"Second Exercise on Observable: Classification and Colors | njmitchell20 | Observable"}] 34: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; }35:[{"id":"296b1aab64bf34dbd73fbd952694a06f969fb267c0cee6f1698e8fae6ea5eb727c1be29e06155b02fcc53447873a5530655cb814a471e15810066fcaecfcd7cd","href":"https://static.observableusercontent.com/files/296b1aab64bf34dbd73fbd952694a06f969fb267c0cee6f1698e8fae6ea5eb727c1be29e06155b02fcc53447873a5530655cb814a471e15810066fcaecfcd7cd","name":"Alabama.csv","type":"text/csv","lastModified":1614640216579.334,"size":20721},{"id":"463c78510cad363e18463b15b1ff45ee34bcb63376a96993d91414c4979d6c4ad25cb47742426da6b85db579a9001d67eddd5f16e19a2c832a3e1b315627e4de","href":"https://static.observableusercontent.com/files/463c78510cad363e18463b15b1ff45ee34bcb63376a96993d91414c4979d6c4ad25cb47742426da6b85db579a9001d67eddd5f16e19a2c832a3e1b315627e4de","name":"Alabama.json","type":"application/json","lastModified":1614640241679.159,"size":82783}] 32:{"id":"d02fa9d1e3327a05","slug":"third-exercise-on-observable-work-in-progress","title":"Second Exercise on Observable: Classification and Colors","thumbnail":"edbf521835ae4eb5d55566696a5d22bc7916ec107ee64836d34afa97356fdacc","access_level":"public","create_time":"$D2021-03-01T22:29:17.660Z","update_time":"$D2021-03-02T01:44:56.711Z","view_time":null,"first_public_time":"$D2021-03-01T23:51:24.839Z","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":"2ad9e304bac66265","login":"njmitchell20","name":"","avatar_url":"https://avatars-next.observableusercontent.com/2f0c0a6d69894b50fce4c7abd5a27544615b49850a4369bc0b10e3e7985d8111","tier":"starter_2024"},"version":494,"publish_version":494,"role":null,"authored":false,"authors":[{"type":"individual","id":"c5f45b7c889ebd5d","login":"njmitchell20","name":"","avatar_url":"https://avatars-next.observableusercontent.com/2f0c0a6d69894b50fce4c7abd5a27544615b49850a4369bc0b10e3e7985d8111","tier":null}],"members":[{"type":"individual","id":"c5f45b7c889ebd5d","login":"njmitchell20","name":"","avatar_url":"https://avatars-next.observableusercontent.com/2f0c0a6d69894b50fce4c7abd5a27544615b49850a4369bc0b10e3e7985d8111","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Second Exercise on Observable: Classification and Colors","cells":[{"id":0,"value":"md`# Second Exercise on Observable: Classification and Colors`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"Alabama = FileAttachment(\"Alabama.json\").json()\n//I am using a new shapefile & CSV for Assignment 2 (no longer using eu cities)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"county_features = topojson.feature(Alabama, Alabama.objects.Alabama1)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"csv_data = d3.csvParse(await FileAttachment(\"Alabama.csv\").text(),({FIPS, AGE_5_9, POP2010}) => [FIPS, [+AGE_5_9, +AGE_5_9/+POP2010]])\n//This is the normalized variable I will be mapping. It was created by diving the population between 5-9 by the total population for each county in Alabama.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"childpct = Array.from(csv_data.values(), d => d[1][1])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"data = Object.assign(new Map(csv_data), {title: [\"Percent Population of Alabama: between 5 & 9\"]})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":486,"value":"md`# Before we Map...`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":488,"value":"//I will not get into the best practices for mapping, such as number of classes or colors to use, but the following classifications were constrained by these 'best practices'. \n//I stuck with 3 classes for the classification methods, except quantile where I used 5. For the number of objects I am using (67) I decided 3-5 classes was sufficient for each classiciation method. Equal Interval wasn't a great breakdown regardless of classes but is shown below with 3.\n//The colors were created using colorbrewer. I chose a range of schemes in which each class is easily identafiable.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"md`# Linear Scale (Unclassed)`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":242,"value":"linear = d3.scaleLinear()\n .domain([d3.min(childpct),d3.max(childpct)])\n .range([\"white\", \"blue\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":199,"value":"chart(numericSort(childpct), linear)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":267,"value":"md`# Quantile Classification`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"quantile = d3.scaleQuantile()\n .domain(childpct)\n .range([\"#edf8fb\", \"#b2e2e2\", \"#66c2a4\", \"#2ca25f\", \"#006d2c\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":274,"value":"chart(numericSort(childpct), quantile)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":323,"value":"md`# Jenks Natural Breaks Classification`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"naturalbreaks = simple.ckmeans(childpct, 3).map(v => v.pop())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"jenks = d3\n .scaleThreshold()\n .domain(naturalbreaks)\n .range([\"#fee8c8\", \"#fdbb84\", \"#e34a33\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":330,"value":"chart(numericSort(childpct), jenks)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"md`# Equal Interval Classification (Quantize)`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":276,"value":"quantize = d3.scaleQuantize()\n .domain([d3.min(childpct),d3.max(childpct)])\n .range([\"white\", \"#9ebcda\", \"#8856a7\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":282,"value":"chart(numericSort(childpct), quantize)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"md`# Threshold`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"threshold = d3.scaleThreshold()\n .domain([0.06444582814445828, 0.09325355890241387, 0.12106180453143853])\n .range([\"#deebf7\", \"#9ecae1\", \"#3182bd\"])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"chart(numericSort(childpct), threshold)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":355,"value":"showScaleGrouping(childpct, {\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","output":"$undefined","database":"$undefined"},{"id":129,"value":"md`# Annex`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$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","output":"$undefined","database":"$undefined"},{"id":201,"value":"function chart(data, scale) {\n const w = 30,\n cols = Math.floor(Math.min(600, width) / w),\n lines = Math.ceil(100 / 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","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","output":"$undefined","database":"$undefined"},{"id":357,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"