31:T86e,mapRender = { // Create the \`map\` object with the mapboxgl.Map constructor, referencing let map = new mapboxgl.Map({ container, center: [ -90.829015, 44.246179 ], style: 'mapbox://styles/erincaughey/ckh6j7qan0brt19pe1sf050wl', zoom: 5.6, bearing: 0, pitch: 0, scrollZoom: false }); mapboxgl.accessToken = 'pk.eyJ1IjoibGF0aW1lcyIsImEiOiJjajhvcXRraGUwNnlwMzNyczR3cTBsaWh1In0.0cPKLwe2A0ET4P5CtWSiLQ'; var nav = new mapboxgl.NavigationControl(); map.addControl(nav, 'top-left'); map.on('click', 'kwik-trip-brand-stores', function (e) { var coordinates = e.features[0].geometry.coordinates.slice(); var address = e.features[0].properties.address; var name = e.features[0].properties.store_name; // Ensure that if the map is zoomed out such that multiple // copies of the feature are visible, the popup appears // over the copy being pointed to. while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) { coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360; } new mapboxgl.Popup() .setLngLat(coordinates) .setHTML('

' + name + '

' + '

' + address + '

') .addTo(map); }); map.addControl(new mapboxGlGeocoder({ accessToken: mapboxgl.accessToken, mapboxgl: mapboxgl, marker: false })); const href2 = await require.resolve('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v4.3.0/mapbox-gl-geocoder.css') document.head.appendChild(html``); // Change the cursor to a pointer when the mouse is over the packers-data layer. map.on('mouseenter', 'kwik-trip-brand-stores', function () { map.getCanvas().style.cursor = 'pointer'; }); // Change it back to a pointer when it leaves. map.on('mouseleave', 'kwik-trip-brand-stores', function () { map.getCanvas().style.cursor = ''; }); // Be careful to clean up the map's resources using \`map.remove()\` whenever // this cell is re-evaluated. try { yield map; yield invalidation; } finally { map.remove(); } }32:[] 2f:{"title":"All Kwik Trip brand stores","cells":[{"id":12,"value":"md`# All Kwik Trip brand stores\nIf you're from Wisconsin (I'm not originally, but I've learned this in the last 10 years) you seek out Kwik Trip when you drive anywhere in the state. Just follow the red logo. Cue #30DayMapChallenge day 6: Red. To prove just how prolific this brand is, here's the density of Kwik Trip/Star locations in the region. Props to the brand for publishing all their locations in an easily downloadable dataset.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"container = html`

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"mapboxgl = {\n const gl = await require(\"mapbox-gl@0.49\");\n if (!gl.accessToken) {\n gl.accessToken =\n \"pk.eyJ1IjoiZXJpbmNhdWdoZXkiLCJhIjoiY2lnd2x5ZWkwMHNqMzY1bTAyMmJ5aTlkbyJ9.iQD_-2TgQLMx5CDlVytksA\";\n const href = await require.resolve(\"mapbox-gl@0.49/dist/mapbox-gl.css\");\n document.head.appendChild(html``);\n }\n return gl;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":32,"value":"mapboxGlGeocoder = await require('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v4.3.0/mapbox-gl-geocoder.min.js');","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"//styles\nhtml``","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}