Gist bea3b68601c5004145624bdb03eaa43e

100%

Gist bea3b68601c5004145624bdb03eaa43e

✓ Published0🌍 Public

Last edited Aug 31, 2019

Created on Aug 30, 2019

This example maps oceanographic CTD (conductivity, temperature, depth) sampling locations along the British Columbia coast and offshore Pacific. A GeoJSON MultiPoint dataset feeds a D3 map using `d3.geoPath` with a TopoJSON basemap for landmasses. Points cluster tightly near the continental shelf and along a repeating offshore grid, while a supplementary CSV (`proflocations.csv`) suggests profile station coordinates. The visualization shows the spatial distribution of oceanographic measurements, highlighting dense nearshore sampling versus broader offshore transects, rendered as a static point-layer over geographic context.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 69526c10c61369e9ebc7f2479ab96375

This example renders a choropleth map of British Columbia’s regional districts from a TopoJSON file, coloring each polygon by its `FEATURE_AREA_SQM` property. The visualization uses a custom `d3.geoPath` projection to draw district boundaries and a sequential color scale to encode area. Hover effects are implemented through a `transition.attrTween` that animates the fill color on selection, while a tooltip displays the district name and area. The map is composed using D3’s topology and geometry APIs, with the data sourced from the province’s legal boundary records.

MMbrownshoes

78% match

Loading thumbnail…

Gist e6fd5e60c1a06a14607e7c8cecae680f

This example maps the geographic distribution of oil and gas activity in British Columbia, showing well locations and facility sites as points over a basemap of the province. The visualization uses R’s `httr` library with `GET()` and `set_cookies()` to fetch a CSV dataset from the BC Oil and Gas Commission’s reporting portal, then renders the spatial data as a static plot. While the code does not specify a particular plotting package, the structure suggests base R graphics or a simple map layer, with coordinates derived directly from the parsed CSV content. It emphasizes raw data retrieval and immediate plotting without interactive elements.

MMbrownshoes

76% match

Loading thumbnail…

Gist 34bad0b124f4effdf99d5555cb3222d8

This example shows how spatial relationships between geographic features can be explored through an interactive map. It uses D3.js with `d3.geoPath` to render country outlines from a GeoJSON source, while a force-directed layout via `d3.forceSimulation` positions non-overlapping markers for data points. The visualization computes marker placement on a Canvas, reading pixel colors with `getImageData` to detect land versus water and ensure points remain on landmasses. Hover interactions trigger a tooltip and highlight neighboring regions, with smooth transitions handled by `transition.attrTween`. The data originates from a public GitHub gist and is embedded in a Power BI report, where the canvas is updated on each zoom or pan event.

HHugoberry

72% match

Loading thumbnail…

Gist fdfc88707da3d0b9b203

This example shows the clustering and connection of points on a map based on their geographic proximity and shared attributes. It uses a force-directed layout via `d3.forceSimulation` to position nodes while links are drawn as curved paths, with a base projection provided by `d3.geoPath` and `d3.geoMercator`. The data is loaded from an external CSV file, and the visualization updates dynamically as the simulation runs, highlighting node neighborhoods and their interconnections.

MMSCAU

72% match

Loading thumbnail…

Gist f18adc0d5e8f2f124288

This visualization combines a GeoJSON geometry collection with a thematic map overlay, using a base point at coordinates (152.5169, -29.8064) and multiple detailed polygon outlines. The polygons appear to trace irregular regions or clusters, likely representing geographic areas or boundaries, while the point marks a specific location. The rendering emphasizes spatial relationships and distributions through geometric shapes, suggesting a geospatial analysis or mapping of regional data.

DDylanFM

72% match

Loading thumbnail…

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.

CCliffordAnderson

71% match

Loading thumbnail…

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.

CCliffordAnderson

71% match

Loading thumbnail…

D3: Loading GeoJSON data and generating SVG paths

This example combines Canadian health data with geographic boundaries to create a choropleth map. It loads GeoJSON province outlines via `d3.json` and CSV health statistics via `d3.csv`, merging them by province name to color each region using a `d3.scale.quantize` color scale. The map uses a `d3.geo.conicConformal` projection and `d3.geo.path` for SVG rendering, with population circles from a third CSV overlaid using the same projection.

MMbrownshoes

70% match