dynamic map

dynamic monthwise map

This dynamic map shows child health indicators across blocks in Palghar district, India, with a dropdown to switch between months (August, September, October) and a second dropdown to toggle between severely stunted and stunted children counts. The choropleth colors each block red, yellow, or green based on the selected metric’s value relative to a three-tier scale, and hovering reveals a tooltip with additional percentages for stunting, underweight, and low birth weight. Built with D3 v5, it uses `d3.geoPath` with a Mercator projection, `d3.csv` and `d3.json` for data loading, and `d3.event` for mouse interaction, rendering features as SVG paths with zoom support via `d3.zoom`. The monthly CSV data is merged into the GeoJSON features by block name before rendering, with colors recalculated on selection change.

90% match

map-dot-density

This map shows the percentage of stunted children across eight blocks in Palghar, India, using a choropleth coloration over administrative boundaries. The visualization is implemented with D3 v5, projecting the GeoJSON geometry using `geoMercator` and rendering the polygons with `geoPath`. A slider, from `d3-simple-slider`, adjusts the color scale bins, while textures from the `textures` library are applied to the SVG. Hovering over a block reveals a tooltip with the exact percentage.

Zzoniyac

85% match

level 1 with all features

This visualization shows a choropleth map of Palghar district, India, displaying nutritional indicators for children across administrative blocks and projects. Users can switch between seven categories, including stunting, wasting, and underweight rates, using a dropdown menu. A slider filters the color scale to focus on specific value ranges, while hovering reveals tooltips with region names and percentages. The map uses D3 v5 with a Mercator projection and `d3.geoPath` to render GeoJSON data. SVG polygons and text labels animate color changes and update values when switching indicators, with zoom support for detailed inspection.

month + category map

A choropleth map of Palghar district highlights child nutrition indicators across eight blocks, with dropdown menus to switch between August, September, and October, and between stunted or severely stunted child counts. The map renders block polygons from a GeoJSON file using d3.geoPath with a Mercator projection, and colors each block red, yellow, or green based on a three-tier threshold. D3 transitions animate the fill changes when a new month or metric is selected, and hovering shows a tooltip with additional stunting, underweight, and low birth weight percentages. Data comes from monthly CSV files merged into the GeoJSON properties.

map-line-density

This example visualizes the percentage of stunted children across administrative blocks in Palghar, India, using a choropleth map. The map renders GeoJSON polygon boundaries with d3.geoPath and a Mercator projection, while fill patterns from textures.lines encode the data values. An interactive range slider, built with d3-simple-slider, dynamically adjusts the classification thresholds, triggering a CSS transition to recolor the map. Hovering over a block displays its name and value in a tooltip, with data sourced from a CSV file and joined to the GeoJSON features.

Zzoniyac

map-line-density

Zzoniyac

(info)Level 1 with all features

An interactive choropleth map allows exploration of child malnutrition statistics across administrative levels in Palghar, India. Users select a month and a health category (e.g., severely stunted) from dropdowns to update the map’s color encoding via a color scale. A draggable range slider refines the classification thresholds, while hovering over a polygon reveals a tooltip with the block name and percentage. The map, rendered with SVG paths using `d3.geoMercator` and `d3.geoPath` from topoJSON data, includes an animated transition when the slider changes, with zoom support via `d3.zoom`.

83% match

Level 1 with all features

This interactive map of Palghar district visualizes child health indicators across administrative blocks, showing metrics like stunting and underweight prevalence. Users can switch between August, September, and October data through a month selector and filter by seven health categories. A slider lets viewers adjust the color thresholds for the choropleth map. The visualization uses D3.js v5 with a Mercator projection to render GeoJSON polygons, providing colored boundaries with labels, tooltips on hover, and an accompanying data table. The SVG rendering adjusts colors and labels dynamically with animated transitions.