Skip to main content
SimilarExport ZIP
100%

leaflet-map-csv

✓ Published0🌍 Public
Aachintyatripathi
Last edited Oct 12, 2020
Created on Oct 12, 2020
Forked from HTML Starter

This example displays crime locations on an interactive map of Rupnagar, India, using a CSV file containing latitude, longitude, police station, and place of occurrence. The map reads the CSV with PapaParse and jQuery, then plots each row as a Leaflet marker whose popup shows the police station name. Users can toggle between two base layers—Carto Light and Stamen Terrain—via a control panel in the top-right corner.

AI-generated description

A bare minimum HTML page.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Leaflet Map Example

This example shows a Leaflet map with interactive markers and a circle overlay, plotting applicant counts per country from a CSV dataset. Using the Leaflet JavaScript library, it renders an OpenStreetMap base layer and adds markers for each data point, binding popups to display country-specific information. The code also demonstrates adding a styled circle geometry to the map, and it imports utilities from TopoJSON for potential geospatial operations.

Kklumng
69% match
Loading thumbnail…

Fork of DataViz-Plot2

This example visualizes the locations of crimes from a CSV dataset as a scatter plot, mapping latitude and longitude coordinates to x and y positions. The code loads the data using `d3.csv`, filters out invalid entries, and renders each point as an SVG circle with tooltips. The visualization includes linear scales, axes with labels, and a title, all created with D3 v7. The source dataset is linked from Google Drive, and the chart is built exclusively with SVG elements.

Hharikrishnasair@gmail.com
68% match
Loading thumbnail…

crime

This interactive visualization displays the number of crime cases against women across Indian states, with a choropleth map colored by crime type and two donut charts for selecting the year and crime category. The map updates dynamically when users change the dropdown selections. Built with D3 v7 and React, the code uses `d3.rollups` for data aggregation, `d3.geoPath` for rendering the TopoJSON map of India, and `d3.scaleOrdinal` with custom color themes. Data comes from a CSV file hosted on GitHub Gist.

Ppvreswar7@gmail.com
67% match
Loading thumbnail…

Crime Data Analysis - Crime Spots

This visualization displays crime incident locations across a geographic area as individual map markers, with popups revealing details about crime type, weapon used, and date. The map is built using Leaflet with OpenStreetMap base tiles, centered on New York City at coordinates 40.7128, -74.0060. Crime data is loaded from an external CSV file via d3.csv, and each row’s latitude and longitude values are parsed to create markers using L.marker. The popup content is constructed with HTML strings embedding the crime attributes. The visualization provides an immediate spatial overview of crime distribution across the region.

VVinay Vemuri
67% match
Loading thumbnail…

Fork of Fork of Derive India map - Open street

An interactive choropleth map visualizes crime rates per 100,000 population across Indian states and Union Territories, with hover tooltips, click-to-select, search filtering, and union territory toggling. Built with D3.js v7 for data processing and SVG rendering, it uses Leaflet for the base map, d3.geoPath for shape projection, and a d3.scaleSequential color scale. Crime data comes from a local CSV file, while state boundaries load from a GeoJSON URL.

NNita
67% match
Loading thumbnail…

Map Example

This map example visualizes a set of latitude and longitude coordinates from a CSV file as markers on an interactive map centered on Delhi, India. It combines Leaflet and the Mappls map SDK, with an extra OpenStreetMap tile layer, to render the geographic context. The code uses D3’s `d3.csv` function to load the data and then creates Mappls markers, binding a popup to each point.

SSriyaI
67% match
Loading thumbnail…

Untitled

This interactive bar chart displays road accident statistics across eight police stations in the Ropar district, using data from a CSV file. A dropdown menu lets the user select different variables, such as fatalities by severity, day of the week, vehicle type, or collision type, and the bars update with smooth transitions. The visualization uses D3 v3 with an ordinal x-scale and linear y-scale to map police stations and case counts, while hovering over a rectangle highlights it and shows a tooltip with the station name and value.

Aachintyatripathi
67% match
Loading thumbnail…

ice - 8

This visualization shows crime rates across Indian states and union territories using an interactive choropleth map, with a sidebar providing a color legend and details about the hovered region. It combines D3.js version 6 for data parsing and SVG path generation via `d3.geoPath` with a custom `d3.geoTransform` projection, and Leaflet 1.7.1 for map rendering and interaction. The map loads state boundaries from a GeoJSON URL and colors each polygon based on crime rates from a CSV file using a sequential `d3.scaleSequential` with the `d3.interpolateYlOrRd` color scheme.

Ccharchana0527@gmail.com
66% match