Skip to main content
SimilarExport ZIP
100%

NUR BARS

✓ Published2🌍 Public
Wwdn616@haw-hamburg.de
Last edited Jan 16, 2026
Created on Jan 16, 2026

The visualization compares Spotify Premium subscription prices before and after the 2024/2025 price increase across four plan tiers (Student, Individual, Duo, Family). Two grouped bars per model show the price change, rendered as an SVG using D3 v7’s `scaleBand` and `scaleLinear` scales. Hovering over a bar reveals a tooltip with the exact price via D3 event handlers. The chart is built with React and D3’s `select` and `axisBottom`/`axisLeft` APIs.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

NUR PLATTEN

This dark-themed dashboard displays Spotify Premium subscription price increases from 2024 to 2025 across four plans: Student, Individual, Duo, and Family. Each plan is shown in a card with the absolute euro increase and the percentage change. The React app maps over hardcoded data, computing the difference between “vorher” and “nachher” values, and renders the results in a responsive CSS grid. Styling uses Tailwind-like classes, while no D3 charting functions are invoked.

Wwdn616@haw-hamburg.de
83% match
Loading thumbnail…

Fork of Fork of CV: Loading CSV Data

This example visualizes Spotify Premium subscription price increases from 2024 to 2025, comparing "vorher" and "nachher" prices for four plan types using grouped bar charts rendered as SVG. The chart uses D3 v7 scales, axes, and grid lines within a React framework, with interactive tooltips on hover showing specific prices. Data is hardcoded, and a dark theme with green accents highlights the comparisons, supported by summary statistic cards displaying absolute and percentage increases for each plan.

Wwdn616@haw-hamburg.de
80% match
Loading thumbnail…

Spotify_Vertical Stylized Bar Chart

This interactive visualization explores the distribution of audio features across a Spotify tracks dataset. It displays a vertical, stylized bar chart where each bar represents the count of tracks within a specific numerical bin for a user-selected attribute, such as popularity or danceability. The chart is built with React and D3 v7, using `d3.histogram()` and `scaleLinear` to compute and map the bins. A line overlay charts the average popularity for each bin, while dropdown menus allow users to switch between attributes and adjust the number of bins. The visualization renders as SVG and includes dual axes and a color legend to simultaneously show track counts and average popularity.

Sstephanie0215
71% match
Loading thumbnail…

Spotify Data #HAW

An interactive SVG bar chart visualizes Spotify artists and their albums, sorted by monthly listeners, with each artist bar expanding into individual album rows. Clicking an artist opens an animated info panel displaying their total streams, listener counts, and album details. Built with React 19 and D3.js v7, the visualization uses staggered entry transitions, gradient fills, and hover effects. Data is loaded from a CSV file and processed into a hierarchical artist-album structure before being rendered.

Mmaya.cylkowski@gmail.com
71% match
Loading thumbnail…

Spotify_Vertical Stylized Bar Chart

This visualization uses a Spotify track dataset to show the distribution of audio features and popularity across acoustic tracks. A histogram display counts tracks binned by user-selected attributes (like tempo, energy, or danceability), with bars colored in blue to represent frequency. An orange line overlay traces the average track popularity within each bin, while a small box plot on the right summarizes the overall spread of the selected attribute. The React app uses d3.histogram, scaleLinear, and scaleBand to compute and position marks, with dropdown menus for attribute and bin selection.

Sstephanie0215
71% match
Loading thumbnail…

Bonus ICE 3D Bar Chart

This example shows Netflix subscription price changes from 2016 to 2022 across three tiers—Basic, Standard, and Premium—as a 3D bar chart. The visualization uses the `d3.x3d.chart.barChartMultiSeries()` component to render the multi-series data, with D3 v5 loading the CSV and parsing rows. The chart is displayed within an X3DOM scene, and the bars are sized based on the numeric values from the dataset. Data is fetched from a GitHub Gist containing yearly costs for each plan.

Jjayavamsi
71% match
Loading thumbnail…

Bonus ICE 3D Bar Chart

This example presents Netflix subscription prices for Basic, Standard, and Premium plans from 2016 to 2022 as an interactive 3D bar chart. The visualization uses the `d3.x3d.chart.barChartMultiSeries()` component from the d3-x3d library to render three grouped bars per year, with data loaded from a CSV file via `d3.csv`. The scene is displayed in an X3DOM container, combining D3.js for data parsing and the d3-3d extension for three-dimensional layout, allowing viewers to rotate and explore the price trends across plan tiers.

Jjayavamsi
69% match
Loading thumbnail…

Fork of Fork of Fork of ICE-6 Bar Graph

This bar chart displays Netflix Premium subscription prices across twelve countries, using horizontal bars ranked by cost. Built with React and D3 v5, the visualization loads CSV data via `d3.csv` and renders SVG elements. The code manually constructs axes with `scaleBand` and `scaleLinear`, draws gridlines and labels through `.ticks()`, and maps each country to a colored rectangle. Reusable D3 selection functions like `axisLeft` and `axisBottom` are imported but unused beyond the custom tick rendering.

Vviswak12
69% match