Skip to main content
SimilarExport ZIP
100%

dboard

✓ Published0🌍 Public
BBaptisteJarry
Last edited Dec 4, 2022
Created on Nov 30, 2022
Forked from Hello VizHub

This dashboard lets users explore a music artist database by country, showing the top artists per country and then diving into an artist's top tracks, related artists, album chronology, and music genres. It uses D3.js (v4) with React, fetching data from a remote API. The visualization employs an SVG map with a geoMercator projection for the country overview and various charts, including bar charts and a timeline, for the detailed artist views.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

dboard

dboard is a dashboard that aggregates music artist data from a JSON file, categorizing artists by musical genre and showing counts by gender type (Male, Female, group, unknown) alongside cumulative Deezer fan counts. The visualization uses d3.v6 to load and parse the data, then processes it into a new aggregated dataset. The HTML layout relies on a CSS grid with four plot containers and a hidden tooltip element for potential interactivity, while the JavaScript code handles the data transformation through nested array operations and conditional counting.

AAtlasZen
84% match
Loading thumbnail…

dboard

The dashboard presents a multi-panel overview of sales data from a CSV file, showing a US map of state-level sales, a bar chart, a scatter plot, and a sub-category pie chart. It uses D3 v6 and Moment.js to parse dates, with SVG rendering and animated transitions for axes. The map is generated via `d3.geoPath` with a GeoAlbersUsa projection and a linear color scale, while the pie chart uses `d3.pie` and `d3.arc`. Tooltips display values on hover.

TTimothyMiage
79% match
Loading thumbnail…

dboard

dboard presents a sales dashboard for a US superstore dataset, displaying four coordinated visualizations: a pie chart of sub-category sales, a bar chart of category sales, a scatter plot of sales over time, and a geographic map of sales by state. Built with React and D3 v6, it renders SVG elements with animated transitions between views, using `d3.pie`, `d3.arc`, `d3.scaleBand`, `d3.scaleTime`, and `d3.geoAlbersUsa` with `d3.geoPath`. Tooltips on hover reveal customer and product details.

GGinnWG
79% match
Loading thumbnail…

dboard

This dashboard displays a sales dataset across four synchronized visualizations: a scatter plot of sales over time, a bar chart of sales by sub-category, a geographic map of US sales, and a pie chart of sub-category proportions. Built with Vue, it uses D3 v6 APIs like `d3.scaleBand`, `d3.pie`, `d3.geoAlbersUsa`, and `d3.geoPath`, with data loaded via `d3.csv` from a local CSV file. Animations use `transition` calls, and all charts render as SVG.

JJuliette
78% match
Loading thumbnail…

dboard

This dashboard example, built with Vue and D3 v4, presents multiple data visualizations from a CSV file of sales records. The primary chart is a stacked bar chart that breaks down sales by product category, using a color-coded system to distinguish between subgroups. It imports specific D3 functions like `csv`, `scaleBand`, and `scaleLinear` to parse the data and construct the SVG-based charts. The interface uses a CSS grid to arrange four distinct visualization panels, with a tooltip element prepared for interactive data exploration.

BBaptisteJarry
78% match
Loading thumbnail…

dboard

The dashboard displays sales data from a CSV file, using a small multiple of four SVG plots to visualize metrics like order amounts by category, product, and region. The code leverages D3 version 6 to parse the data, scale axes, and render stacked bar charts, with a color palette distinguishing revenue segments. Tooltips are implemented via HTML elements, and the layout is managed through a CSS grid, while the chart dimensions and margins are explicitly defined in the JavaScript.

JJShellBach
78% match
Loading thumbnail…

dboard

The dashboard displays four synchronized visualizations of retail sales data from a CSV file: a US map with geographic projections, a bar chart, a scatter plot, and a pie chart. Built with Vue and D3 v6, it uses `d3.geoAlbersUsa` and `d3.geoPath` for the map, `d3.pie` and `d3.arc` for the pie, and `d3.scaleTime` for the scatter plot. All charts feature animated transitions and interactive tooltips showing customer and product details.

Ffkara09
77% match
Loading thumbnail…

dboard

This dashboard presents a multi-panel view of sales data from a CSV file, showing sales by category in a bar chart, a geographical map of the US, a time series scatter plot, and a donut chart of sub-category sales. The bar chart is interactive; clicking a category filters the accompanying charts and updates the donut chart, which is rendered using `d3.pie()`. The code employs D3 v6 functions like `d3.rollup` for data aggregation and `d3.axisBottom` for axes. Visual elements are drawn as SVG primitives, with interactions driven by mouse events and tooltips.

IIndira120
77% match