30:T71d,md` Here are my tribulations exploring this dataset that contains records slave trades in history. It contains **${ trips.length }** voyages made between *${d3.min( trips.map(({ year }) => year) )}* and *${d3.max( trips.map(({ year }) => year) )}* by Europeans that moved enslaved Africans across the Atlantic. The following video shows all the different visualization machinery I built while trying to understand this dataset. The rendering interval is between the years the dataset contains data for (1519 - 1865). The barcharts show the port locations that had the most trips. The dataset contains three types of ports: start, stop and final. The area chart shows the number of trips for that particular year. The numbers at the top left are the current year, number of trips and number of people captured over time. Finally, the map shows the port locations color encoded by type: start, stop, and final. In the [original dataset](https://www.slavevoyages.org/voyage/downloads#full-versions-of-the-trans-atlantic-slave-trade-database/0/en/), the different port location come as strings. I had to do some processing to extract the geolocations. That process is not perfect and although I think I got most of the extractions right, I haven't confirmed that manually. You have been warned! Drop me a message if you build anything with this dataset! -drio out.

`31:[{"id":"88c7319e70fd6af7ed36dff96f6e39837ef2a3f1733770008554268221238bef718ddbb07045a3e2b7a531f96d89877b7468facbaaf1aaee63b3a98b67b9cfbe","href":"https://static.observableusercontent.com/files/88c7319e70fd6af7ed36dff96f6e39837ef2a3f1733770008554268221238bef718ddbb07045a3e2b7a531f96d89877b7468facbaaf1aaee63b3a98b67b9cfbe","name":"land-50m.json","type":"application/json","lastModified":1702818321954.931,"size":545534},{"id":"d7c70edb655422c3dc0b465a11200f090880f5217d406ebcfec1370db4b6ee4922976d5c4155f517a4f9e02b4a55db7d06111179039f7db97e9bed2412ee2b98","href":"https://static.observableusercontent.com/files/d7c70edb655422c3dc0b465a11200f090880f5217d406ebcfec1370db4b6ee4922976d5c4155f517a4f9e02b4a55db7d06111179039f7db97e9bed2412ee2b98","name":"locations.final.json","type":"application/json","lastModified":1702590446236.813,"size":96837},{"id":"1e4dd47cb72c20087c1efe1f3245990c1beeb1d13b0f35c8b7dc1b3e3f3d48a2cfe2ca3640553cc0e9101d5b4ea8e93643c72ae9f4bc8573e0123b60326fa6fd","href":"https://static.observableusercontent.com/files/1e4dd47cb72c20087c1efe1f3245990c1beeb1d13b0f35c8b7dc1b3e3f3d48a2cfe2ca3640553cc0e9101d5b4ea8e93643c72ae9f4bc8573e0123b60326fa6fd","name":"SlaveVoyagesV2.mp4","type":"video/mp4","lastModified":1703338715081.33,"size":730515},{"id":"ef74238fbb3622d9db7c630cfe9f8f0254f8d99ea5cf3a4ebe31e0c024782f8688b14cdf1c02ea1a6cd9531201dffbad28d82ddb36bbb58cb68f251678dde31d","href":"https://static.observableusercontent.com/files/ef74238fbb3622d9db7c630cfe9f8f0254f8d99ea5cf3a4ebe31e0c024782f8688b14cdf1c02ea1a6cd9531201dffbad28d82ddb36bbb58cb68f251678dde31d","name":"SlaveVoyagesV2.mov","type":"video/quicktime","lastModified":1703367966012.231,"size":3085845},{"id":"f4d55ad32bb16dda7fb768f550e8ce9e7db7378b814ec2210bd6f4db5596c83cedb43d1df397883a3b32ee9eea48e7cff83edcc375528805251911e95b16ae4c","href":"https://static.observableusercontent.com/files/f4d55ad32bb16dda7fb768f550e8ce9e7db7378b814ec2210bd6f4db5596c83cedb43d1df397883a3b32ee9eea48e7cff83edcc375528805251911e95b16ae4c","name":"intra.csv","type":"text/csv","lastModified":1702505682109.307,"size":3082012},{"id":"c0415ee2b9ae8185a5441f2b2573f3ce347143ea1eaf949718f696261307fc80dbe7bed70475f9435788516f9358fa8d8b0d5d1a7c191066e85f0f8d147084a2","href":"https://static.observableusercontent.com/files/c0415ee2b9ae8185a5441f2b2573f3ce347143ea1eaf949718f696261307fc80dbe7bed70475f9435788516f9358fa8d8b0d5d1a7c191066e85f0f8d147084a2","name":"trans.csv","type":"text/csv","lastModified":1702505682438.942,"size":3556953},{"id":"4eec02f42bcc9bbbbc8a1f97ee8636010a250882392ecb0672e557cdc5548ee83b0a6bca8f29fc08aef60431183fc6d11accc8e79a92a22f44854007feb83ff3","href":"https://static.observableusercontent.com/files/4eec02f42bcc9bbbbc8a1f97ee8636010a250882392ecb0672e557cdc5548ee83b0a6bca8f29fc08aef60431183fc6d11accc8e79a92a22f44854007feb83ff3","name":"locations@1.final.json","type":"application/json","lastModified":1702660248712.628,"size":1130777},{"id":"7258d1b0c1ef80f9fef370b6ba5e1d4717f0540c9e362747c6ea348e9d503432f90409b7f9eb5dbc111fd415fd8241a8256e1de63f0633488e3b3364dca4f622","href":"https://static.observableusercontent.com/files/7258d1b0c1ef80f9fef370b6ba5e1d4717f0540c9e362747c6ea348e9d503432f90409b7f9eb5dbc111fd415fd8241a8256e1de63f0633488e3b3364dca4f622","name":"countries.geojson","type":"application/geo+json","lastModified":1702661781949.461,"size":137},{"id":"0fe1bd4b3c7aaed725de0f49fe263a40cbd7d334e690eee222ea05e30cd62c85ae62f11685eb0275669361993471e6819225aaf280b47ecfe88f8a8a88f56df2","href":"https://static.observableusercontent.com/files/0fe1bd4b3c7aaed725de0f49fe263a40cbd7d334e690eee222ea05e30cd62c85ae62f11685eb0275669361993471e6819225aaf280b47ecfe88f8a8a88f56df2","name":"countries.json","type":"application/json","lastModified":1702661946635.933,"size":137},{"id":"9cbeb67404fdb2e337d3fb508a646918d5f48d39b62a9298af2b8390ffdad186a4d6210aa78bb0c117e1cb546e2c476c2b0da5496f430503885287c7d7618e99","href":"https://static.observableusercontent.com/files/9cbeb67404fdb2e337d3fb508a646918d5f48d39b62a9298af2b8390ffdad186a4d6210aa78bb0c117e1cb546e2c476c2b0da5496f430503885287c7d7618e99","name":"countries@1.geojson","type":"application/geo+json","lastModified":1702662023972.374,"size":24090863}] 2e:{"title":"Insights form the slave voyages dataset","cells":[{"id":0,"value":"# Insights form the slave voyages dataset","pinned":false,"hidden":false,"mode":"md"},{"id":173,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":1960,"value":"viewof replayVideo = html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":1937,"value":" {\n while (true) {\n return html`\n\n

\n\n

`;\n replayVideo;\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1997,"value":"separator(\"tomato\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":891,"value":"viewof selectStartPort = Inputs.select(startPorts, {\n value: \"Charleston\",\n label: \"Select start port\"\n})\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":852,"value":"filteredTrips = groupedTrips.filter(\n ([startPort]) => startPort === selectStartPort\n)[0][1]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1008,"value":"connectionsFromTrips(filteredTrips)","pinned":true,"hidden":false,"mode":"ojs"},{"id":1003,"value":"function connectionsFromTrips(trips) {\n const lc = [];\n for (const t of trips) {\n lc.push({\n data: t,\n start: t.coorStart,\n end: t.coorPurchased\n });\n lc.push({\n data: t,\n start: t.coorPurchased,\n end: t.coorFinal\n });\n }\n return lc;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":929,"value":"filteredLocations = {\n const first = filteredTrips[0];\n const l = [[first.portStart, first.coorStart, \"tomato\"]];\n for (const t of filteredTrips) {\n l.push([t.portPurchased, t.coorPurchased], \"steelblue\");\n l.push([t.portFinal, t.coorFinal, \"green\"]);\n }\n return l;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":850,"value":"md`Num of filtered trips: ${filteredTrips.length}`","pinned":false,"hidden":false,"mode":"ojs"},{"id":224,"value":"{\n const pick = filteredTrips.map(\n ({ year, portPurchased, portFinal, countFirstPort }) => ({\n year,\n portPurchased,\n portFinal,\n countFirstPort\n })\n );\n return Inputs.table(pick, {\n sort: \"portStart\",\n width: {\n year: 50,\n portFinal: 100,\n portPurchased: 50,\n countFirstPort: 50\n }\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":677,"value":"md`

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":665,"value":"md`# Questions\n- How many people where taking; over time?\n- How many trips per year?\n- What are the locations with more starts? and finals?\n- Can we group by \"country\"?\n\n# Tasks\n- Filter the map so we only look at locations with a certain amount of counts.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":168,"value":"md`\nRegarding the raw data:\n\n \"Voyage itinerary imputed port where began (ptdepimp) place\": \n \"Voyage itinerary imputed principal place of slave purchase (mjbyptimp)\":\n \"Voyage itinerary imputed principal port of slave disembarkation (mjslptimp) place\":\n\ndeserve special attention. I read them like so:\n\n1. Where the trip started. \n2. Where the slaves were purchased. \n3. The final destination.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":163,"value":"md`\nI had to do some work offline to get the geolocations of the ports from input dataset. \nIn the locations variable we have the *original* name as appears in the dataset and the *final* is the one I end up using in order to be able to query openstreetmap for the geolocation. Most of them were fine but some of them I couldn't get any result. \n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":334,"value":"md`# Code`","pinned":false,"hidden":false,"mode":"ojs"},{"id":864,"value":"startPorts = [...new Set(finalTrips.map(({ portStart }) => portStart))].sort(\n (a, b) => a.localeCompare(b)\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":910,"value":"minMaxNumberOfTrips = d3.extent(groupedTrips.map(([_, l]) => l.length))","pinned":true,"hidden":false,"mode":"ojs"},{"id":827,"value":"groupedTrips = d3.groups(finalTrips, (d) => d.portStart)","pinned":true,"hidden":false,"mode":"ojs"},{"id":768,"value":"finalLocations = tripsToLocations(finalTrips)\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":756,"value":"function tripsToLocations(trips) {\n const o = {};\n const l = [];\n for (const t of tripsWithCoordinates) {\n if (t.coorStart) o[t.portStart] = t.coorStart;\n if (t.coorPurchased) o[t.portPurchased] = t.coorPurchased;\n if (t.coorFinal) o[t.portFinal] = t.coorFinal;\n }\n Object.keys(o).forEach((portName) => l.push([portName, o[portName]]));\n return l;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":707,"value":"finalTrips = {\n const s = new Set([]);\n for (const t of tripsWithCoordinates) {\n if (!t.coorStart || !t.coorPurchased || !t.coorFinal) continue;\n s.add(t);\n }\n return [...s];\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":736,"value":"percentageOfMissingCoordinates = {\n return +((100 * portsWithoutCoordinates.length) / portNames.length).toFixed(\n 2\n );\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":731,"value":"portNames = {\n const s = new Set([]);\n for (const t of trips) {\n s.add(t.portStart);\n s.add(t.portPurchased);\n s.add(t.portFinal);\n }\n return [...s];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":699,"value":"portsWithoutCoordinates = {\n const s = new Set([]);\n for (const t of tripsWithCoordinates) {\n if (!t.coorStart) s.add(t.portStart);\n if (!t.coorPurchased) s.add(t.portPurchased);\n if (!t.coorFinal) s.add(t.portFinal);\n }\n return [...s];\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":716,"value":"tripsWithCoordinates[123]","pinned":true,"hidden":false,"mode":"ojs"},{"id":711,"value":"tripsWithCoordinates = {\n const r = [];\n const ot = originalToCoordinates;\n for (const t of trips) {\n const o = Object.assign(t, {\n coorStart: ot[t.portStart],\n coorPurchased: ot[t.portPurchased],\n coorFinal: ot[t.portFinal]\n });\n r.push(o);\n }\n return r;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":703,"value":"originalToCoordinates = {\n const o = {};\n for (const l of locations) {\n o[l.original] = l.coordinates;\n }\n return o;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":571,"value":"md`This shows the number of times a location appears on a trip. It is separated by the port type: start, purchased or final.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":564,"value":"locationsCounts = {\n const o = {};\n const portType = \"portStart portPurchased portFinal\".split(\" \");\n\n for (const t of trips) {\n for (const pt of portType) {\n const locName = t[pt];\n if (!o[pt]) o[pt] = [];\n o[pt][locName] = o[pt][locName] ? o[pt][locName] + 1 : 1;\n }\n }\n\n const oa = [];\n for (const pt of portType) {\n for (const loc of Object.keys(o[pt])) {\n oa.push({\n portType: pt,\n location: loc,\n count: o[pt][loc]\n });\n }\n }\n\n return oa;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":292,"value":"nonNullLocations = locations.map((e) => e).filter((e) => e.coordinates !== null)","pinned":false,"hidden":false,"mode":"ojs"},{"id":324,"value":"import { chart as mapSVG } from \"@drio/svg-map-pan-zoom-locations\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":227,"value":"locations.filter((e) => e.original === \"Le Havre\")[0].coordinates","pinned":true,"hidden":false,"mode":"ojs"},{"id":1399,"value":"separator()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1404,"value":"function genStats(tripsToYear, currY, useEmojis = true) {\n const e = [\"⏰ \", \"⛵️ \", \"🧍🏿‍♂️ \"];\n const ge = (i) => (useEmojis ? e[i] : \" \");\n const accNum = tripsToYear.reduce((acc, curr) => acc + curr.numTrips, 0);\n const accPeople = tripsToYear.reduce(\n (acc, curr) => acc + curr.peopleCount,\n 0\n );\n return md`# ${ge(0)} ${currY} \n# ${ge(1)} ${accNum}\n# ${ge(2)} ${d3.format(\".2s\")(accPeople)}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1073,"value":"function plotLineChart(data) {\n return Plot.plot({\n title: \"# of trips per year\",\n style: {\n fontSize: \"12px\",\n background: \"transparent\"\n },\n grid: true,\n width,\n marks: [\n Plot.areaY(data, {\n x: \"year\",\n y: \"numTrips\",\n //tickFormat: \" %Y\",\n strokeWidth: 3,\n fill: () => \"tomato\"\n }),\n\n Plot.ruleY([0]),\n Plot.axisY(d3.ticks(0, 350, 10)),\n Plot.axisX(d3.ticks(yearsRange[0], yearsRange[1] + 1, 20), {\n tickFormat: d3.timeFormat\n })\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1439,"value":"function plotMap(data) {\n const color = (d) => {\n if (d.portType === \"start\") return \"lightgreen\";\n if (d.portType === \"purchased\") return \"steelblue\";\n if (d.portType === \"final\") return \"tomato\";\n };\n return Plot.plot({\n width,\n projection: { type: \"mercator\" },\n marks: [\n Plot.geo(countries, { fill: \"currentColor\", fillOpacity: 0.2 }),\n Plot.dot(data, {\n x: (d) => d.latitude,\n y: (d) => d.longitude,\n r: 5,\n fill: color,\n fillOpacity: 0.2,\n strokeOpacity: 0.4\n })\n ]\n });\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1510,"value":"mapChart = {\n visibility();\n const coordinates = [...tripsToYear.map((e) => e.coordinates)];\n let flat = [];\n for (const listC of coordinates) {\n for (const e of listC) {\n flat.push(e);\n }\n }\n return plotMap(flat);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1456,"value":"uniqStartPorts = {\n return [\n ...new Set(\n trips\n .filter((e) => e.coorStart)\n .map((e) => e.coorStart)\n .map((e) => `${e.join(\"_\")}`)\n )\n ].map((e) => e.split(\"_\"));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1167,"value":"tripsToYear = tripsByYear.filter((e) => e.year <= untilYear)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1651,"value":"d3.range(1, 100, 1)","pinned":true,"hidden":false,"mode":"ojs"},{"id":1163,"value":"viewof untilYear = Scrubber(d3.range(yearsRange[0], yearsRange[1]), {\n autoplay: false,\n alternate: false,\n loop: false,\n delay: 100\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1155,"value":"stats = genStats(tripsToYear, untilYear, true)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1097,"value":"lineChartToYear = {\n const trips = tripsByYear.filter(({ year }) => year <= untilYear);\n return plotLineChart(trips);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1102,"value":"yearsRange = d3.extent(trips.map(({ year }) => year))","pinned":true,"hidden":false,"mode":"ojs"},{"id":1545,"value":"separator(\"tomato\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1041,"value":"tripsByYear = d3\n .groups(trips, (d) => d[\"year\"])\n .sort((a, b) => a[0] - b[0])\n .map(([year, aObjs]) => {\n const peopleCount = aObjs.reduce(\n (acc, { countFirstPort }) => acc + countFirstPort,\n 0\n );\n const coordinates = [\n ...filterCoordinates(aObjs, \"coorStart\"),\n ...filterCoordinates(aObjs, \"coorPurchased\"),\n ...filterCoordinates(aObjs, \"coorFinal\")\n ];\n\n return {\n year,\n numTrips: aObjs.length,\n peopleCount,\n coordinates\n };\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1528,"value":"function filterCoordinates(trips, key) {\n let portType = \"start\";\n portType = key === \"coorPurchased\" ? \"purchased\" : portType;\n portType = key === \"coorFinal\" ? \"final\" : portType;\n\n const uniqCoors = [\n ...new Set(\n trips\n .map((e) => e[key] || null)\n .filter((e) => e && e[0] && e[1])\n .map((e) => e.join(\"_\"))\n )\n ].map((e) => e.split(\"_\"));\n\n return uniqCoors.map(([latitude, longitude]) => ({\n latitude,\n longitude,\n portType\n }));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":26,"value":"trips = cleanUp(data.trans)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1669,"value":"trips[123]","pinned":true,"hidden":false,"mode":"ojs"},{"id":1758,"value":"separator(\"hotpink\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1761,"value":"function genMapTripsPerYearPerPort(portKey) {\n return d3.group(\n trips,\n (d) => d.year,\n (d) => d[portKey]\n );\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1766,"value":"portNamesByType = ({\n portStart: [...new Set(trips.map((e) => e.portStart))],\n portPurchased: [...new Set(trips.map((e) => e.portPurchased))],\n portFinal: [...new Set(trips.map((e) => e.portFinal))]\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1785,"value":"years = d3.range(yearsRange[0], yearsRange[1] + 1)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2006,"value":"md`### This is to prepare my data for [Mike's bar chart race](https://observablehq.com/@d3/bar-chart-race)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1788,"value":"function prepareForRank(mapTrips, years, portNames) {\n const r = [];\n const accCounts = {};\n for (const y of years) {\n for (const p of portNames) {\n if (!accCounts[p]) accCounts[p] = 0;\n\n let yCount;\n if (!mapTrips.has(y)) yCount = 0;\n else if (!mapTrips.get(y).has(p)) yCount = 0;\n else yCount = mapTrips.get(y).get(p).length;\n\n r.push({\n date: new Date(y, 0),\n name: p,\n category: \"dummy\",\n value: yCount + accCounts[p]\n });\n\n accCounts[p] += yCount;\n }\n }\n return r;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1703,"value":"prepareForRank(\n genMapTripsPerYearPerPort(\"portFinal\"),\n years,\n portNamesByType.portFinal\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":22,"value":"function cleanUp(list) {\n return list\n .map((e) => {\n const o = {};\n Object.keys(e).forEach((k) => (o[cleanMapTrans[k.trim()]] = e[k]));\n o.year = +o.year;\n o.id = +o.id;\n o.id2 = +o.id2;\n o.countFirstPort = +o.countFirstPort;\n return o;\n })\n .filter(({ year }) => year !== 0)\n .filter(({ portStart }) => portStart.trim() !== \"\")\n .filter(({ portFinal }) => portFinal.trim() !== \"\");\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":35,"value":"cleanMapTrans = {\n return {\n \"Year of arrival at port of disembarkation\": \"year\",\n \"Voyage ID\": \"id\",\n \"Vessel name\": \"vesselName\",\n \"Voyage itinerary imputed port where began (ptdepimp) place\": \"portStart\",\n \"Voyage itinerary imputed principal place of slave purchase (mjbyptimp)\":\n \"portPurchased\",\n \"Voyage itinerary imputed principal port of slave disembarkation (mjslptimp) place\":\n \"portFinal\",\n VOYAGEID2: \"id2\",\n \"Captives arrived at 1st port\": \"countFirstPort\",\n \"Captain's name\": \"captainName\"\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":230,"value":"locations.map(({ original }) => original)","pinned":true,"hidden":false,"mode":"ojs"},{"id":10,"value":"data = {\n const data = await FileAttachment(\"intra.csv\").csv();\n const data2 = await FileAttachment(\"trans.csv\").csv();\n return {\n intra: data,\n trans: data2\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1358,"value":"separator = function (color = \"steelblue\") {\n return html`\n

`;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":158,"value":"locations = {\n const locs = await FileAttachment(\"locations@1.final.json\").json();\n return locs;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":425,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":1441,"value":"import {\n locations as testLocations,\n countries\n} from \"@drio/svg-map-pan-zoom-locations\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":1642,"value":"import { Scrubber } from \"@mbostock/scrubber\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}