29:null 2a:["$","title",null,{"children":"London Holiday | 🪦 dv design 2025 spring | Observable"}] 2f:T5a0,photoMarkers = [ { coords: [51.5194, -0.1269], img: await FileAttachment("1 british museum.jpg").url(), caption: "British Museum", story: "First stop of the trip — I was still groggy from the flight but the Rosetta Stone blew me away. I bought a magnet shaped like a mummy." }, { coords: [51.5115, -0.1313], img: await FileAttachment("2 chinatown.jpg").url(), caption: "Chinatown", story: "Came here for dinner and ended up with a bag full of dragon keychains. The lanterns were mesmerizing — totally different vibe from the museum." }, { coords: [51.5238, -0.1586], img: await FileAttachment("3 sherlock homes museum.jpg").url(), caption: "Sherlock Holmes Museum", story: "As a mystery nerd, this was heaven. I nerded out with a fake pipe and bought a notebook that says 'Detective in Training.' No shame." }, { coords: [51.5413, -0.1429], img: await FileAttachment("4 camden market.jpg").url(), caption: "Camden Market", story: "This place was chaotic in the best way — street food smells, graffiti everywhere, and I scored a funky tote bag I didn’t need but love." }, { coords: [51.5014, -0.1419], img: await FileAttachment("5 buckingham palace.webp").url(), caption: "Buckingham Palace", story: "Ended the trip here, feet sore but heart full. The gift shop was overpriced, but I caved and bought a corgi plush. No regrets." } ] 30:T9f1,mapWithRoute = (async () => { const container = html`

`; const map = L.map(container).setView([51.515, -0.13], 13); L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: "© OpenStreetMap contributors" }).addTo(map); const markers = photoMarkers.map(d => { const marker = L.marker(d.coords).addTo(map); marker.bindPopup(` ${d.caption}

${d.story}

`); return { coords: d.coords, marker }; }); const apiKey = "5b3ce3597851110001cf6248869698274556492e8121b387e7072407"; const coordinates = souvenirData.map(d => [d.Longitude, d.Latitude]); const res = await fetch("https://api.openrouteservice.org/v2/directions/foot-walking/geojson", { method: "POST", headers: { "Authorization": apiKey, "Content-Type": "application/json" }, body: JSON.stringify({ coordinates: coordinates, instructions: false }) }); const geojson = await res.json(); const routeCoords = geojson.features[0].geometry.coordinates.map(([lng, lat]) => [lat, lng]); const drawRouteLoop = () => { const animatedLine = L.polyline([], { color: "red", weight: 4, opacity: 0.8 }).addTo(map); markers.forEach(m => m.opened = false); let i = 0; const threshold = 50; const first = routeCoords[0]; markers.forEach(m => { const dist = map.distance(first, m.coords); if (dist < threshold) { m.marker.openPopup(); m.opened = true; setTimeout(() => m.marker.closePopup(), 2000); } }); const drawInterval = setInterval(() => { if (i < routeCoords.length) { const current = routeCoords[i]; animatedLine.addLatLng(current); markers.forEach(m => { if (!m.opened) { const dist = map.distance(current, m.coords); if (dist < threshold) { m.marker.openPopup(); m.opened = true; setTimeout(() => m.marker.closePopup(), 4000); } } }); i++; } else { clearInterval(drawInterval); map.removeLayer(animatedLine); setTimeout(drawRouteLoop, 1000); } }, 50); }; drawRouteLoop(); return container; })() 31:[{"id":"882f8e73cfe7a1c4d10b3490c993751e4adbef8024e0c40888ebd1334dd451450124b5e1737582e6a70a9ec2604f0930d01abb1a636ac390cb413dcdca72bfb1","href":"https://static.observableusercontent.com/files/882f8e73cfe7a1c4d10b3490c993751e4adbef8024e0c40888ebd1334dd451450124b5e1737582e6a70a9ec2604f0930d01abb1a636ac390cb413dcdca72bfb1","name":"1 british museum.jpg","type":"image/jpeg","lastModified":1747085335517.264,"size":204679},{"id":"29ff66c34a16469c4e2806f65708e74829036715b15fbf23ead6aaef0cabe4c906ad2b74d6161e48ff103219a746b87125db7cc3aaab15bc15f2793a8ad8ecca","href":"https://static.observableusercontent.com/files/29ff66c34a16469c4e2806f65708e74829036715b15fbf23ead6aaef0cabe4c906ad2b74d6161e48ff103219a746b87125db7cc3aaab15bc15f2793a8ad8ecca","name":"2 chinatown.jpg","type":"image/jpeg","lastModified":1747085335564.974,"size":647039},{"id":"7b269c98bdba836e3b69384b074c38082f57d5e1199ee8950b894c0fe431b69df756c46510a872b603f77da4f54b4796460f83d357b39c7158b523250be1eb8d","href":"https://static.observableusercontent.com/files/7b269c98bdba836e3b69384b074c38082f57d5e1199ee8950b894c0fe431b69df756c46510a872b603f77da4f54b4796460f83d357b39c7158b523250be1eb8d","name":"3 sherlock homes museum.jpg","type":"image/jpeg","lastModified":1747085335667.819,"size":1108442},{"id":"2761cc29eed04a9096f52d7b10fe51f28b5977285696062c2fe0cef95a0076262aa223b2c8ab15e9ea039aaa13442749cc91b811197b9928db2502c567ea282b","href":"https://static.observableusercontent.com/files/2761cc29eed04a9096f52d7b10fe51f28b5977285696062c2fe0cef95a0076262aa223b2c8ab15e9ea039aaa13442749cc91b811197b9928db2502c567ea282b","name":"4 camden market.jpg","type":"image/jpeg","lastModified":1747085335681.79,"size":1172174},{"id":"9fa42fb895aff6e32178fe2159e6faa0ea7bab680a770ed4eabb72ab7b9faad826a84c86a06106c7f53f206d27dd7ed2259610f957bfa246432c9c22d17b247c","href":"https://static.observableusercontent.com/files/9fa42fb895aff6e32178fe2159e6faa0ea7bab680a770ed4eabb72ab7b9faad826a84c86a06106c7f53f206d27dd7ed2259610f957bfa246432c9c22d17b247c","name":"5 buckingham palace.webp","type":"image/webp","lastModified":1747085335513.488,"size":180036},{"id":"e85abeb4017e836b72076e6ab67e330ad3e8954cd4e8a213bd6638e84819890dd139c26bce420cfe58f2b975cadf2aa6ef7ae72a665f644065f5df2a6f989b91","href":"https://static.observableusercontent.com/files/e85abeb4017e836b72076e6ab67e330ad3e8954cd4e8a213bd6638e84819890dd139c26bce420cfe58f2b975cadf2aa6ef7ae72a665f644065f5df2a6f989b91","name":"london_souvenir_route.csv","type":"text/csv","lastModified":1747085335407.058,"size":407}] 2d:{"id":"a499ca8aba443fd6","slug":null,"title":"London Holiday","thumbnail":"eb14d3640db78b1a9c73ffe1eef97f9e26e7a66d469d8ca9e9ce011613a4e5b7","access_level":"public","create_time":"$D2025-05-12T21:28:22.950Z","update_time":"$D2025-06-25T14:07:01.808Z","view_time":null,"first_public_time":"$D2025-10-01T04:02:11.753Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"50ad26f6f15e6ae6","login":"dv-design-2025s","name":"🪦 dv design 2025 spring","avatar_url":"https://avatars-next.observableusercontent.com/682ee67bd6bcc28d575df75caeafae9984eba60d20a6728c4458dea26da63d5a","tier":"pro_2024"},"version":66,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d7e24f6a24533a68","login":"wasifa-orthy","name":"Wasifa Orthy","avatar_url":"https://avatars-next.observableusercontent.com/dd9442b247093e9f64dec2f813d0658d8082dcb5565f3314ba8a9fb8eebf89f1","tier":null}],"members":[{"type":"individual","id":"d7e24f6a24533a68","login":"wasifa-orthy","name":"Wasifa Orthy","avatar_url":"https://avatars-next.observableusercontent.com/dd9442b247093e9f64dec2f813d0658d8082dcb5565f3314ba8a9fb8eebf89f1","tier":null,"role":"editor"},{"type":"team","id":"50ad26f6f15e6ae6","login":"dv-design-2025s","name":"🪦 dv design 2025 spring","avatar_url":"https://avatars-next.observableusercontent.com/682ee67bd6bcc28d575df75caeafae9984eba60d20a6728c4458dea26da63d5a","tier":"pro_2024","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"London Holiday","cells":[{"id":0,"value":"# London Holiday","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"souvenirData = FileAttachment(\"london_souvenir_route.csv\").csv({typed: true})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2e:"$2d:body"