Skip to main content
SimilarExport ZIP
100%

help jin

✓ Published0🌍 Public
BBaptisteJarry
Last edited Nov 30, 2022
Created on Nov 9, 2022
Forked from TP_dataviz Projet

This example visualizes the number of Deezer fans for Rihanna’s albums using an animated bar chart. The bars appear sequentially with a transition, and hovering over them displays a tooltip with the album title and fan count. Data is fetched asynchronously from the Wasabi API via `fetch`, then processed with local ES6 modules. The chart uses D3 v4’s `scaleBand`, `scaleLinear`, `axisBottom`, and `axisLeft`, with buttons included to reorder the bars by ascending or descending fan values.

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…

new

This example visualizes the number of Deezer fans for an artist’s albums as a bar chart, with buttons to reorder the bars by fan count or release date. It loads album data from the Wasabi API and renders animated SVG bars using d3.scaleBand and d3.scaleLinear, with transitions for updates. The chart includes an axis, rotated labels, and a tooltip that shows album title and fan count on hover. Sorting and filtering logic is implemented with custom JavaScript functions.

GGinnWG
78% match
Loading thumbnail…

Try this bar graph of TP_dataviz Projet

This bar graph displays the number of Deezer fans for each album by a specific artist, with bars sorted either by fan count or release date via Ascending and Descending buttons. Built with D3.js v4, it fetches JSON data from the Wasabi API, renders an SVG with animated bar transitions, and includes a tooltip showing album title and fan count on hover. The visualization uses `scaleBand` for the x-axis, `scaleLinear` for the y-axis, and `transition` for smooth updates, demonstrating interactive data sorting and display.

VVikil Lakkavatri
74% match
Loading thumbnail…

TP_dataviz Projet

This example displays the number of Deezer fans for each album by a specific artist as a bar chart. Users can sort the bars in ascending or descending order using two buttons, with transitions animating the updates. The visualization fetches data from the Wasabi I3S API, and uses d3.scaleBand and d3.scaleLinear for the axes. Tooltips appear on mouseover to show album titles and fan counts. The code relies on D3 v4 selections, transitions, and event handling.

GGinnWG
74% match
Loading thumbnail…

Fork of TP_dataviz Projet

This visualization displays the number of Deezer fans for each album by a specific artist, fetched from the Wasabi API. Users can click the Ascending or Descending buttons to reorder the bar chart by fan count or release date. The bars appear sequentially via a staggered transition with `delay`. The code uses D3 v4’s `scaleBand`, `scaleLinear`, `axisBottom`, and `axisLeft` to construct the SVG chart, with data loaded using `csv` and `fetch`.

DDIANJING FAN
73% match
Loading thumbnail…

Fork of TP_dataviz Projet

This example visualizes album data for a specific artist, retrieved from the Wasabi API, as a bar chart showing the number of Deezer fans for each album. Users can sort the bars either by fan count in descending order or by release date in ascending order using the two provided buttons. The visualization is built with D3 v4, featuring SVG rendering with animated transitions, tooltips on mouseover, and scales including `scaleBand` and `scaleLinear` for positioning the bars.

BBaptisteJarry
72% match
Loading thumbnail…

Fork of Fork of Fork of TP_dataviz stacked

This radial bar chart visualizes the frequency of song genres across Rihanna's albums, using data fetched from the Wasabi API. Each colored arc represents a genre, with its length proportional to the number of songs. Hovering reveals the genre name, while clicking displays a pop-up list of matching song titles. A separate timeline chart below plots album release dates, with circles sized by time since release. The visualization is built with D3 v4, using `d3.scaleBand`, `d3.scaleRadial`, `d3.arc`, and SVG rendering, with animations for transitions and interactions.

BBaptisteJarry
71% match
Loading thumbnail…

Fork of TP_dataviz Projet

This bar chart displays the number of Deezer fans for each album by the band Metallica, retrieved from the Wasabi API. Users can click the Ascending and Descending buttons to re-sort the bars by fan count or release date. The visualization uses D3 v4 with SVG and animated transitions, featuring a tooltip that shows album titles and fan numbers on hover. Data loads asynchronously via `fetch` and is processed with `scaleBand` and `scaleLinear` axes.

BBaptisteJarry
71% match
Loading thumbnail…

Histogram TP_dataviz Projet

This example displays a histogram of album titles on the x-axis against their Deezer fan counts on the y-axis, with bars animating into place via a staggered `transition`. The visualization fetches artist data from the Wasabi API, uses D3’s `scaleBand` and `scaleLinear` for axes, and includes interactive tooltips via `mouseover` and `mousemove` events. Two buttons, labeled Ascending and Descending, trigger sorting of the albums by fan count or release date, though the sort logic operates on a pre-fetched list. The SVG rendering is crisp, with bars colored in a muted green.

TToly
70% match