Skip to main content
SimilarExport ZIP
100%

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

✓ Published0🌍 Public
EElora-dev
Last edited Jul 23, 2020
Created on Jul 23, 2020

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.

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
96% 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
94% match
Loading thumbnail…

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

This example visualizes video views for HarvardX/MITx online courses in 2013, aggregated by country on a world map. Circles sized by `d3.scaleSqrt` represent total views per location, with a dropdown menu to filter by individual course. Data is loaded via `d3.csv` from a gist, while geographic boundaries come from World Atlas TopoJSON. The map uses a Mercator projection via `d3.geoMercator` and `d3.geoPath`, with graticules and land masses rendered as SVG paths, and tooltips show course and view counts.

Ssophburke
92% match
Loading thumbnail…

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

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.

Ssophburke
87% match
Loading thumbnail…

Sophie's version: Aggregation by Country using Map

This interactive map visualizes video views from the Harvardx/MITx Course-Person Dataset for 2013, with circles sized using a square-root scale to represent view counts per location. Built with React and D3 v5, it uses d3.geoMercator and d3.geoPath to render world map boundaries from World Atlas Topojson, while data points are positioned by longitude and latitude. Hovering over a circle reveals the aggregated view count and country name.

Ssophburke
87% match
Loading thumbnail…

Sophie's version: Aggregation by Country using Excel

This example visualizes the total video views for HarvardX and MITx online courses in 2013, aggregated by country and shown as circles on a world map. Circle size encodes view count, and hovering reveals the country and number of views. The map uses a Mercator projection built with D3’s `geoMercator`, `geoPath`, and `geoGraticule`, layered with land and interior boundaries from the World Atlas TopoJSON. Data is loaded from a remote CSV via D3’s `csv` function, and the circles are positioned using the projection, with their radius scaled by `scaleSqrt` in SVG.

Ssophburke
87% 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
82% 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
82% match