2e:null 2f:["$","title",null,{"children":"Grocery Store Routing with TurfJS | jbranigan | Observable"}] 34:T89b,map = { const container = html`

`; yield container; // Give the container dimensions. const map = new mapboxgl.Map({ container, center: [-97.7549, 30.2386], // pitch: 45, bearing: 215, zoom: 19, style: "mapbox://styles/mapbox/streets-v10", //scrollZoom: false }); map.on('style.load', function() { // define the geojson source for both the map and the turf functions map.addSource('heb-internal', { 'type': 'geojson', 'data': geojson }); // set up a source for the route, empty for now map.addSource('shortest-path', { type: 'geojson', data: { type: 'FeatureCollection', features: [ ] } }); // add the building geojson to the map map.addLayer({ 'id': 'internal', 'type': 'fill-extrusion', 'source': 'heb-internal', 'layout': {}, 'paint': { 'fill-extrusion-color': '#088', 'fill-extrusion-height': ['get', 'height'], 'fill-extrusion-opacity': 0.8 } }); // add the empty route to the map map.addLayer({ 'id': 'route', 'type': 'line', 'source': 'shortest-path', 'layout': {}, 'paint': { 'line-width': 5, 'line-color': '#ff0000' } }); // set up the route parameters var start = [-97.754674, 30.238633]; // var end = [-97.755238, 30.238570]; var end = finishOptions.features[choice]; var options = { obstacles: obstacles, // this is the building internal features buffered by 0.5m // units: 'meters', // minDistance: 0.1, resolution: 0.001 }; // calculate the path var path = turf.shortestPath(start, end, options); var simplePath = turf.simplify(path, { tolerance: 0.00001 }); var spline = turf.bezierSpline(simplePath, { sharpness: 0.2 }); // and add the path to the map // this is just to get there quickly and will need refactoring map.getSource('shortest-path').setData({ type: 'FeatureCollection', features: [ spline ] }); }); invalidation.then(() => map.remove()); }35:T477,finishOptions = ({ "type": "FeatureCollection", "name": "destinations", "features": [ { "type": "Feature", "properties": { "Name": "Seafood" }, "geometry": { "type": "Point", "coordinates": [ -97.7548391, 30.2382504 ] } }, { "type": "Feature", "properties": { "Name": "Produce" }, "geometry": { "type": "Point", "coordinates": [ -97.7544914, 30.2385283 ] } }, { "type": "Feature", "properties": { "Name": "Nail care" }, "geometry": { "type": "Point", "coordinates": [ -97.754997783769213, 30.238429268502816 ] } }, { "type": "Feature", "properties": { "Name": "Hot Cereal" }, "geometry": { "type": "Point", "coordinates": [ -97.755308175443247, 30.238633674088895 ] } }, { "type": "Feature", "properties": { "Name": "Yogurt" }, "geometry": { "type": "Point", "coordinates": [ -97.755236875475447, 30.238585000195275 ] } }, { "type": "Feature", "properties": { "Name": "Salad Dressing" }, "geometry": { "type": "Point", "coordinates": [ -97.755386748638642, 30.238782007259253 ] } }, { "type": "Feature", "properties": { "Name": "Gluten Free" }, "geometry": { "type": "Point", "coordinates": [ -97.755349021369753, 30.238632502823982 ] } } ] })36:[] 32:{"id":"092ed7c730734c79","slug":"heb-routing","title":"Grocery Store Routing with TurfJS","thumbnail":"4de8baddb247d997347c8328e51dbf477b005735dda1a22f5aebbe40ac96de65","access_level":"public","create_time":"$D2018-10-23T19:42:00.223Z","update_time":"$D2020-02-17T18:25:54.628Z","view_time":null,"first_public_time":"$D2018-10-23T21:12:00.383Z","has_unpublished_edits":null,"fork":true,"stars":4,"starred":false,"owner":{"type":"team","id":"3734e46cc017e3a2","login":"jbranigan","name":"","avatar_url":"https://avatars-next.observableusercontent.com/967ced96aa7518104b7d7f665f8ee2282323f1664bdf9dde6c349c4bed774187","tier":"starter_2024"},"version":154,"publish_version":154,"role":null,"authored":false,"authors":[{"type":"individual","id":"74033eace9e09c30","login":"jbranigan","name":"","avatar_url":"https://avatars-next.observableusercontent.com/967ced96aa7518104b7d7f665f8ee2282323f1664bdf9dde6c349c4bed774187","tier":null}],"members":[{"type":"individual","id":"74033eace9e09c30","login":"jbranigan","name":"","avatar_url":"https://avatars-next.observableusercontent.com/967ced96aa7518104b7d7f665f8ee2282323f1664bdf9dde6c349c4bed774187","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"title":"Grocery Store Routing with TurfJS","cells":[{"id":0,"value":"md`# Grocery Store Routing with TurfJS`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":140,"value":"viewof choice = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"mapboxgl = {\n const gl = await require(\"mapbox-gl@0.49\");\n if (!gl.accessToken) {\n // This is my token. https://www.mapbox.com/help/how-access-tokens-work/\n gl.accessToken = \"pk.eyJ1IjoiYnJhbmlnYW4iLCJhIjoiY2puM2lucjMzMGdlejNwcWdsMmoxZnFwdCJ9.mmh4Bjo-y_43TnFolyb17Q\";\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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"turf = require(\"https://cdn.jsdelivr.net/npm/@turf/turf@5/turf.min.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"geojson = fetch('https://gist.githubusercontent.com/jbranigan/4353a37b15baf6578d89f1e5625219d3/raw/2f2b204bf6501b3f00941b86f8775d538db9dbd6/heb-austin-45-internal.geojson').then(res => res.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"obstacles = fetch('https://gist.githubusercontent.com/jbranigan/a2124761a9b47ffea0a79305059e9abc/raw/044bee2e19e332f05703a8e2d03e5a089c632a84/heb-obstacles.geojson').then(res => res.json())","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":145,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 33:"$32:body"