Skip to main content
SimilarExport ZIP
100%

Curran's version: Aggregation by Country using Excel + Dropdowns!

✓ Published0🌍 Public
Ssophburke
Last edited Oct 25, 2019
Created on Oct 25, 2019

This interactive map uses a geoMercator projection via d3.geoPath to display global course viewership data, with circle sizes proportional to aggregated view counts per country. Users select a course category from a React dropdown menu, which filters the dataset loaded from a CSV file containing viewer locations. The visualization combines topojson-derived land boundaries with graticules and sphere outlines, while hovering over circles reveals the country name and total views through SVG title elements. The map data comes from the World Atlas topojson source.

AI-generated description

This fork was made to help show how to position the menu below the viz.

MIT Licensed

Similar vizzes

Loading thumbnail…

Sophie's version: Aggregation by Country using Excel + Dropdowns!

This interactive map visualizes course viewership data by country, using a dropdown menu to filter between different courses and an "All" option for aggregated totals. It renders a world map with D3 geoMercator projection, drawing D3 geoGraticule lines, geoPath land masses, and sphere background. Data is loaded via D3's csv and json from external sources, with circle markers sized using scaleSqrt based on view counts and tooltips displaying country and view totals. The React frontend updates the map and circles when a course is selected from the dropdown menu.

CCarloGato
87% match
Loading thumbnail…

Sophie's version: Aggregation by Country using Excel + Dropdowns!

This interactive map visualizes aggregate course view counts by country using a Mercator projection rendered in SVG. Users filter the data by course category via a dropdown menu, which updates the circle sizes representing total views per nation. The visualization loads geographic boundaries from a TopoJSON world atlas and CSV data containing viewer locations and course enrollment metrics. Built with React, the example uses d3.geoPath for map rendering, d3.scaleSqrt for proportional circle sizing, and react-dropdown for the selection interface.

EElora-dev
87% match
Loading thumbnail…

Sophie's version: Aggregation by Country using Excel + Dropdowns!

This example displays a world map with points sized by the total views for each country, aggregated from viewer location data. A dropdown menu allows users to filter the visualization by course. The map uses a geoMercator projection and d3.geoPath to render land and graticules, while d3.scaleSqrt determines circle radii. The React app loads map data from TopoJSON and viewer statistics from a CSV file, with the dropdown implemented using the react-dropdown component.

CCurran Kelleher
86% match
Loading thumbnail…

Menus with React -Aggregation by Country + Dropdowns!

This interactive map visualizes video view counts for Harvardx/MITx online courses in 2013, aggregating data by country. A dropdown menu lets users filter the displayed points by individual course. The visualization uses D3’s `geoPath` with a Mercator projection to render the world map and graticule, while `scaleSqrt` sizes circles representing views. Hovering over a point reveals the country name and view count. Data is loaded from a CSV using D3’s `csv` function, and the interface is built with React state management for the dropdown selection.

Ssophburke
84% match
Loading thumbnail…

From Chen Ding: Aggregation by Country using Excel + Dropdowns!

This example visualizes the number of video views for Harvardx/MITx online courses in 2013, with circles sized proportionally to view counts and positioned by geographic coordinates on a world map. A dropdown menu filters the view by specific course, and hovering over a circle reveals the country and total views. The map uses a Mercator projection via D3’s `geoMercator` and `geoPath` for landmasses and graticules, while `scaleSqrt` determines circle sizes. Data is loaded as CSV and TopoJSON, with the view rendered as React-driven SVG elements.

JJoker-tr
84% match
Loading thumbnail…

From Chen Ding: Aggregation by Country using Excel + Dropdowns!

This example visualizes the number of video views for HarvardX/MITx online courses in the 2013 academic year. Circles, sized by total views, are positioned on a world map according to viewer location, with a dropdown menu to filter by specific course. A tooltip reveals the country and view count for each circle. The visualization uses a Mercator projection via `geoMercator`, renders map features with `geoPath`, and calculates the circle sizing using `scaleSqrt` from D3 v5. The map data comes from the World Atlas TopoJSON, while view data is loaded from a CSV file.

Ssophburke
83% match
Loading thumbnail…

Aggregation by Country + Dropdown

This example visualizes video views from the Harvard/MITx online course dataset (academic year 2013) on a world map. A dropdown menu filters which course’s view counts are displayed as circles, with radius encoding the total views per country via `scaleSqrt`. Hovering reveals the country name and view count. The map uses a Mercator projection (`geoMercator`) with `geoPath` to render land and graticules from World Atlas TopoJSON, while the interface is built with React and the `react-dropdown` component.

Ssophburke
83% match
Loading thumbnail…

Aggregation by Country + Dropdown

This visualization displays the number of video views for HarvardX/MITx online courses in 2013, with circles sized by view count on a world map. A dropdown menu filters the displayed data by course. The map uses a Mercator projection via `geoMercator` and `geoPath`, with geographic features from the World Atlas TopoJSON. View data comes from a CSV file loaded with `d3.csv`. The visualization is built with React components and D3 scales (`scaleSqrt`) for circle sizing.

Ssophburke
83% match