Top Religion Per Country with Filter

100%

Top Religion Per Country with Filter

✓ Published1🌍 Public

Last edited Mar 23, 2023

Created on Mar 23, 2023

This visualization presents a choropleth map of the world, coloring each country by its predominant religion. Users can click on color legend entries to filter and highlight countries sharing that religion. The map is rendered using D3 v5’s `geoPath` with a natural Earth projection and a `scaleOrdinal` color scheme. The legend, built with a custom `colorLegend` component, offers interactive filtering. Data is loaded from a TSV file containing country codes and religion labels, joined with geographic features from the world-atlas TopoJSON source.

AI-generated description

Based on the 2018 course, added in my own data There are still some kinks to work out as I am missing some data and some of it is not reading right.

https://vizhub.com/curran/d5ad96d1fe8148bd827a25230cc0f083

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Top Religion Per Country with Filter Round

This interactive choropleth map displays the dominant religion for each country, using an orthographic projection that rotates the globe. The map is rendered as SVG using d3.geoPath, with countries colored via a spectral color scale based on a data.tsv file. Users can click on the color legend to filter and highlight countries by a specific religion, and hover over a country to see its name and religion via a tooltip. The visualization is built with d3.v5, the topojson library for geographic features, and loads the world atlas geodata from unpkg.

Ffsajedi22

90% match

Loading thumbnail…

Top Religion Per Country

A world map colors each country according to its most prevalent religion, with a legend listing the eight categories. The visualization uses `d3.geoNaturalEarth1` projection, `d3.geoPath` for rendering, and `d3.scaleOrdinal` with a spectral color scheme. Data is loaded from a TSV file and merged with TopoJSON from world-atlas, while `d3.zoom` enables panning and zooming.

Ffsajedi22

90% match

Loading thumbnail…

Religion Choropleth Map

This animated choropleth map visualizes the dominant religion in each country using a rotating orthographic globe. Country polygons are colored via a categorical scale, with gray indicating missing data. The visualization uses D3’s `geoOrthographic`, `geoPath`, `geoGraticule`, `scaleOrdinal`, and `schemeCategory10`, with an interactive legend from `colorLegend.js` that filters highlights on hover. Data comes from a 2020 CSV of religions by country, merged with country shapes from the visionscarto-world-atlas TopoJSON, fetched using `Promise.all` and parsed with `csvParse`.

Ffsajedi22

85% match

Loading thumbnail…

Religions Map

An animated orthographic choropleth map displays the dominant religion of each country, with a color-coded legend that responds to hover. The globe rotates continuously as the user inspects the data. Built with D3.js, it uses `geoOrthographic`, `geoPath`, `geoGraticule`, and `scaleOrdinal` to project and style the map from a TopoJSON world atlas and a CSV of per-country religious demographics. The legend is generated by a custom `colorLegend` function.

NNandini Maddula

84% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays world countries colored by economic classification, with an interactive color legend that filters which countries remain highlighted. Clicking a legend item dims all countries not in that category, while clicking the same item again clears the filter. The visualization uses d3.geoNaturalEarth1 for projection, d3.geoPath for rendering SVG paths, d3.scaleOrdinal with a spectral scheme for coloring, and d3.zoom for pan and zoom. Data comes from the world-atlas TopoJSON and TSV datasets, loaded via d3.json and d3.tsv.

Llystran

77% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This interactive choropleth map shows world countries colored by name, with a clickable legend that filters the map to highlight a selected country while dimming others. The visualization uses D3 v5 with `geoNaturalEarth1` projection and `geoPath` for rendering countries, and `d3.zoom` for pan and zoom. Data combines CSV attributes with TopoJSON country boundaries, while the ordinal color scale uses `schemeSpectral`. Clicking a legend item toggles the filter, adjusting opacity and stroke width for highlighted countries.

MMukund Khandelwal

77% match

Loading thumbnail…

Choropleth Map with interactive filtering

This choropleth map displays world countries colored by income group using an ordinal color scale, with a zoomable, panning natural Earth projection. Clicking a legend swatch filters the map by highlighting matching countries and dimming others. The visualization uses d3.geoNaturalEarth1, d3.geoPath, and d3.zoom for map interaction, while a custom colorLegend component handles click-driven filtering. Data comes from the world-atlas TopoJSON and TSV files, with countries rendered as SVG paths and hover effects changing fill color.

JJason-Manbodh

77% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map of world countries colored by economic group, with an interactive legend that filters the map to highlight countries matching a selected category. Users click legend items to toggle filtering, which dims all non-matching countries and slightly emphasizes the selected group. The visualization uses d3.geoNaturalEarth1 and d3.geoPath for map projection, d3.scaleOrdinal with d3.schemeSpectral for color encoding, and d3.zoom for pan/zoom. Data comes from the World Atlas TopoJSON and TSV files loaded via d3.tsv and d3.json.

LLaura Molina

77% match