2d:null 2e:["$","title",null,{"children":"US Plant Hardiness Zones Voronoi | Fletcher Graham | Observable"}] 33:Tbe4,chart = { const w = 975; const h = 680; const svg = d3.create("svg") .attr("viewBox", [0, 0, w, h]); // Use the US map as a clipping path svg.append('clipPath') .attr('id', 'clippo') .append('use') .attr('xlink:href', '#US'); // US path svg.append("path") .datum(usTopo) .attr("fill", "none") .attr('id', 'US') .attr("d", d3.geoPath()); // Zone voronoi const regions = svg.append("g") if (formObject.voronoiBoundary == true) { regions .attr("stroke", "black") .attr('stroke-width', '.3') } regions .attr("pointer-events", "all") .attr('clip-path', 'url(#clippo)') .selectAll("path") .data(geoVoroFeatures) .join("path") .attr('class', 'region') .attr('fill', d => color(d.properties.site.properties.EMNT)) .attr("d", d3.geoPath(projection)) .on('mouseenter', function(event, d){ let zcode = zoneFromTemp(d.properties.site.properties.EMNT) d3.selectAll(`.zone:not(.z${zcode})`) .transition().duration(30) .attr('fill-opacity', '.2') } ) .on('mouseleave', d => { d3.selectAll(`.zone`) .transition().duration(200) .attr('fill-opacity', '1') } ) .append("title") .text(d => { const p = d.properties.site.properties; return `${zoneFromTemp(p.EMNT)} (${p.EMNT})`; }); // Little dots for the actual weather station if (formObject.stations == true) { svg.append("path") .attr("pointer-events", "none") .datum({type: "FeatureCollection", features: data.filter(d => d.properties.DATE == formObject.year)}) .attr("d", d3.geoPath(projection).pointRadius(1)) .attr('fill', 'black') .attr('fill-opacity', '.5'); } // State boundaries svg.append("path") .attr("pointer-events", "none") .datum(topojson.mesh(us, us.objects.states, (a, b) => a !== b)) .attr("fill", "none") .attr("stroke", "white") .attr("stroke-linejoin", "round") .attr("d", d3.geoPath()); // Legend const margin = 50; const barWidth = (w - margin * 2) / 26 const legend = svg.append('g') .selectAll('rect') .data(USDA_COLORSCALE) .join('rect') .attr('class', (d,i) => `zone z${zoneCodes[i]}`) .attr("width", barWidth) .attr("height", 20) .attr("x", (d,i) => margin + barWidth * i) .attr("y", h - margin) .attr("fill", d => d) .attr('stroke-width', '1px') .attr('stroke', 'white'); // Zone code text svg.selectAll('text') .data(zoneCodes) .join('text') .attr('class',d => 'zone ' + 'z' + d) .text(d => d) .attr('x', (d,i) => margin + barWidth * i) .attr('y', h - margin - 5) .attr('font-size', '.8em'); // Year text svg.append('text') .text(`Plant Hardiness: ${formObject.year}`) .attr('x', margin) .attr('y', h-100) .attr('font-size', '1.5em'); return svg.node(); }34:[{"id":"ab8cbd260c94e8798ccbc089727e41ad2f2716e016a02fc09ab3503a0d8891f96476b2213bab80f488a4617cc092396e1d006a1985dbb390047c78073c8a8337","href":"https://static.observableusercontent.com/files/ab8cbd260c94e8798ccbc089727e41ad2f2716e016a02fc09ab3503a0d8891f96476b2213bab80f488a4617cc092396e1d006a1985dbb390047c78073c8a8337","name":"gsoy@1.csv","type":"text/csv","lastModified":1605568514502.828,"size":2568941},{"id":"0d8fa65dce2397df03b75fb4fabbc7d79e2794ef64f018bdd1dd43460bc3795743e69dbf1d7456791cbef424e272d5cd33f49e3e445ce78f9a53ef5e5755e16e","href":"https://static.observableusercontent.com/files/0d8fa65dce2397df03b75fb4fabbc7d79e2794ef64f018bdd1dd43460bc3795743e69dbf1d7456791cbef424e272d5cd33f49e3e445ce78f9a53ef5e5755e16e","name":"states-albers-10m.json","type":"application/json","lastModified":1605217856226.906,"size":82031},{"id":"b1426250ef1e5a4c5540abe7d86f298f63a37e91200614635d3adb91b3de052c6072674b850fbf7e69db3ad4ebc70862ff688c07343f3642d2212c054e3804a1","href":"https://static.observableusercontent.com/files/b1426250ef1e5a4c5540abe7d86f298f63a37e91200614635d3adb91b3de052c6072674b850fbf7e69db3ad4ebc70862ff688c07343f3642d2212c054e3804a1","name":"gsoy.csv","type":"text/csv","lastModified":1605238094011.419,"size":1162981}] 31:{"id":"ee712f846baf4d36","slug":"us-plant-hardiness-zones-voronoi","title":"US Plant Hardiness Zones Voronoi","thumbnail":"ae41ac06781af2b957d03382237134ced77624069d999adc6dd7b62779a89f59","access_level":"public","create_time":"$D2020-11-12T21:50:56.226Z","update_time":"$D2020-11-19T21:11:36.678Z","view_time":null,"first_public_time":"$D2020-11-13T04:11:20.859Z","fork":{"id":"1f9b717425fc26aa","slug":"us-airports-voronoi","title":"U.S. airports Voronoi","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":4,"starred":false,"owner":{"type":"team","id":"ef2aca6f8e8211e7","login":"fletchgraham","name":"Fletcher Graham","avatar_url":"https://avatars-next.observableusercontent.com/76dd151955ab55d0775567474a6a3f12996699d371282402c90085c3c57a3d0c","tier":"starter_2024"},"version":616,"publish_version":616,"role":null,"authored":false,"authors":[{"type":"individual","id":"439dae6bbf6273b2","login":"fletchgraham","name":"Fletcher Graham","avatar_url":"https://avatars-next.observableusercontent.com/76dd151955ab55d0775567474a6a3f12996699d371282402c90085c3c57a3d0c","tier":null}],"members":[{"type":"individual","id":"439dae6bbf6273b2","login":"fletchgraham","name":"Fletcher Graham","avatar_url":"https://avatars-next.observableusercontent.com/76dd151955ab55d0775567474a6a3f12996699d371282402c90085c3c57a3d0c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"US Plant Hardiness Zones Voronoi","cells":[{"id":0,"value":"md`# US Plant Hardiness Zones Voronoi`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":318,"value":"viewof formObject = form(html``)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":297,"value":"md`## Data\n\nThe data for this map comes from the [National Centers for Environmental Information](https://www.ncei.noaa.gov/). [This jupyter notebook](https://github.com/fletchgraham/hardiness/blob/main/grab_data.ipynb) was used to acquire, and process the data into the CSV file that is attached to this notebook.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"data = d3.csvParse(await FileAttachment(\"gsoy@1.csv\").text(), d => ({\n type: \"Feature\",\n properties: d,\n geometry: {\n type: \"Point\",\n coordinates: [+d.LONGITUDE, +d.LATITUDE]\n }\n })\n )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"average = d3.rollup(data, v => d3.mean(v, d => d.properties.EMNT), d => d.properties.STATION)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":289,"value":"md`## Colors`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":215,"value":"USDA_COLORSCALE = [\n \"#D6D3FE\", // 1a\n \"#C3C2F3\", // 1b\n \"#ACAADC\", // 2a\n \"#EFAAEA\", // 2b\n \"#E38EF5\", // 3a\n \"#CD7DD9\", // 3b\n \"#AB68FD\", // 4a\n \"#5876F8\", // 4b\n \"#72A0FD\", // 5a\n \"#5BCBE7\", // 5b\n \"#44BE45\", // 6a\n \"#78C94D\", // 6b\n \"#A8D864\", // 7a\n \"#CFDB70\", // 7b\n \"#EDD87F\", // 8a\n \"#EECB53\", // 8b\n \"#DDB346\", // 9a\n \"#FAB678\", // 9b\n \"#EE9B33\", // 10a\n \"#ED770F\", // 10b\n \"#E55618\", // 11a\n \"#E68662\", // 11b\n \"#D15E4C\", //12a\n \"#B71221\", //12b\n \"#982F1C\", //13a\n \"#791703\", //13b\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":293,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":414,"value":"zoneCodes = {\n const codes = []\n d3.range(1, 14).map(number => ['a', 'b'].map(letter => codes.push(number + letter)))\n return codes\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":448,"value":"zoneFromTemp = {\n const domain = d3.range(-48.3, 21.1, 2.77)\n return d3.scaleThreshold()\n .domain(domain)\n .range(zoneCodes);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"color = {\n let domain = d3.range(-48.3, 21.1, 2.77)\n return d3.scaleThreshold()\n .domain(domain)\n .range(USDA_COLORSCALE);\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":434,"value":"years = d3.range(2014, 2020).reverse()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":386,"value":"geoVoroFeatures = d3.geoVoronoi().polygons(data.filter(d => d.properties.DATE == formObject.year)).features;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"projection = d3.geoAlbers().scale(1300).translate([487.5, 305])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"us = FileAttachment(\"states-albers-10m.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":383,"value":"// with alaska and hawaii filtered out\nusTopo = topojson.merge(us, us.objects.states.geometries.filter(d => d.id !== \"02\" && d.id !== \"15\"))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"d3 = require.alias({\"d3-array\": \"d3@6\", \"d3-delaunay\": \"d3@6\", \"d3-geo\": \"d3@6\"})(\"d3@6\", \"d3-geo-voronoi@1\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"import {form} from \"@mbostock/form-input\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"

Settings