Skip to main content
SimilarExport ZIP
100%

COVID-19 Country measures

✓ Published1🌍 Public
Mmpenalver
Last edited Apr 30, 2020
Created on Apr 13, 2020

This interactive tree diagram visualizes COVID-19 country measures, organizing hierarchical data into collapsible nodes. The visualization uses d3.layout.tree with SVG rendering and zoom/pan capabilities via d3.behavior.zoom. Users can click nodes to expand or collapse branches, while a custom context menu (d3-context-menu.js) provides additional options. The tooltip displays detailed information about each measure, and the tree layout dynamically recalculates height based on visible children. Data is loaded from a pipe-delimited CSV file using d3.dsv, converted into a nested structure via a name-to-parent map.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

COVID-19 Country measures

This visualization presents COVID-19 country measures as an interactive, collapsible tree diagram. Users can click nodes to expand or collapse branches, with pan and zoom controls for navigation. The tree layout uses d3.layout.tree and d3.svg.diagonal for links, while d3.behavior.zoom enables scaling. Data is loaded from a CSV file using d3.dsv with pipe delimiters, and node text is displayed via SVG elements that appear on hover.

Mmpenalver
96% match
Loading thumbnail…

COVID-19 Country measures

This interactive tree visualization displays hierarchical data on COVID-19 country measures, sourced from a pipe-delimited CSV file. Built with D3 v3 and jQuery, it renders an SVG layout where users can click nodes to expand or collapse branches, pan/zoom via d3.behavior.zoom, and hover to highlight relationships through opacity changes and label formatting. The d3.layout.tree and d3.svg.diagonal APIs structure the hierarchy, while manual box adjustments and centered node transitions enhance navigation.

Mmpenalver
95% match
Loading thumbnail…

COVID-19 Country measure

This visualization displays a hierarchical tree of COVID-19 country measures, with nodes representing categories and subcategories of enforcement and implementation strategies. Text labels size inversely with depth, and curved links connect parent and child nodes. Built with React and D3 v5, it uses `d3.tree` for layout, `d3.linkHorizontal` for path generation, and `d3.zoom` for interactive panning. Data is loaded from a pipe-delimited CSV and converted into a tree structure using `d3.hierarchy`.

Mmpenalver
91% match
Loading thumbnail…

COVID-19

This interactive D3.js visualization displays COVID-19 metrics over time for selected countries, allowing viewers to toggle between confirmed cases, deaths, and recoveries via two dropdown menus. The line chart uses a time-based x-axis and a linear y-axis, with a single red, blue, or green line rendered per selection. Data is loaded from a CSV file, processed by nesting and grouping entries by date, and filtered by country. The visualization uses D3's `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` for smooth curves.

WW9183907
78% match
Loading thumbnail…

Untitled

This example visualizes a hierarchical tree of COVID-19 data, showing confirmed cases, deaths, and recoveries across continents and countries. The tree layout uses d3.tree to position nodes, with SVG circles and text labels for each location. Hovering over a node triggers a tooltip displaying the specific statistics. The visualization uses d3.v5 and React, with an animated tree structure that renders the data in a clear, drill-down format.

Pphemmati
77% match
Loading thumbnail…

COVID-19

This D3.js visualization shows the progression of COVID-19 cases, deaths, and recoveries over time for a selected country. Users choose a status metric and country via dropdown menus, and the chart displays a smooth line chart of that metric against observation dates. The code uses D3 v5 methods like `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` to render the SVG. Data is loaded from a CSV file and aggregated by country and day using `nest` and a custom `groupByDay` function.

WW9183907
76% match
Loading thumbnail…

COVID-19

This interactive dashboard visualizes the daily progression of COVID-19 cases, deaths, and recoveries for a selected country in 2020. Using dropdown menus built with a custom reusable `dropdownMenu` function, viewers can switch between the three status metrics and any available country to update a line chart rendered as SVG paths. The code loads data from a CSV file containing daily province-level records, aggregates entries by country and date using `d3.nest` and `reduce`, and draws the time series with `d3.line`, `d3.scaleTime`, and `d3.scaleLinear`.

FFadziMandondo
76% match
Loading thumbnail…

Untitled

This visualization presents a hierarchical tree map of COVID-19 case data, showing confirmed cases, deaths, and recoveries by continent and country. The root node aggregates global totals, branching into regions like Asia and individual nations, with China expanding into its provinces. Built with D3.js v5, the code uses a standard tree layout to position nodes and likely links, with each node displaying its name and associated metrics. The static data is embedded directly in the script, sourced from real-world pandemic statistics as of late April 2020. The visualization uses a simple, unstyled SVG rendering without interactive features or transitions.

Pphemmati
76% match