ATLA Scholarly Communications Workshop

D3 Example

This example visualizes the breakdown of religious affiliations across the five most populous countries using a small multiples layout of polar area charts, where each country appears as a separate circular chart and each segment’s radius encodes the population of a given religion. The visualization is rendered with SVG, using D3’s nested selections to group data by country and a pie layout to generate slices. The code explicitly uses `d3.layout.pie`, `d3.svg.arc`, `d3.nest`, and ordinal and sqrt scales, while the color legend is built with the d3-legend library. Data comes from the Pew Research Center Global Religious Landscape dataset, loaded from a CSV file.

D3 Example

This visualization presents a small multiples grid of polar area charts, one for each country, where each chart uses wedge size to encode the population of different religious groups. The code builds these SVG charts with D3.js, using nested selections, a pie layout, and an arc generator, and colors each religious group via a categorical scale. It loads data from a CSV file of the Pew Research Center’s Global Religious Landscape dataset. While visually crowded and hard to read, the example includes an interactive color legend that re-sorts the country charts when a religion is clicked, demonstrating a starting point for further exploration.

D3 Example

This example uses nested selections to render a small multiples grid of polar area charts, each representing the distribution of religious affiliations by population for a single country. The visualization draws from the Pew Research Center’s Global Religious Landscape dataset and sorts countries by the total population of a selected religion, which can be chosen by clicking a color legend. The code relies on `d3.layout.pie`, `d3.svg.arc`, and `d3.legend.color` to build the SVG charts, with animated transitions applied to reorder and reposition the pies.

D3 Example

This is a small-multiples visualization of pie charts showing the religious breakdown of the five most populous countries. Each country’s donut chart displays the proportion of its population following each religion, but the charts are all the same size, so area is not proportional to population, which can be misleading. The code uses D3’s `d3.layout.pie` and `d3.svg.arc` to generate the slices, with nested selections binding data to each chart. It also employs the d3-legend library for the color legend and renders as SVG. Data comes from the Pew Research Center’s Global Religious Landscape dataset.

D3 Example

This example presents grouped bar charts comparing religious affiliations across the five most populous countries, using population data loaded from a CSV via `d3.csv`. The code leverages `d3.nest` to structure data by religion and `d3.layout.stack` to layer the groups, while `d3.scale.ordinal` and `d3.scale.linear` map countries and population counts to SVG rectangles. A color legend is rendered with `d3.legend`, and axes are customized using `d3.svg.axis`. The visualization highlights stacked-to-grouped bar transitions, with styling via Open Sans fonts and D3 version 3.5.5.

AAsadeviB

62% match

Fork of Vega-Lite API Template

This example demonstrates an interactive scatter plot exploring global religious demographics, with circle size encoding population and axes mapping country and religion. The visualization is built using the Vega-Lite API, which composes specifications through JavaScript method chaining, then renders via Vega’s SVG output with tooltips from vega-tooltip. Data loads asynchronously from a CSV (Auto MPG dataset, though the active code references religion and population) using d3.csv, while the vega-lite-api library registers with Vega and Vega-Lite to handle encoding, scaling, and configuration. Custom axis styling and font settings come from a separate config object.

AAbi360

61% match

D3 Example

This visualization displays small multiples of donut charts, one per country, showing the religious breakdown of the five most populous nations. Each donut uses the same fixed radius, so the charts show only the proportion of religions within each country, not the total population, making the visual misleading for cross-country comparison. The code uses D3’s `d3.layout.pie` and `d3.svg.arc` to generate the slices, with nested selections via `d3.nest()` to group data by country. A color legend from `d3-legend` maps religions to colors, and the data comes from the Pew Research Center’s Global Religious Landscape dataset, loaded from a CSV file.

61% match