Skip to main content
SimilarExport ZIP
100%

scatter map

✓ Published0🌍 Public
NNJ Smith
Last edited Jan 16, 2026
Created on Jan 16, 2026

This interactive map displays 311 homeless encampment reports across Staten Island, with a dark-themed Leaflet map rendering circular markers for each reported location. Users can filter the data by status (Open, Closed, Pending) and date range using the provided dropdowns. The map uses CARTO’s dark basemap tiles and shows popup details for each marker, including date, status, address, and resolution description. The CSV data is loaded via D3’s `csv` parser, while Leaflet’s `map`, `tileLayer`, and `circleMarker` APIs handle map rendering and interaction.

AI-generated description

Staten Island 311 Requests - Homeless Encampments Map

An interactive Leaflet map visualization showing 311 requests for homeless encampments in Staten Island, NYC.

Features

  • Interactive map powered by Leaflet
  • Filter by status (Open, Closed, Pending)
  • Filter by date range
  • Click markers for detailed information
  • Dark theme optimized for data visualization

Data Source

The application expects a CSV file (data.csv) with the following columns:

  • unique_key
  • created_date
  • agency
  • complaint_type
  • descriptor
  • location_type
  • incident_address
  • city
  • status
  • resolution_description
  • latitude
  • longitude

Usage

Replace the sample data in data.csv with actual 311 data from NYC Open Data.

MIT Licensed

Similar vizzes

Loading thumbnail…

Line Graph

This line graph displays the unsheltered homeless population in New York City from 2009 to 2012, broken down by borough and surface versus subway locations. The visualization is built with D3 v5, using `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for tick marks, and `d3.line` with `d3.curveBasis` to render the smooth paths. Data originates from a CSV file, and SVG is used for all rendering, with tooltips omitted.

JJHamron
66% match
Loading thumbnail…

Fork of Bar Graph - New York Homeless Population (2009-2012)

This chart displays New York's homeless population from 2009 to 2012, breaking down counts by borough (Manhattan, Bronx, etc.) and by location category (Surface, Subways, Total Unsheltered) for each year. The data is read from a CSV file using `d3.csv`, and bars are rendered in SVG using `scaleBand`, `scaleLinear`, and `scaleOrdinal` for positioning and color coding by year. Axes are added with `axisLeft` and `axisBottom`, and a color legend distinguishes the four years.

Iianjwo
65% match
Loading thumbnail…

Line Graph - New York Homeless Population (2009-2012)

This line graph shows the homeless population in New York from 2009 to 2012 across multiple areas, with lines for boroughs and categories such as Surface Total and Subways. It displays the full dataset without aggregation, plotting population counts against years. The visualization uses D3 v5 APIs including `scaleLinear`, `scalePoint`, `scaleOrdinal`, `axisLeft`, `axisBottom`, and `line` to render SVG paths and circles, with a color legend indicating which lines correspond to boroughs versus transportation categories. The data is loaded from a CSV file.

JJHamron
65% match
Loading thumbnail…

Homelessness Heatmap

A heatmap displays the percentage of homeless population across ten states over multiple years, with darker blue cells indicating higher percentages. The visualization uses an SVG rendering with D3.js v6, employing `d3.scaleBand` for axes, `d3.scaleSequential` with `d3.interpolateBlues` for color encoding, and an interactive tooltip on mouseover. Data comes from a CSV file of top homeless populations, and the legend is built using the `d3-legend` library.

EEunice Tu
65% match
Loading thumbnail…

Fork of Bar Graph - New York Homeless Population (2009-2012)

This visualization shows New York’s unsheltered homeless population from 2009 to 2012, grouped by borough and location (surface, subways, and total). Each year is represented by a distinct colored bar within a grouped bar chart, with axes and a legend. Built with d3.csv, scaleBand, scaleLinear, scaleOrdinal, axisLeft, and axisBottom, it uses SVG rectangles for bars and renders the full dataset from a CSV. Colors encode years via a ordinal scale, and a legend maps hues to each year.

Iianjwo
64% match
Loading thumbnail…

Untitled

This visualization combines a bubble map of emergency reports with a date histogram. It uses React to render a Mercator projection of the Netherlands, plotting each incident as a red circle based on its coordinates. The accompanying histogram, built with d3's scaling, binning, and time-series functions, displays the daily count of reported incidents. Both views read from a CSV file containing geolocation and timestamp data.

Ssri7harsha
64% match
Loading thumbnail…

Missing Migrants Scatter

This scatter plot charts the reported dates of migrant incidents against the total number of dead and missing, revealing temporal patterns in the data. Using D3’s `scaleTime` and `scaleLinear` for axes and `React` components for rendering, each circle represents an incident with a native SVG `<title>` tooltip. The visualization loads CSV data from a GitHub gist via `d3.csv`, with React state management handling asynchronous data retrieval and rendering a loading message until the dataset arrives.

AAndre J Denais
64% match
Loading thumbnail…

Scatter Plot

This example shows a scatter plot of the Missing Migrants Project data, plotting reported dates against the total number of dead and missing individuals. The visualization uses React to render SVG circles, with D3 scales and axes handling the projection of data points. The code utilizes `scaleLinear` for both axes, `extent` for domain calculation, and `csv` for data loading. Interactive tooltips are provided via SVG `<title>` elements, while the chart includes labeled axes for clarity.

CCarlos Caballero
64% match