31:T42e,citiesInset = [ // Use offsetLng/offsetLat fields here to manually position city text labels around other features // Add new cities here by pulling coordinates from web mapping services as necessary // {name:"Missoula", geoid: "3050200", lng: -114.01, lat: 46.87, offsetLng: 0, offsetLat: 0}, // {name:"Miles City", geoid: "3049525", lng: -105.84, lat: 46.41, offsetLng: 0, offsetLat: 0}, // {name:"Kalispell", geoid: "3040075", lng: -114.33, lat: 48.22, offsetLng: 0, offsetLat: 0}, // {name:"Havre", geoid: "3035050", lng: -109.68, lat: 48.54, offsetLng: -1.6, offsetLat: 0.05}, // {name:"Butte", geoid: "3011397", lng: -112.54, lat: 46, offsetLng: 0, offsetLat: 0}, // {name:"Bozeman", geoid: "3008950", lng: -111.05, lat: 45.68, offsetLng: -2.5, offsetLat: 0.4}, // {name:"Helena", geoid: "3035600", lng: -112.02, lat: 46.6, offsetLng: 0, offsetLat: 0}, // {name:"Billings", geoid: "3006550", lng: -108.55, lat: 45.79, offsetLng: 0, offsetLat: 0}, // {name:"Great Falls", geoid: "3032800", lng: -111.3, lat: 47.5, offsetLng: 0, offsetLat: 0} ]32:T4ff,inset_map = () => Plot.plot({ width: 100, style: { fontFamily: 'Arial', }, projection: { // scale/orientation optimized for Montana statewide maps type: 'albers', rotate: [110, 0, 0], domain: shapes.montana, // sets map scope; rewind makes sure custom domains don't run into the geojson winding bug insetLeft: 0, insetRight: 0, insetTop: 0, insetBottom: 0, }, marks: [ // background context Plot.geo(shapes.montana, { fill: '#c4bfb5' }), Plot.circle(mapExtent, Plot.centroid({ r: 3, fill:'#222', fillOpacity: 0.8})), Plot.text([{name:"LAUREL", geoid: "3006550", lng: -108.55, lat: 45.79}], { x: 'lng', y: 'lat', text: 'name', fontSize: 10, fontWeight: 'bold', textAnchor: 'middle', fill: '#222', dx: 0, dy: -8, }), // cities Plot.dot(citiesInset, {x: 'lng', y: 'lat', r: 2, fill: 'black'}), Plot.text(citiesInset, { x: d => d.lng + d.offsetLng, // hack for non-dynamic dx y: d => d.lat + d.offsetLat, // hack for non-dynamic dy text: 'name', fontSize: 9, fontStyle: 'italic', textAnchor: 'start', dx: 5, }), Plot.geo(shapes.montana, { stroke: '#222', strokeWidth: 2 }), ] })33:T2132,features = ({ ycgs: rewind({ "type": "FeatureCollection", "features": [ { "type": "Feature", "properties": {}, "geometry": { "coordinates": [ [ [ -108.7507267573374, 45.66004577198083 ], [ -108.75075072505635, 45.65788480240457 ], [ -108.74060039609931, 45.65940921596493 ], [ -108.74060039609931, 45.65972749487722 ], [ -108.74268558764416, 45.66096709023927 ], [ -108.7449505370809, 45.66095871468687 ], [ -108.74629272933973, 45.66053993547726 ], [ -108.74961225840794, 45.65980287646019 ], [ -108.7507267573374, 45.66004577198083 ] ] ], "type": "Polygon" }, "id": 0 } ] }), chsRefinery: rewind({ "type": "Feature", "properties": {}, "geometry": { "coordinates": [ [ [ -108.77660334041721, 45.66047943973854 ], [ -108.77650323864083, 45.65386763940586 ], [ -108.7670846198815, 45.65377921280964 ], [ -108.76483886201764, 45.654168657641435 ], [ -108.76327326025854, 45.6550579526087 ], [ -108.76217609611136, 45.655441397246676 ], [ -108.76169260230226, 45.65536739566838 ], [ -108.76054871655784, 45.65569448121357 ], [ -108.7602540793208, 45.655882251682186 ], [ -108.75991611307805, 45.65611242107457 ], [ -108.75925741233061, 45.65730304112873 ], [ -108.75823103901446, 45.65783679314785 ], [ -108.75754461538374, 45.658316561236575 ], [ -108.75734014877045, 45.65868404039739 ], [ -108.75669753941388, 45.65917400885951 ], [ -108.75653688707474, 45.65986812350769 ], [ -108.75674135368801, 45.66035808160839 ], [ -108.7575592201416, 45.660848035421594 ], [ -108.76097673353834, 45.66086845007041 ], [ -108.76180920475036, 45.661154254377664 ], [ -108.76417625380088, 45.661120794024356 ], [ -108.76512556307739, 45.66160053397468 ], [ -108.7660018485635, 45.66160053397468 ], [ -108.76730167203507, 45.6609676846642 ], [ -108.76795888614954, 45.6606410499634 ], [ -108.76987263367468, 45.66225967035234 ], [ -108.77660334041721, 45.66047943973854 ] ] ], "type": "Polygon" } }), bnsf: rewind({ "type": "Feature", "properties": {}, "geometry": { "coordinates": [ [ [ -108.77136219336967, 45.668012328549565 ], [ -108.76985132613115, 45.66831588553512 ], [ -108.76179020701508, 45.66829839555905 ], [ -108.75458781610489, 45.668309615486976 ], [ -108.7539871244419, 45.66889554132135 ], [ -108.7523174805036, 45.66912332012032 ], [ -108.75090335221351, 45.6697617073456 ], [ -108.74714710264027, 45.67193849334703 ], [ -108.74037056490062, 45.67346100973802 ], [ -108.73247961518531, 45.675387079931625 ], [ -108.72779285498017, 45.676505999507725 ], [ -108.7265526501567, 45.676974906354246 ], [ -108.72226801974436, 45.67878406791152 ], [ -108.72020005919545, 45.68004021018368 ], [ -108.71721591281084, 45.68153289373387 ], [ -108.71398792567045, 45.68245768856238 ], [ -108.71420854349671, 45.6826118195477 ], [ -108.7153464670207, 45.68236845464 ], [ -108.71857445416111, 45.68179248680775 ], [ -108.72004282058185, 45.68151324644322 ], [ -108.72137813900301, 45.68119686564424 ], [ -108.72356109433542, 45.68071012246105 ], [ -108.72596320081396, 45.68010131954989 ], [ -108.72873287194955, 45.67941640876748 ], [ -108.73174555666101, 45.67869112735974 ], [ -108.7347336533251, 45.67792833580387 ], [ -108.73689593978015, 45.67739295403024 ], [ -108.74013821465759, 45.676603230827965 ], [ -108.74386634197101, 45.67570441961851 ], [ -108.74688429484961, 45.67496604409061 ], [ -108.74921498466563, 45.674377717746125 ], [ -108.7511606398215, 45.673912326835136 ], [ -108.75342739850458, 45.67336724093295 ], [ -108.75631241928036, 45.67265610883243 ], [ -108.75889436753022, 45.67196546315117 ], [ -108.76410789883765, 45.67059448275248 ], [ -108.76586587512192, 45.67013028989331 ], [ -108.76834091402898, 45.66946930277942 ], [ -108.76963915814704, 45.66908472393652 ], [ -108.77135278580342, 45.66860728558683 ], [ -108.77136219336967, 45.668012328549565 ] ] ], "type": "Polygon" } }) })34:T614,annotations = [ // "text" is rendered label. Use "\n" newline deliminator to break into multiple lines // x position as pixels from left to right // y position as pixels from top to bottom (inverted from 8th-grade charts to matche SVG spec) // renders optional SVG text config fontSize, fill (i.e. text color), // fontWeight (e.g. "bold"), fontStyle (e.g. "italic") // and textAnchor (i.e. alignment -- 'start', 'middle' or 'end', defaulting to 'start') {text: 'NORTHWESTERN ENERGY\nYELLOWSTONE COUNTY\nGENERATING STATION', x: 335, y: 177, fontSize: 18, fontWeight: 'bold', fill: '#F85028', stroke: 'none', strokeOpacity: 0, }, {text: 'LAUREL', x: 120, y: 100, fontSize: 24, fontWeight: 'bold', fontStyle: 'normal'}, {text: 'Thiel Rd', x: 300, y: 335, fontSize: 12, fontStyle: 'italic', fontWeight: 'bold'}, {text: 'CHS Laurel\nRefinery', x: 200, y: 245, textAnchor: 'middle', fontSize: 14, fontStyle: 'normal'}, {text: 'BSNF Railway Yard', x: 300, y: 130, textAnchor: 'start', fontSize: 14, fontStyle: 'normal', rotate: -20}, {text: 'Yellowstone River', x: 100, y: 369, fontSize: 12, fontStyle: 'italic', rotate:-27}, {text: 'I-90', x: 400, y: 135, fontSize: 12, fontStyle: 'italic', fontWeight: 'bold', rotate:-27}, {text: '← to\nBozeman', x: 0, y: 232, fontSize: 12, fontStyle: 'italic', rotate:-25}, {text: 'to Billings →', x: 525, y: 75, fontSize: 12, fontStyle: 'italic', rotate:-28}, {text: '← U.S. 212\nto Red Lodge', x: 200, y: 390, fontSize: 12, fontStyle: 'italic', rotate:-75}, ]35:T8c8,map_600px_wide = Plot.plot({ width: 600, height: 400, style: { fontFamily: 'Arial', }, projection: { // scale/orientation optimized for Montana statewide maps type: 'albers', rotate: [110, 0, 0], domain: rewind(mapExtent), // sets map scope; rewind makes sure custom domains don't run into the geojson winding bug insetLeft: 10, insetRight: 10, insetTop: 10, insetBottom: 10, }, marks: [ // background context Plot.geo(shapes.montana, { fill: '#eae3dc' }), Plot.geo(shapes.urbanAreas, { fill: '#7e6b4c', fillOpacity: 0.3}), Plot.geo(shapes.water, { fill: '#94bcd0', }), Plot.geo(features.chsRefinery, { fill: '#a19884', fillOpacity: 1, stroke: 'black', strokeOpacity: 1, strokeWidth: 0 }), Plot.geo(features.bnsf, { fill: '#a19884', fillOpacity: 1, stroke: 'black', strokeOpacity: 1, strokeWidth: 0 }), Plot.geo( // Roads // exclude alleys {...shapes.roads, features: shapes.roads.features.filter(d => d.properties.ROUTE_CATG !== 'Alley')}, { stroke: '#666', strokeWidth: d => ({ "Interstate": 3, "NI-NHS": 2, // US highways "State Highway": 1, "Primary": 1, "Urban": 1, "Secondary": 0.5, "Off System": 0.5, })[d.properties.SYSTEM], // opacity: 0.2 } ), // Heavier stroke for Interstate Plot.geo({ ...shapes.roads, features: shapes.roads.features.filter(d => d.properties.SYSTEM === 'Interstate') }, { stroke: '#222', strokeWidth: 3, opacity: 1}), // Highlight Thiel Rd Plot.geo({ ...shapes.roads, features: shapes.roads.features.filter(d => d.properties.ROUTE_NAME === 'THIEL RD') }, { stroke: '#222', strokeWidth: 1, opacity: 1}), // // map content Plot.geo(features.ycgs, { fill: '#F85028', fillOpacity: 0.3, stroke: '#F85028', strokeOpacity: 1, strokeWidth: 3 }), annotationMarks, // inset map () => htl.svg`${inset_map()}`, // credit line () => htl.svg`Eric Dietrich / MTFP`, ] })36:[] 2f:{"title":"Laurel locator map","cells":[{"id":0,"value":"# Laurel locator map","pinned":false,"hidden":false,"mode":"md"},{"id":467,"value":"### Data import from MTFP's Montana Atlas spatial data repository","pinned":false,"hidden":false,"mode":"md"},{"id":24,"value":"dataBasePath = 'https://raw.githubusercontent.com/mtfreepress/montana-atlas/refs/heads/main/data/processed/'","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"res = ({\n // available resolutions\n m1000: '1000m-resolution/',\n m100: '100m-resolution/',\n m10: '10m-resolution/',\n m1:'1m-resolution/',\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":835,"value":"dataBasePath + res.m10 + '/YELLOWSTONE/mt-all-roads-1m'","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"shapes = ({\n montana: await d3.json(dataBasePath + res.m10 + 'mt-state-boundary-10m.geojson'),\n // Just Yellowstone Co roads for file size management\n roads: await d3.json(dataBasePath + res.m10 + 'YELLOWSTONE/mt-all-roads-10m.geojson'), \n water: await d3.json(dataBasePath + res.m10 + 'mt-waterways-stream-areas-10m.geojson'),\n urbanAreas: await d3.json(dataBasePath + res.m10 + 'census-urban-areas-2020-10m.geojson'),\n\n \n \n \n // counties: await d3.json(dataBasePath + res.m100 + 'mt-counties-100m.geojson'),\n // reservations: await d3.json(dataBasePath + res.m100 + 'mt-reservations-100m.geojson'),\n // forests: await d3.json(dataBasePath + res.m100 + 'national-forests-100m.geojson'),\n // nationalParks: await d3.json(dataBasePath + res.m100 + 'national-parks-100m.geojson'),\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1332,"value":"// old data that's not replicated in the new system yet\nimport { highways, lakes } from '@eidietrich/geojson-mapping-rig'","pinned":true,"hidden":false,"mode":"ojs"},{"id":532,"value":"// mapExtent = shapes.montana\n\n// // example of a custom-developed map extent produced by hand via Geojson.io or similar\n// // rewind() makes sure the coordinates aren't encoded \"upside-down\", \n// // which happens sometimes given inconsistency between different flavors of \nmapExtent = rewind({\n \"type\": \"FeatureCollection\",\n \"features\": [\n {\n \"type\": \"Feature\",\n \"properties\": {},\n \"geometry\": {\n \"coordinates\": [\n [\n [\n -111.06689475162541,\n 45.69882646176575\n ],\n [\n -111.06689475162541,\n 45.67803619820225\n ],\n [\n -111.02780149479094,\n 45.67803619820225\n ],\n [\n -111.02780149479094,\n 45.69882646176575\n ],\n [\n -111.06689475162541,\n 45.69882646176575\n ]\n ]\n ],\n \"type\": \"Polygon\"\n }\n }\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1328,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":1305,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":470,"value":"### Custom data","pinned":false,"hidden":false,"mode":"md"},{"id":980,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":472,"value":"### Output map","pinned":false,"hidden":false,"mode":"md"},{"id":809,"value":"#### 600px map\n*Sized for full-column-width images in the MTFP CMS or newsletters — should export at 2x resolution on a Macbook screen.*","pinned":false,"hidden":false,"mode":"md"},{"id":868,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":875,"value":"// white border from https://archive.efedorenko.com/writing/outlining-text-with-css-and-svg\nannotationMarks = () => htl.svg`\n ${annotations.map(d => {\n return htl.svg`${d.text.split('\\n').map((line) => htl.svg`${line}`)}`\n })}\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":584,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":1472,"value":"DOM.download(() => rasterize(map_600px_wide), 'locator-map-export.png', \"Save map as PNG (click twice)\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":815,"value":"#### 330px map\n*Sized for inset images in the MTFP CMS — should export at 2x resolution on a Macbook screen.*","pinned":false,"hidden":false,"mode":"md"},{"id":1464,"value":"**TODO**","pinned":false,"hidden":false,"mode":"md"},{"id":566,"value":"### Libraries\n\n`rewind` ensures GeoJson features are encoded the correct way, avoiding a frustrating display bug","pinned":false,"hidden":false,"mode":"md"},{"id":559,"value":"import {rewind} from \"@fil/rewind\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1467,"value":"import {rasterize} from \"@mbostock/saving-svg\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W36","stdlib":"1","titling":"auto"}