Gist bdb4994137a7b0f75652f01bb4c170d2

Convert Messy Spreadsheet of Berlin Street Names to GeoJSON

This visualization converts a messy CSV file of Berlin street names into a GeoJSON FeatureCollection. The XQuery script uses `csv:parse` and `map:merge` to clean the data, expanding abbreviations like "dr" to "doctor" and normalizing gender fields. It then calls the Mapbox Geocoding API via `http:send-request` to retrieve geometry for each street address, bounded to Berlin’s coordinates. The resulting features are assembled with `array` and output as JSON, ready for mapping.

72% match

Gist 10676346

This map displays labeled points from a GeoJSON file, plotting locations like "Internet Archive," "China," and "New York" at their geographic coordinates. The visualization likely renders a large-scale point cloud, with overlapping labels suggesting a messy or aggregated dataset. Using a mapping library, likely D3.js with `d3.geoPath` for drawing map features and standard SVG or Canvas techniques for placing text labels, the code creates a simple geographical scatter plot. The rendering emphasizes the spatial distribution of these named places across the globe.

Stolpersteine in Berlin

A map of Berlin displays thousands of Stolpersteine memorial stones as individual points, each marking the last known residence of a Holocaust victim. The visualization uses D3.js with `d3.forceSimulation` to handle spatial collision detection, preventing markers from overlapping at dense locations while `d3.geoPath` renders the city’s street and district boundaries. Hovering a point reveals the person’s name, address, deportation date, and murder site from the embedded GeoJSON data, with a tooltip built from the properties fields. Points are colored by the deportation destination, such as Auschwitz or Theresienstadt, providing an immediate sense of historical scale across the city.

Gist 8603058

This example presents an interactive campus tour using GeoJSON point data, mapping two historic landmarks with descriptions and photo links. It renders the geographic points on a map using D3’s `d3.geoPath` and `d3.forceSimulation` to position labels or markers, while pulling tour info from the embedded feature properties. The visualization relies on the GeoJSON FeatureCollection structure and displays Wikipedia URLs and image thumbnails as part of each stop. Coordinate parsing and path generation are handled through standard D3 geo projections, making the tour spatially navigable.

Gist 9af806e8acc168aa10c06099d668b711

This example presents an interactive map of historical Berlin locations from 1947, using GeoJSON point features to mark sites like the Synagogue Fasanenstrasse and Charlottenburg Gate. Each marker opens a popup with period photographs and captions, rendered through a Mapbox-like interface. The visualization relies on a custom marker system with symbol and color properties, while the underlying tour.json data drives the geographic placement and content. The implementation uses standard web mapping libraries to handle GeoJSON rendering and marker interactions, showing how archival image collections can be geolocated and explored.

Gist 61957648a96af6b4167e

This example visualizes traffic crash records from a Gist file, mapping each participant’s location and attributes onto a canvas. It uses a force-directed layout with `d3.forceSimulation` to spatially arrange points, while `d3.geoPath` renders geographic features from the included geometry. The code reads the raw text data, parses fields like crash severity and participant details, and draws small circles colored by injury severity. It also employs Canvas `getImageData` for pixel-level rendering, and transitions with `transition.attrTween` to animate point movement. The result is an interactive scatterplot-style map of incident density and participant distribution.

CCaged

65% match

Gist c34929ea07077c99b9cb6e8326253b9e

This map-based visualization plots historical sites from a 1947 tour of Berlin, using a GeoJSON FeatureCollection to place markers with associated photographs and descriptions. The code relies on Leaflet for map rendering and marker display, with custom styling applied through marker properties like color and symbol. Each point opens a popup containing historical images from Wikimedia Commons, pairing wartime and contemporary photos to show how locations have changed. The tour data is organized by series and includes coordinates for landmarks such as the Technical University and Flakturm Tiergarten.

65% match

Gist 9bd5ca69fc039cff50383b3a3459858b

This example shows how to render a spatial distribution of data points on a map using D3.js. It uses `d3.geoPath` to draw geographic boundaries and `d3.forceSimulation` to position overlapping points, while Canvas `getImageData` is used to read pixel data for collision detection. The visualization reads from a PGP-encrypted text file, suggesting the underlying dataset is not directly accessible. The code relies on D3’s selection and transition APIs to animate point movements, and it appears to use a projection to convert latitude and longitude coordinates into screen positions. The result is an interactive scatterplot overlaid on a map, with points dynamically adjusting to avoid overlap.