TD2

100%

TD2 - dboard

✓ Published0🌍 Public

Last edited Oct 3, 2022

Created on Oct 3, 2022

Forked from dboard

This dashboard displays four distinct D3.js v5 visualizations in a grid layout, each rendering data from untracked sources. It includes interactive plots that respond to user actions, with a tooltip showing values on hover. The code uses D3 selections and scales, along with Moment.js for date handling, to build the charts. A custom tooltip element appears dynamically, while the grid container organizes the plots responsively. The bundle.js file, built from an ES6 module, initializes all visualizations and manages the shared tooltip behavior across the four chart areas.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

This visualization displays four separate plots within a responsive grid, each rendered by D3 v5. The code uses d3.forceSimulation for network layouts and d3.geoPath for geographic projections, while moment.js handles time-based data transformations. Data is loaded from an external CSV file, and each plot is independently styled with distinct background colors. The bundle.js script coordinates the rendering, though the specific chart types are not immediately visible from the provided code structure.

TThibautDARE

86% match

Loading thumbnail…

TD2

This visualization presents a multi-panel dashboard for exploring sales data from a CSV file. It displays several distinct plots, likely including bar charts and other summaries, within a grid layout. The implementation uses D3 v5 to load the data and render SVG graphics, leveraging scales and axes for plotting. The page is built with Vue and uses Moment.js for any date parsing, with tooltips providing interactivity for detailed values.

AAdrien

84% match

Loading thumbnail…

TD2 - dboard - Version prof

This dashboard displays sales data from a CSV file across four coordinated visualizations. It shows a geographic map of state-level sales using `d3.geoAlbersUsa` and `d3.geoPath`, an animated bar chart, a time-series scatter plot, and a donut chart of sub-category sales. The bar and scatter plots use transitioned axes, while the pie chart uses `d3.pie` and `d3.arc`. Built with D3 v6 and Vue, it renders SVG with tooltip interactions on hover.

MMaeva B

83% match

Loading thumbnail…

TD2

This visualization presents a multi-chart dashboard for exploring sales data from a CSV file. It shows a bar chart of total sales by product category, a scatter plot of individual sales over time, and additional panels, with interactive tooltips and click-to-filter behavior. The code uses D3.js v6 (via `d3.rollup`, `scaleBand`, `scaleTime`, and `axisBottom`), Moment.js for date parsing, and animated transitions to update charts with a 1000ms duration. Data is loaded from `data.csv`, and all charts are rendered as SVG elements.

SSeegson

79% match

Loading thumbnail…

dboard

The dashboard displays four interactive charts—a bar chart, line chart, scatter plot, and pie chart—built from a Superstore sales dataset. It visualizes metrics like sales by category, order trends over time, and product performance. The visualization uses D3.js v5 for data binding and SVG rendering, with Moment.js for date parsing. A tooltip appears on hover to show detailed values, driven by D3 event handlers. The layout is managed through a CSS grid, and the code imports the `select` function from D3 to manipulate the DOM.

PPLD3508A

79% match

Loading thumbnail…

TD2 - dboard

This dashboard visualizes Superstore sales data across four coordinated SVG plots. A donut chart displays sales by sub-category with hover tooltips, while a scatter plot maps order dates against sales amounts, colored by sub-category. Additional plots include a bar chart and a U.S. map using `d3.geoAlbersUsa` and `d3.geoPath`. Built with Vue and D3 v6, the visualization uses `d3.pie`, `d3.arc`, `d3.scaleTime`, and transitions to animate axes and marks. Data comes from the included `data.csv`, with customer and product details shown on mouseover.

LLauranJade

79% match

Loading thumbnail…

dboard

The dashboard displays sales order data from a CSV file across four grid-based plots, using D3 v5 (d3.select, d3.csv) to load and render SVG charts. Each plot is placed in a separate container with a shared margin, and a tooltip is included for interactions. The Vue framework is also integrated, though the code shown relies on D3's data-binding and SVG rendering to visualize the dataset.

AAnissa Belkelfa

78% match

Loading thumbnail…

TD2

This dashboard presents a multi-panel analysis of a sales dataset, visualizing data through a scatter plot, bar chart, donut chart, and a geographic map. It shows the relationship between order dates and sales figures, with points colored by sub-category to reveal trends. The code uses d3.csv to load data, d3.geoPath with a geoAlbersUsa projection to render U.S. states, and d3.pie for the donut chart. Interactive tooltips appear on hover, while transitions animate axis updates. The visualizations are rendered as SVG elements within a Vue framework.

EElodie31190

77% match