Fork of 3D chart

100%

Fork of 3D chart

✓ Published1🌍 Public

Last edited Mar 12, 2022

Created on Mar 12, 2022

Forked from 3D chart

This visualization presents a 3D bar chart of the top 10 countries with the highest COVID-19 death counts, rendered using the d3-x3d library, which leverages the x3dom framework for WebGL-based 3D graphics. The chart displays each country as a vertical bar, with height representing death numbers, populated from a CSV dataset loaded via d3.csv. The code explicitly uses `d3.x3d.chart.barChartMultiSeries()` to generate the 3D scene, combining D3 v5 for data handling and CSS for page styling.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Fork of 3D Bar Chart using D3.js

This example renders an interactive 3D bar chart showing the top 10 countries with the highest COVID-19 death counts, as loaded from a CSV file using D3’s `csv` function. It builds the visualization by combining D3 v5, the `d3-3d` plugin, and the `d3-x3d` library, which converts SVG-like scenes into X3DOM for hardware-accelerated 3D rendering in the browser. The chart uses multi-series bars, with each country represented as a separate series, and scales are implicitly handled via the x3d.barChartMultiSeries component. Axes and data parsing are managed with standard D3 utilities (`scaleLinear`, `axisLeft`, `axisBottom`).

Vvegurusaiprathyusha

95% match

Loading thumbnail…

Fork of 3D chart

This example displays the top 10 countries most affected by COVID-19 using a 3D bar chart rendered via the d3-x3d library and X3DOM. It loads CSV data from a GitHub gist, parses each row into key-value pairs for country and case counts, and feeds this into a multi-series bar chart component. The chart is attached to a div with a heading, and the visualization updates once the asynchronous CSV fetch completes. The code relies on d3.csv for data parsing, d3.select for DOM manipulation, and the chart’s datum and call methods for rendering.

VVineela Reddy

90% match

Loading thumbnail…

Fork of ICE-6

This visualization displays a horizontal bar chart of the top 10 countries with the highest COVID-19 death counts, with country names on the y-axis and death totals on the x-axis. The chart uses React for component structure and D3 v5 modules including `scaleLinear`, `scaleBand`, and `csv` for data loading, rendering as SVG rectangles. Data is sourced from a public CSV file fetched asynchronously, and the bars are styled with a uniform purple fill against a dashed-border title.

Vvegurusaiprathyusha

89% match

Loading thumbnail…

3D chart

This 3D bar chart visualizes the top 10 countries most affected by COVID-19, with each country’s total case count represented as a vertical bar. The example uses D3 v5 alongside the d3-3d and d3-x3d libraries to generate the interactive scene, which is rendered through X3DOM in the browser. Data is loaded asynchronously from a CSV file, then parsed and passed to a `d3.x3d.chart.barChartMultiSeries()` component attached to a chart holder div. The page includes custom CSS styling for the heading and body layout.

Bbhargavarathod

89% match

Loading thumbnail…

3D Bar Chart

This example displays the top 10 countries most affected by COVID-19 as a 3D bar chart using the d3-x3d library, which bridges D3.js with X3D for WebGL rendering. The bars are generated from a CSV dataset containing case counts per country, loaded asynchronously via d3.csv. The chart uses d3.x3d.chart.barChartMultiSeries to create the three-dimensional visualization, with the axis and layout handled by the x3dom framework. The page includes custom CSS for styling the title and center alignment.

HHarshinireddyy19

89% match

Loading thumbnail…

3D chart

This 3D bar chart visualizes the top 10 countries most affected by COVID-19, comparing Age and Height metrics for each nation. The visualization uses the d3.x3d library to render an interactive three-dimensional bar chart, with data loaded from a CSV file hosted on GitHub. The implementation combines d3.csv for data parsing, d3.scaleLinear for value mapping, and the d3-x3d chart component to generate the 3D scene, which is displayed within an HTML div element using the X3DOM framework.

DDINESH SAI BOPPANA

87% match

Loading thumbnail…

Fouzan Uddin Bar Plot

This example visualizes COVID-19 death counts by country as an interactive 3D bar chart. The bars rise vertically from a flat plane, with each country’s death total mapped to bar height. The visualization uses the `d3-x3d` library to render the scene via X3DOM, while D3 v5’s `csv` loader fetches and parses the data from a GitHub gist. The `barChartMultiSeries` component from `d3-x3d` handles the 3D geometry, and the page loads required scripts for D3, X3DOM, and the chart wrapper.

Ffouzanuddin

86% match

Loading thumbnail…

Fork of Fork of Fork of ICE-6 bar graph

A bar chart displays the total COVID-19 deaths for twelve countries, forming a ranked comparison of mortality. The visualization loads CSV data from a GitHub gist and renders horizontal bars using React and D3 v5. Code uses `d3.csv`, `scaleBand`, and `scaleLinear` to map country names and death counts to SVG rectangles. Axis ticks and gridlines are drawn manually with `line` and `text` elements, while the chart title appears in the HTML heading.

Cchandanagandla

85% match