2b:null 2c:["$","title",null,{"children":"Atlantic Slave Trade | David Chung | Observable"}] 31:T1391,world_map = { const context = DOM.context2d(width, height); const projection = d3.geoOrthographic() .fitExtent([[-31.704, 20.0323], [width + 1, height + 1]], sphere) .clipExtent([[-32.462024139822915,19.75371851411848], [width + 1, height + 1]]) .rotate([31.494068468354676,-3.99446170993627,-14.662784022154653]) .scale(312.3870800000001); const path = d3.geoPath(projection, context) .pointRadius(1.5); const extent = d3.extent(country_count_data, function (d) { return d.Count; }); const colorScale = d3.scaleLog() .domain(extent) .range(["grey", "black"]); const sourceScale = d3.scaleLog(d3.extent(sourceCounts, d => d.count), [1,10]); const destinationScale = d3.scaleLog(d3.extent(destCounts, d => d.count), [1,10]); const yearly_points = points_by_year.get(year); if (year === 1514) { mutable destinationCoordinates = new Map(); mutable sourceCoordinates = new Map(); } function render(event) { context.clearRect(0, 0, width, height); // Set text styling context.font = "48px Arial"; context.fillStyle = "black"; // Optional - sets text color // Draw the text context.fillText(year, 10, 50); // (Text content, X coordinate, Y coordinate) context.beginPath(); path(graticule); context.lineWidth = 0.5; context.strokeStyle = "#aaa"; context.stroke(); countries.features.forEach(feature => { const name = feature.properties.name; context.beginPath(); path(feature); const country_data = country_count_data.find(country => country.Source == name); if (country_data != null) { context.fillStyle = colorScale(country_data.Count); } else { context.fillStyle = "#ddd"; } context.strokeStyle = "#aaa"; context.fill(); context.stroke(); }); // voronoi.polygons().features.forEach(feature => { // const name = feature.properties.name; // context.beginPath(); // path(feature); // context.strokeStyle = "black"; // context.stroke(); // }); yearly_points.forEach(element => { if (element.source_coord != null && element.destination_coord != null) { let coords = []; if (element.path) { coords.push(element.source_coord); for (let i = 0; i < element.path.length; i++) { coords.push(centerCentroids[element.path[i]]); } coords.push(element.destination_coord); const lineString = { type: "LineString", coordinates: coords }; const bezierLine = turf.bezierSpline(lineString); context.beginPath(); path(bezierLine); context.strokeStyle = "black"; context.lineWidth = 1; context.stroke(); } } if (element.source_coord != null) { const sourceKey = element.source_coord.join(','); // Create a unique key for coordinates if (!sourceCoordinates.has(sourceKey)) { // Check if not drawn before context.beginPath(); path.pointRadius(1.5); path({type: "Point", coordinates: element.source_coord}); context.lineWidth = 100; context.fillStyle = "red"; context.fill(); } incrementCount(sourceKey, sourceCoordinates); } if (element.destination_coord != null) { const destinationKey = element.destination_coord.join(','); // Create a unique key for coordinates if (!destinationCoordinates.has(destinationKey)) { // Check if not drawn before context.beginPath(); path.pointRadius(1.5); path({type: "Point", coordinates: element.destination_coord}); context.lineWidth = 100; context.fillStyle = "teal"; context.fill(); } incrementCount(destinationKey, destinationCoordinates); } }); for (const coordinate of sourceCoordinates) { const coord = coordinate[0].split(','); context.beginPath(); path.pointRadius(sourceScale(coordinate[1])); path({type: "Point", coordinates: coord}); context.lineWidth = 100; context.fillStyle = "red"; context.fill(); } for (const coordinate of destinationCoordinates) { const coord = coordinate[0].split(','); context.beginPath(); path.pointRadius(destinationScale(coordinate[1])); path({type: "Point", coordinates: coord}); context.lineWidth = 100; context.fillStyle = "teal"; context.fill(); } path.pointRadius(1.5); context.beginPath(); path(sphere); context.lineWidth = 1.5; context.strokeStyle = "#000"; context.stroke(); } const map = d3.select(context.canvas) .call(zoom(projection).on("zoom.render", render)) .call(render); return map.node() }32:T7fa,a_star = function aStar(element, aStar_memo) { const cellData = {}; const source_cell = voronoi.find(element.source_coord[0], element.source_coord[1]); const destination_cell = voronoi.find(element.destination_coord[0], element.destination_coord[1]); const key = `${source_cell}-${destination_cell}`; if (key in aStar_memo) { return aStar_memo[key]; // Return memoized path } cellData[source_cell] = { g: 0, h: calculateHeuristic(source_cell, destination_cell), f: 0 }; let openList = new PriorityQueue((a, b) => cellData[a].f - cellData[b].f); let closedList = []; openList.enqueue(source_cell); // Initialize the priority queue while (!openList.isEmpty()) { const currentCellIndex = openList.dequeue(); // Efficiently get lowest 'f' node if (currentCellIndex === destination_cell) { const path = reconstructPath(cellData, destination_cell) aStar_memo[key] = path; // Store the path return path; } closedList.push(currentCellIndex); const neighbors = delaunay.neighbors[currentCellIndex]; for (const neighborIndex of neighbors) { if (closedList.includes(neighborIndex) || delaunay.polygons[neighborIndex] === undefined) continue; if (!cellData[neighborIndex]) { cellData[neighborIndex] = { g: Infinity }; } const tentativeG = cellData[currentCellIndex].g + calculateDistance(currentCellIndex, neighborIndex); if (tentativeG < cellData[neighborIndex].g) { cellData[neighborIndex].parent = currentCellIndex; cellData[neighborIndex].g = tentativeG; cellData[neighborIndex].h = calculateHeuristic(neighborIndex, destination_cell); cellData[neighborIndex].f = cellData[neighborIndex].g + cellData[neighborIndex].h; openList.enqueue(neighborIndex); } } } return null; // Path not found }33:T6d4,class PriorityQueue { constructor(comparator = (a, b) => a - b) { // Default: min-heap priority this._heap = []; this._comparator = comparator; } size() { return this._heap.length; } isEmpty() { return this.size() === 0; } peek() { return this._heap[0]; } enqueue(value) { this._heap.push(value); this._siftUp(); } dequeue() { const poppedValue = this.peek(); const bottom = this.size() - 1; if (bottom > 0) { this._swap(0, bottom); } this._heap.pop(); this._siftDown(); return poppedValue; } toArray() { return [...this._heap]; // Create a shallow copy of the heap } _parent(i) { return ((i + 1) >>> 1) - 1; // Bitwise for faster calculation } _children(i) { return [(i << 1) + 1, (i << 1) + 2].filter(index => index < this.size()); } _swap(i, j) { [this._heap[i], this._heap[j]] = [this._heap[j], this._heap[i]]; } _compare(i, j) { return this._comparator(this._heap[i], this._heap[j]); } _siftUp() { let node = this.size() - 1; while (node > 0 && this._compare(node, this._parent(node)) < 0) { this._swap(node, this._parent(node)); node = this._parent(node); } } _siftDown() { let node = 0; while ( (this._children(node)[0] < this.size() && this._compare(this._children(node)[0], node) < 0) || (this._children(node)[1] < this.size() && this._compare(this._children(node)[1], node) < 0) ) { let maxChild = (this._children(node)[1] < this.size() && this._compare(this._children(node)[1], this._children(node)[0]) < 0) ? 1 : 0; this._swap(node, this._children(node)[maxChild]); node = this._children(node)[maxChild]; } } }34:Ta05,class QuadTreeNode { constructor(bounds, capacity) { this.bounds = bounds; this.capacity = capacity; this.objects = []; this.divided = false; this.topLeft = null; this.topRight = null; this.bottomLeft = null; this.bottomRight = null; } // Subdivide the node into four quadrants subdivide() { const halfWidth = this.bounds.width / 2; const halfHeight = this.bounds.height / 2; const x = this.bounds.x; const y = this.bounds.y; this.topLeft = new QuadTreeNode( new BoundingBox(x, y, halfWidth, halfHeight), this.capacity ); this.topRight = new QuadTreeNode( new BoundingBox(x + halfWidth, y, halfWidth, halfHeight), this.capacity ); this.bottomLeft = new QuadTreeNode( new BoundingBox(x, y + halfHeight, halfWidth, halfHeight), this.capacity ); this.bottomRight = new QuadTreeNode( new BoundingBox(x + halfWidth, y + halfHeight, halfWidth, halfHeight), this.capacity ); this.divided = true; const tempObjects = structuredClone(this.objects); // Create a copy for (const object of tempObjects) { this.insert(object); } for (const object of this.objects) { object.isActive = false; } } // Insert an object with a bounding box insert(object) { if (!this.bounds.intersects(object)) { return false; // Object is completely outside this node's bounds } if (this.objects.length < this.capacity && !this.divided) { this.objects.push(object); return true; } if (!this.divided) { this.subdivide(); } return this.topLeft.insert(object) || this.topRight.insert(object) || this.bottomLeft.insert(object) || this.bottomRight.insert(object); } // Query for objects within a bounding box query(queryBounds) { let results = []; if (!this.bounds.intersects(queryBounds)) { return results; // No intersection } // Check objects stored directly in this node for (const object of this.objects) { if (object.isActive && queryBounds.intersects(object)) { results.push(object); } } // Recurse to child nodes if divided if (this.divided) { results = results.concat(this.topLeft.query(queryBounds)); results = results.concat(this.topRight.query(queryBounds)); results = results.concat(this.bottomLeft.query(queryBounds)); results = results.concat(this.bottomRight.query(queryBounds)); } return results; } }35:T4b8,grid_test = { // const cellSize = 1; // Size of each cell // // Is this enclosed properly? // const ctx = DOM.context2d(900, 450); // function drawGrid(grid) { // const scaleFactor = 0.25; // Our calculated scaling factor // const newWidth = 900; // const newHeight = 450; // for (let row = 0; row < newHeight; row++) { // for (let col = 0; col < newWidth; col++) { // // Calculate the corresponding cell in the original grid // const originalRow = Math.floor(row / scaleFactor); // const originalCol = Math.floor(col / scaleFactor); // const cellValue = grid[originalRow][originalCol]; // // ... Your existing rendering logic ... // ctx.fillStyle = getColorForValue(cellValue); // ctx.fillRect(col * cellSize, newHeight - row * cellSize - cellSize, cellSize, cellSize); // } // } // } // function getColorForValue(value) { // // Logic to map values to colors // switch(value) { // case 0: return 'white'; // case 1: return 'blue'; // // ... other cases // default: return 'gray'; // } // } // drawGrid(grid); // return d3.select(ctx.canvas).node(); }36:Tb6c,mygrid = { // const xmin = -180; // const xmax = 180; // const ymin = -90; // const ymax = 90; // const gridResolution = 0.1; // Only 1 Degree due to size constraint. // const rows = Math.ceil((ymax - ymin) / gridResolution); // const cols = Math.ceil((xmax - xmin) / gridResolution); // const grid = new Array(rows).fill(null).map(() => new Array(cols).fill(0)); // for (let a = 0; a < countries_vert.length; a++) { // const polygon = structuredClone(countries_vert[a]); // let polygons = []; // let tempPolygon = []; // for (let c = 0; c < polygon.length; c++) { // tempPolygon.push(polygon[c]); // if (polygon[c].end) { // Assuming your 'end' property signifies the end of a sub-polygon // polygons.push(tempPolygon); // tempPolygon = []; // Clear the temporary polygon for the next one // } // } // // Handle the last sub-polygon (if it doesn't end with an '.end' object) // if (tempPolygon.length > 0) { // polygons.push(tempPolygon); // } // // Mark cells intersected by edges // for (let p = 0; p < polygons.length; p++) { // for (let i = 0; i < polygons[p].length; i++) { // const start = polygons[p][i]; // const end = polygons[p][(i + 1) % polygons[p].length]; // markCellsIntersectedByLine(grid, gridResolution, start, end, xmin, ymin); // } // } // } // const lined_grid = removeRandomLines(grid); // for (let i = 0; i < 4; i++) { // for (let r = 0; r < lined_grid.length - 1; r++) { // for (let c = 0; c < lined_grid[r].length - 1; c++) { // // Calculate non-integer coordinates for interpolation // let interpolatedRow = r + 0.5; // Example: Interpolate halfway between rows // let interpolatedCol = c + 0.5; // Example: Interpolate halfway between columns // // Perform the interpolation // let interpolatedValue = bilinearInterpolation(lined_grid, interpolatedRow, interpolatedCol); // lined_grid[r][c] = interpolatedValue > 0 ? 1 : 0; // } // } // } // // Go through centroid and floodFill if not already filled. // countries.features.forEach(function(d,i) { // if (countries.features[i].area > 600000) { // const d = countries_centroids.features.find(function(e){ // return e.properties.COUNTRY === countries.features[i].properties.name; // }); // if (d === undefined) { return; } // const coords = d.geometry.coordinates; // const convertedRowCols = convertLongLatToGrid(coords[0], coords[1], -180, 180, -90, 90, rows, cols); // floodFill(lined_grid, convertedRowCols.row, convertedRowCols.col, 0, 1); // } // }); // return lined_grid; }37:T515,function floodFill(grid, row, col, targetValue, replacementValue) { if (row < 0 || row >= grid.length || col < 0 || col >= grid[0].length) { return; } if (grid[row][col] !== targetValue) { return; } const stack = [{ row, col, depth: 0 }]; const visited = new Set(); // Introduce visited set const maxDepth = 99999; while (stack.length > 0) { const { row, col, depth } = stack.pop(); const key = `${row},${col}`; // Create unique key for visited set if (visited.has(key)) { continue; // Skip if the cell is already visited } if (depth > maxDepth) { continue; // Skip if exceeding the depth limit } visited.add(key); grid[row][col] = replacementValue; // 5. Explore Neighbors (4-way) if (row - 1 >= 0 && grid[row - 1][col] === targetValue) { stack.push({ row: row - 1, col, depth: depth + 1 }); } if (row + 1 < grid.length && grid[row + 1][col] === targetValue) { stack.push({ row: row + 1, col, depth: depth + 1 }); } if (col - 1 >= 0 && grid[row][col - 1] === targetValue) { stack.push({ row, col: col - 1, depth: depth + 1 }); } if (col + 1 < grid[0].length && grid[row][col + 1] === targetValue) { stack.push({ row, col: col + 1, depth: depth + 1 }); } } }38:T547,function bilinearInterpolation(array, row, col) { // Ensure the interpolation point is within array bounds if (row < 0 || row >= array.length || col < 0 || col >= array[0].length) { throw new Error("Point is outside the array bounds."); } // Obtain integer coordinates surrounding the interpolation point const rowFloor = Math.floor(row); const rowCeil = Math.ceil(row); const colFloor = Math.floor(col); const colCeil = Math.ceil(col); // Handle edge cases if surrounding pixels are out of bounds const topLeft = array[Math.max(0, rowFloor)][Math.max(0, colFloor)]; const topRight = array[Math.max(0, rowFloor)][Math.min(array[0].length - 1, colCeil)]; const bottomLeft = array[Math.min(array.length - 1, rowCeil)][Math.max(0, colFloor)]; const bottomRight = array[Math.min(array.length - 1, rowCeil)][Math.min(array[0].length - 1, colCeil)]; // Calculate interpolation weights const rowWeight = row - rowFloor; const colWeight = col - colFloor; // Perform the bilinear interpolation calculation const interpolatedValue = (1 - rowWeight) * (1 - colWeight) * topLeft + (1 - rowWeight) * colWeight * topRight + rowWeight * (1 - colWeight) * bottomLeft + rowWeight * colWeight * bottomRight; return interpolatedValue; } 39:T41c,function markCellsIntersectedByLine(grid, gridResolution, start, end, xmin, ymin) { const scalingFactor = 50000; // Scale and round coordinates let scaledStartX = Math.round(scalingFactor * start[0]); let scaledStartY = Math.round(scalingFactor * start[1]); let scaledEndX = Math.round(scalingFactor * end[0]); let scaledEndY = Math.round(scalingFactor * end[1]); const dx = Math.abs(scaledEndX - scaledStartX); const dy = Math.abs(scaledEndY - scaledStartY); const sx = scaledStartX < scaledEndX ? 1 : -1; const sy = scaledStartY < scaledEndY ? 1 : -1; let err = dx - dy; while (true) { const cellX = Math.floor((scaledStartX / scalingFactor - xmin) / gridResolution + 0.5); const cellY = Math.floor((scaledStartY / scalingFactor - ymin) / gridResolution + 0.5); grid[cellY][cellX] = 1; if (scaledStartX === scaledEndX && scaledStartY === scaledEndY) break; const e2 = 2 * err; if (e2 >= -dy) { err -= dy; scaledStartX += sx; } if (e2 <= dx) { err += dx; scaledStartY += sy; } } }3a:T4b6,points = cleaned_routes.map(function(d,i) { let indexSource = locations1Final.findIndex(function(d) { return d.original == cleaned_routes[i].Source; }); let indexDestination = locations1Final.findIndex(function(d) { return d.original == cleaned_routes[i].Destination; }); // if (indexSource == -1) { // const missing_val = missing_indexes.find(function(e) { // return e[d.Source] !== undefined; // }); // indexSource = locations1Final.findIndex(function(e) { // return e.original == missing_val[d.Source]; // }); // } // if (indexDestination == -1 && d.Destination != '???') { // const missing_val = missing_indexes.find(function(e) { // return e[d.Destination] !== undefined; // }); // indexDestination = locations1Final.findIndex(function(e) { // return e.original == missing_val[d.Destination]; // }); // } if (indexSource != -1) { d.source_coord = locations1Final[indexSource].coordinates } if (indexDestination != -1) { d.destination_coord = locations1Final[indexDestination].coordinates } return d; });3b:[{"id":"f4afb2d49f0b38843f6d74521b33d41f371246e1acd674ed78016dca816cb1d262b7c54b95d395a4dad7fba5d58ed19db2944698360d19483399c79565806794","href":"https://static.observableusercontent.com/files/f4afb2d49f0b38843f6d74521b33d41f371246e1acd674ed78016dca816cb1d262b7c54b95d395a4dad7fba5d58ed19db2944698360d19483399c79565806794","name":"countries-50m.json","type":"application/json","lastModified":1708715664098.503,"size":756420},{"id":"b07bd36e4205cb6df09394795c8176275f1e6efed8162d7a26dc8590836e8e6125a1bea4d03f59c6694db4e24863d5b8b028e0e7640bc63121d37e2865c6e69f","href":"https://static.observableusercontent.com/files/b07bd36e4205cb6df09394795c8176275f1e6efed8162d7a26dc8590836e8e6125a1bea4d03f59c6694db4e24863d5b8b028e0e7640bc63121d37e2865c6e69f","name":"countries_centroids.geojson","type":"application/geo+json","lastModified":1709044173916.686,"size":47103},{"id":"88c7319e70fd6af7ed36dff96f6e39837ef2a3f1733770008554268221238bef718ddbb07045a3e2b7a531f96d89877b7468facbaaf1aaee63b3a98b67b9cfbe","href":"https://static.observableusercontent.com/files/88c7319e70fd6af7ed36dff96f6e39837ef2a3f1733770008554268221238bef718ddbb07045a3e2b7a531f96d89877b7468facbaaf1aaee63b3a98b67b9cfbe","name":"land-50m.json","type":"application/json","lastModified":1708999348221.191,"size":545534},{"id":"c9873930d7c7fc8579001bf728e66914c26ae4f5afa2df3a3c2dd90d2789c9cacce548d8cb30119d088cc1215496d345c0d76784a6b3a8be877743b55a879d74","href":"https://static.observableusercontent.com/files/c9873930d7c7fc8579001bf728e66914c26ae4f5afa2df3a3c2dd90d2789c9cacce548d8cb30119d088cc1215496d345c0d76784a6b3a8be877743b55a879d74","name":"myGrid.json","type":"application/json","lastModified":1709068532197.128,"size":12963611},{"id":"bd04c57390097ced6784ff27a3b4676a766a1317445a2229a57e76ea63402d64bfb5bafd94c7fad46415ab373c3b929fdaf402cc0dfb69350389f6972d66900d","href":"https://static.observableusercontent.com/files/bd04c57390097ced6784ff27a3b4676a766a1317445a2229a57e76ea63402d64bfb5bafd94c7fad46415ab373c3b929fdaf402cc0dfb69350389f6972d66900d","name":"data.json","type":"application/json","lastModified":1709071526129.494,"size":812574},{"id":"cf0aa819cd95702d310be4949802ad0fd616d84e80aad7ce609d05695a322312689183f25a7ba7135592477bb5e9701776c2ef1e1a245eac36bf0adce23986d5","href":"https://static.observableusercontent.com/files/cf0aa819cd95702d310be4949802ad0fd616d84e80aad7ce609d05695a322312689183f25a7ba7135592477bb5e9701776c2ef1e1a245eac36bf0adce23986d5","name":"data@1.json","type":"application/json","lastModified":1709079347795.071,"size":9718689},{"id":"4eec02f42bcc9bbbbc8a1f97ee8636010a250882392ecb0672e557cdc5548ee83b0a6bca8f29fc08aef60431183fc6d11accc8e79a92a22f44854007feb83ff3","href":"https://static.observableusercontent.com/files/4eec02f42bcc9bbbbc8a1f97ee8636010a250882392ecb0672e557cdc5548ee83b0a6bca8f29fc08aef60431183fc6d11accc8e79a92a22f44854007feb83ff3","name":"locations-1.final.json","type":"application/json","lastModified":1708435412426.903,"size":1130777},{"id":"00d1769b69719e2ba45cce72c3a512c8fce61616d3ae469b6afa51e6221599bc38231a374c1574052459a1ac4bdc6c1554c18761c428db762cc3a31772840583","href":"https://static.observableusercontent.com/files/00d1769b69719e2ba45cce72c3a512c8fce61616d3ae469b6afa51e6221599bc38231a374c1574052459a1ac4bdc6c1554c18761c428db762cc3a31772840583","name":"country_data@1.csv","type":"text/csv","lastModified":1708471215607.466,"size":35596},{"id":"fce0ef927759344e6361a49fbbd00c99124f171d43a077cd355a95105bf0d53c992598ed105cef828a90c035e6e04e69d524c67005141d2eff994eabe5a80122","href":"https://static.observableusercontent.com/files/fce0ef927759344e6361a49fbbd00c99124f171d43a077cd355a95105bf0d53c992598ed105cef828a90c035e6e04e69d524c67005141d2eff994eabe5a80122","name":"country_count_data-5.csv","type":"text/csv","lastModified":1708556123943.092,"size":1498},{"id":"b38f8def540b1d07ec060d9bdf8fd7540ad6d0cc4d65a2950bdf05b9133fa2c47cdb041775ace629957b44484cb772b668f6dd21d2c0e49712e2f3691b97218a","href":"https://static.observableusercontent.com/files/b38f8def540b1d07ec060d9bdf8fd7540ad6d0cc4d65a2950bdf05b9133fa2c47cdb041775ace629957b44484cb772b668f6dd21d2c0e49712e2f3691b97218a","name":"cleaned_routes.csv","type":"text/csv","lastModified":1708616218770.941,"size":1095844}] 2f:{"id":"bb017ff2bbb6b509","slug":null,"title":"Atlantic Slave Trade","thumbnail":"5cfcc107377b545a98d653ceecde2e5952697ae9d5242b966a08e2c6683ab9f2","access_level":"public","create_time":"$D2024-02-16T16:22:43.645Z","update_time":"$D2024-03-01T13:04:48.303Z","view_time":null,"first_public_time":"$D2024-02-16T16:22:43.645Z","has_unpublished_edits":null,"fork":{"id":"24aa1d51ca1b7b9d","slug":"testing-projection-visibility","title":"Testing projection visibility","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":0,"starred":false,"owner":{"type":"team","id":"c6c194ae539fe1b6","login":"davidmchung123","name":"David Chung","avatar_url":"https://avatars-next.observableusercontent.com/7a790a48b01de24d496bc40861e79d0fa2453f577c980a3b466fff235ddb1361","tier":"starter_2024"},"version":2306,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"9d2e4251d43434ca","login":"davidmchung123","name":"David Chung","avatar_url":"https://avatars-next.observableusercontent.com/7a790a48b01de24d496bc40861e79d0fa2453f577c980a3b466fff235ddb1361","tier":null}],"members":[{"type":"individual","id":"9d2e4251d43434ca","login":"davidmchung123","name":"David Chung","avatar_url":"https://avatars-next.observableusercontent.com/7a790a48b01de24d496bc40861e79d0fa2453f577c980a3b466fff235ddb1361","tier":null,"role":"editor"},{"type":"team","id":"c6c194ae539fe1b6","login":"davidmchung123","name":"David Chung","avatar_url":"https://avatars-next.observableusercontent.com/7a790a48b01de24d496bc40861e79d0fa2453f577c980a3b466fff235ddb1361","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Atlantic Slave Trade","cells":[{"id":0,"value":"# Atlantic Slave Trade\n## Week 4 Data Visualization Challenge Dubois.\n#### This challenge asks to recreate a visualization by Dubois that talks about the Georgia Negro. In the visualization it talks about the distribution of the Negro Race. These ideas are based on a phrenology a pseudoscience. So instead for this week. I'd like to recreate it differently. I'm using a fork of the Testing Projection Visibility as my base. Instead of a Choropleth with two different worlds. We'll have a singular one. Representing the human race as a whole.\n\n##### Data Source: ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":366,"value":"viewof year = Scrubber([...points_by_year.keys()], {\n delay: 200,\n loopDelay: 1000,\n autoplay: false,\n}) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1834,"value":"function incrementCount(key, map) {\n if (map.has(key)) {\n map.set(key, map.get(key) + 1);\n } else {\n map.set(key, 1);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1653,"value":"mutable destinationCoordinates = new Map();","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1650,"value":"mutable sourceCoordinates = new Map();","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"width = height","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":175,"value":"height = 800","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"sphere = ({type: \"Sphere\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"graticule = d3.geoGraticule10()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":359,"value":"points_by_year = {\n const points_group = d3.group(stuff, d => d.Arrival)\n const sortedEntries = Array.from(points_group.entries())\n .sort((a, b) => {\n // Assuming 'Arrival' values can be compared directly (e.g., numbers or dates)\n return a[0] - b[0]; \n });\n\n return new Map(sortedEntries); \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1803,"value":"stuff = FileAttachment(\"data@1.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":522,"value":"d = {\n const aStar_memo = {}\n\n // // Run through unique points and then use memoized paths to set remaining points.\n // for (let i = 0; i < 100; i++) { \n // const element = uniquePairs[i];\n // if (element.source_coord != null && element.destination_coord != null) {\n // const path = a_star(element, aStar_memo);\n // }\n // if (i % 10 == 0) {\n // console.log(i); // Takes about 8 minutes to run.\n // }\n // }\n\n // for (let i = 0; i < 100; i++) {\n // const element = points[i];\n // if (element.source_coord != null && element.destination_coord != null) {\n // const path = a_star(element, aStar_memo);\n // element.path = path\n // }\n // if (i % 20 == 0) {\n // console.log(i); // Takes about 8 minutes to run.\n // }\n // }\n\n return points;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1665,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":667,"value":"function calculateHeuristic(cell1, cell2) {\n const distanceToGoal = calculateDistance(cell1, cell2); \n const landFeaturePenalty = isPointInLand(cell1) ? 1000 : 0; // Adjust penalty as needed\n return distanceToGoal + landFeaturePenalty; \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":665,"value":"function calculateDistance(cell1, cell2) { \n // Example: Manhattan Distance \n const centroidCell1 = centerCentroids[cell1];\n const centroidCell2 = centerCentroids[cell2];\n if (centroidCell1 === undefined|| centroidCell2 === undefined) {\n return Infinity; // This should make it so undefined centroid are never used.\n }\n return Math.abs(centroidCell1[0] - centroidCell2[0]) + Math.abs(centroidCell1[1] - centroidCell2[1]); \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1768,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1005,"value":"function isPointInLand(cell) { \n const centroid = centerCentroids[cell];\n const point = new BoundingBox(centroid[0], centroid[1], 1, 1);\n const query = quadTree.query(point);\n \n for (let i = 0; i< query.length; i++) {\n const bb = query[i];\n const polygon = bb.polygon;\n const turfPoint = turf.point(centroid);\n\n let turfPg;\n if (polygon[0].type === 'MultiPolygon') {\n const multiPolygon = splitArrayOnEndObjects(polygon);\n turfPg = turf.multiPolygon(multiPolygon);\n } else {\n const poly = [polygon];\n turfPg = turf.polygon(poly);\n }\n \n if (turf.booleanPointInPolygon(turfPoint, turfPg)) {\n return true;\n }\n }\n\n return false;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1992,"value":"function splitArrayOnEndObjects(arr) {\n const resultArrays = [];\n let currentArray = [];\n\n for (const element of arr) {\n if (element.end) { // Check for the 'end' object\n currentArray.push(element); // Add the 'end' object itself \n resultArrays.push(currentArray); \n currentArray = []; // Reset for the next array\n } else {\n currentArray.push(element);\n }\n }\n\n // If the last segment didn't have an 'end' object\n if (currentArray.length > 0) { \n resultArrays.push(currentArray);\n }\n\n return resultArrays;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1870,"value":"quadTree = {\n const tree = new QuadTreeNode(new BoundingBox(-180, -90, 360, 180), 4);\n countries_vertices.forEach(function(d,i) {\n const boundingBox = getBoundingBox(d);\n boundingBox.polygon = d;\n tree.insert(boundingBox);\n });\n \n return tree;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1868,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1880,"value":"function getBoundingBox(points) {\n let minX = Infinity;\n let maxX = -Infinity;\n let minY = Infinity;\n let maxY = -Infinity;\n\n for (const point of points) {\n minX = Math.min(minX, point[0]);\n maxX = Math.max(maxX, point[0]);\n minY = Math.min(minY, point[1]);\n maxY = Math.max(maxY, point[1]);\n }\n\n return new BoundingBox(minX, minY, maxX - minX, maxY - minY);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1866,"value":"class BoundingBox {\n constructor(x, y, width, height, polygon) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n this.polygon = polygon;\n this.isActive = true;\n }\n\n // Check if this bounding box intersects another\n intersects(other) {\n return (this.x < other.x + other.width &&\n this.x + this.width > other.x &&\n this.y < other.y + other.height && \n this.y + this.height > other.y);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1601,"value":"function latLongToGrid(long,lat) {\n const scaleFactorX = grid[0].length / 360; // Assumes longitude spans -180 to 180 degrees\n const scaleFactorY = grid.length / 180; // Assumes latitude spans -90 to 90 degrees\n const col = Math.floor((long + 180) * scaleFactorX);\n const row = Math.floor((lat + 90) * scaleFactorY);\n\n return { row, col };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1281,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1729,"value":"grid = FileAttachment(\"myGrid.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1190,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1471,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1520,"value":"function convertLongLatToGrid(longitude, latitude, gridMinLong, gridMaxLong, gridMinLat, gridMaxLat, numRows, numCols) {\n const row = Math.floor((latitude - gridMinLat) / (gridMaxLat - gridMinLat) * numRows);\n const col = Math.floor((longitude - gridMinLong) / (gridMaxLong - gridMinLong) * numCols);\n\n return { row: row, col: col };\n} ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1475,"value":"function removeRandomLines(array) {\n for (let row = 0; row < array.length; row++) {\n for (let col = 0; col < array[0].length; col++) {\n // Check for horizontal lines\n if (checkHorizontalLine(array, row, col)) {\n removeLine(array, row, col, 'horizontal'); // Modify or filter \n }\n }\n }\n return array; // Or return a new filtered array\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1483,"value":"function removeLine(array, row, col, direction) {\n const replacementValue = 0; // Or any placeholder suitable for your data\n for (let i = col; i < array[0].length && array[row][i] === array[row][col]; i++) {\n array[row][i] = replacementValue;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1477,"value":"function checkHorizontalLine(array, row, col) {\n const baseValue = array[row][col];\n let lineLength = 1;\n\n // Extend the line check to the right\n for (let i = col + 1; i < array[0].length; i++) {\n if (array[row][i] === baseValue) {\n lineLength++;\n } else {\n break; // Line ends\n } \n }\n\n return lineLength >= 50; // Adjust the minimum line length as needed \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1440,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1195,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":706,"value":"centerCentroids = {\n let cellCentroids = []; \n for (let i = 0; i < delaunay.polygons.length; i++) {\n cellCentroids.push(calculateCentroid(i)); \n }\n return cellCentroids;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":693,"value":"function calculateCentroid(cell) {\n // Approximating the centroid.\n let centroid = [0,0];\n const source_arr = delaunay.polygons[cell];\n if (source_arr == undefined) { return undefined; }\n for (let i = 0; i < source_arr.length; i++) {\n const index = source_arr[i];\n const point = delaunay.centers[index];\n centroid[0] += point[0];\n centroid[1] += point[1];\n }\n \n centroid[0] = centroid[0] / source_arr.length;\n centroid[1] = centroid[1] / source_arr.length;\n\n return centroid;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":661,"value":"function reconstructPath(cellData, destinationCell) {\n const path = [destinationCell];\n let currentCell = destinationCell;\n\n while (cellData[currentCell].parent) { \n currentCell = cellData[currentCell].parent;\n path.unshift(currentCell); \n }\n\n return path;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":614,"value":"delaunay = voronoi.delaunay","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":514,"value":"voronoi = d3.geoVoronoi(countries_vert.flat())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1515,"value":"countries_centroids = FileAttachment(\"countries_centroids.geojson\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":509,"value":"countries_vert = land.features.map(d => {\n let v = geoVertices(d);\n let firstValue = v[0]; // Store the initial first value\n let update = false;\n \n return v.map(function(element) {\n if (element[0] === undefined) {\n element = firstValue.slice(); // Replace with copy of the first value\n element.end = true;\n update = true;\n } else if (update) {\n firstValue = element;\n update =false;\n }\n element.id = d.properties.name;\n return element;\n });\n});\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1876,"value":"countries_vertices = countries.features.map(d => {\n let v = geoVertices(d);\n let firstValue = v[0]; // Store the initial first value\n let update = false;\n \n return v.map(function(element) {\n if (element[0] === undefined) {\n element = firstValue.slice(); // Replace with copy of the first value\n element.end = true;\n update = true;\n } else if (update) {\n firstValue = element;\n update =false;\n }\n element.id = d.properties.name;\n element.type = d.geometry.type;\n return element;\n });\n});\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1535,"value":"countries.features.map(function(d,i) {\n d.area = Math.round(Math.sqrt(turf.area(d)));\n return d;\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":272,"value":"countries = Object.keys(countries50m.objects).map(key =>\n topojson.feature(countries50m, countries50m.objects[key])\n)[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1352,"value":"land = Object.keys(land50m.objects).map(key =>\n topojson.feature(land50m, land50m.objects[key])\n)[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1351,"value":"land50m = FileAttachment(\"land-50m.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":498,"value":"countries50m = FileAttachment(\"countries-50m.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1809,"value":"destCounts = {\n const destCounts = {};\n for (const point of points) {\n const destName = point.Destination;\n \n // Increment count for the source\n if (destCounts[destName]) {\n destCounts[destName]++;\n } else {\n destCounts[destName] = 1;\n }\n }\n const resultArray = [];\n for (const destName in destCounts) {\n resultArray.push({ name: destName, count: destCounts[destName] });\n }\n return resultArray;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1807,"value":"sourceCounts = {\n const sourceCounts = {};\n for (const point of points) {\n const sourceName = point.Source;\n \n // Increment count for the source\n if (sourceCounts[sourceName]) {\n sourceCounts[sourceName]++;\n } else {\n sourceCounts[sourceName] = 1;\n }\n }\n const resultArray = [];\n for (const sourceName in sourceCounts) {\n resultArray.push({ name: sourceName, count: sourceCounts[sourceName] });\n }\n return resultArray;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1760,"value":"uniquePairs = findUniquePairs(points);\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1758,"value":"function findUniquePairs(points) {\n const uniquePairs = new Map(); // Use a Map to preserve object references\n\n for (const point of points) {\n const source = point.Source;\n const destination = point.Destination;\n\n const orderedPair = source < destination ? [source, destination] : [destination, source];\n const key = orderedPair.join(',');\n\n if (!uniquePairs.has(key)) {\n uniquePairs.set(key, point); // Store the original point object\n }\n }\n\n return Array.from(uniquePairs.values()); // Array of unique point objects \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":324,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"missing_indexes = {\n \n let set = new Set();\n\n for (let i = 0; i < cleaned_routes.length; i++) {\n let indexSource = locations1Final.findIndex(function(d) {\n return d.original == cleaned_routes[i].Source;\n });\n \n let indexDestination = locations1Final.findIndex(function(d) {\n return d.original == cleaned_routes[i].Destination;\n }); \n \n // This seems to work mostly on it's on. Let's check.\n if (indexSource == -1) {\n set.add(cleaned_routes[i].Source);\n }\n\n if (indexDestination == -1) {\n // console.log(cleaned_routes[i]); \n set.add(cleaned_routes[i].Destination);\n }\n }\n \n let missing_values = [];\n set = Array.from(set);\n for (let i = 0; i < set.length; i++) {\n let obj = {};\n obj[set[i]] = other[i]\n missing_values.push(obj);\n }\n return missing_values;\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":310,"value":"country_count_data = await FileAttachment(\"country_count_data-5.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"country_count_data","database":"$undefined"},{"id":234,"value":"country_data = await FileAttachment(\"country_data@1.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"country_data","database":"$undefined"},{"id":323,"value":"cleaned_routes = await FileAttachment(\"cleaned_routes.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"cleaned_routes","database":"$undefined"},{"id":7,"value":"import {zoom} from \"@d3/versor-zooming\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":388,"value":"other = [\"Africa\", \"Lagos\", \"Gorée\", \"São Tomé\", \"Lourenço Marques\", \"Novo Redondo\", \"Benin\", \"Bance/Bunce Island\", \"São Tomé or Princes Island\", \"Oerê\", \"Côte de Malaguette (runs through to Cape Palmas on Windward Coast)\", \"Gold Coast\", \"Joal\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":169,"value":"locations1Final = FileAttachment(\"locations-1.final.json\").json() // Taken from here. https://observablehq.com/@drio/slave-voyages","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":507,"value":"geoVertices = function(feature) {\n const vertices = [];\n let starting_vertex = null; \n const stream = {\n point: function(lambda, phi) {\n vertices.push([lambda, phi]);\n },\n lineStart: function() {},\n lineEnd: function() {},\n polygonStart: function(d,i) {},\n polygonEnd: function(lambda, phi) {\n const type = feature.geometry.type;\n vertices.push([lambda, phi]);\n }\n };\n d3.geoStream(feature, stream);\n return vertices;\n} // https://observablehq.com/@fil/shoreline-voronoi?collection=@fil/d3-geo-voronoi","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":368,"value":"import {Scrubber} from \"@mbostock/scrubber\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1533,"value":"turf = require(\"@turf/turf\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1721,"value":"import {zip, zipreader} from \"@fil/jszip\"\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":454,"value":"d3 = require(\"d3\", \"d3-geo-voronoi\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3b","stdlib":"1","titling":"auto"}} 30:"$2f:body"