neighborhood mongo

100%

neighborhood mongo

✓ Published0🌍 Public

Last edited Aug 31, 2011

Created on Aug 31, 2011

Neighborhood mongo maps Portland neighborhood polygons stored as GeoJSON in MongoDB, rendered on a zoomable, panning map. Each polygon is drawn as an SVG path using a geographic projection, with neighborhood boundaries overlaid on muted base tiles. Hovering highlights a district and reveals its name, while the geo-coordinates in the data drive the shape and position of each region. The visualization demonstrates how spatial querying and rendering of GeoJSON features can be handled directly from a MongoDB document store.

AI-generated description

Similar vizzes

Loading thumbnail…

Portland parks

The visualization displays the geographic boundaries of parks throughout Portland, Oregon, using a TopoJSON file that encodes each park as a polygon or multipolygon. It renders these shapes on a map-like canvas, showing the distribution and relative sizes of green spaces across the city. The implementation uses D3’s `d3.geoPath` to project and draw the topology, with the data sourced from a gist by Caged. The scene relies on D3’s geographic projection and path generation to convert the TopoJSON arcs into visible, filled polygons.

CCaged

72% match

Loading thumbnail…

Portland blockgroup TopoJSON

This example visualizes the boundaries of Portland block groups using a TopoJSON file. The map is rendered with D3, which reads the topology and converts it into SVG paths on the fly. The block groups are drawn as distinct polygon features, with each region represented by arcs from the TopoJSON topology. The geographic boundaries are likely derived from Census data, and the visualization highlights the spatial layout of Portland’s neighborhoods at the block-group level. The author, Caged, encoded the TopoJSON structure to share this map, making it easy to reuse for choropleth or interactive map projects. The display emphasizes boundary shapes rather than quantitative values, offering a clean basemap for further analysis.

CCaged

72% match

Loading thumbnail…

Fork of Portland Map

This example displays neighborhood boundaries of Portland, Oregon, with each area rendered as a filled SVG path. The map uses a conic equal-area projection configured with a specific center and scale to focus on the city. Data comes from a TopoJSON file of PortlandNeighborhoods, converted to GeoJSON using the `feature` method from topojson. The React app loads the data asynchronously and renders the paths with the `geoPath` generator, applying a teal stroke and fill from the stylesheet.

Bbhargavarathod

72% match

Loading thumbnail…

ice8abhi2.1

This visualization displays neighborhood boundaries in Portland using a geometric map projection. The map renders geographic features as red-outlined polygons, with the page title “portland” appearing above the SVG canvas. The code applies `geoConicEqualArea` for projection and `geoPath` to draw the shapes, while `topojson.feature` converts the TopoJSON data into GeoJSON. The data comes from a PortlandNeighborhoods.json file hosted on GitHub, and the visualization is built with React and styled with Poppins typography.

Aabhi051197

72% match

Loading thumbnail…

Portland Map

This visualization shows a map of Portland neighborhoods using a conic equal-area projection, rendered as stroked SVG paths. It uses `d3.geoPath` to project and draw the neighborhood boundaries from TopoJSON data, with the geographic projection centered on Portland. The map is displayed in a React component that fetches and parses the data via `d3.json` and `topojson.feature`. The styling applies a teal stroke to the paths, creating a clean, minimal map view.

DDINESH SAI BOPPANA

72% match

Loading thumbnail…

Fork of Portland Map

This visualization displays the neighborhoods of Portland as a collection of polygon outlines rendered in SVG. The map uses a conic equal-area projection configured with `d3.geoConicEqualArea` and `d3.geoPath` to draw each neighborhood boundary from the Data Canvas Sense Your City dataset. The React-based application loads TopoJSON data via a custom `useData` hook, converts it to GeoJSON with topojson’s `feature` function, and colors the shape edges pink against a clean white background.

JJyothicherukuri

71% match

Loading thumbnail…

Portland Map

This visualization displays the neighborhoods of Portland, Oregon as a choropleth-style map using a conic equal-area projection. The map renders geographic boundaries as SVG paths generated with `d3.geoPath` and `d3.geoConicEqualArea`, with the data loaded as TopoJSON and converted to GeoJSON features using the `feature` function from `topojson`. The React application fetches the neighborhood data from a GitHub Gist and renders each boundary with a consistent teal stroke, creating a clean, minimalist view of the city’s districts.

HHeidi Stockton

71% match

Loading thumbnail…

USA Map

This visualization displays a map of Portland neighborhoods rendered as an SVG using React and D3. The code employs `geoConicEqualArea` for projection and `geoPath` to draw each neighborhood boundary from TopoJSON data loaded via `useData`. The specific geospatial data comes from a gist containing Portland neighborhood polygons, with styling applied through CSS classes for the path strokes. The example demonstrates integrating React state management with D3’s geographic utilities to produce a clean, minimal choropleth-style map.

LLakshmiVandanaNunna

70% match