Skip to main content
SimilarExport ZIP
100%

Scatterplot Zahlungsbereitschaft & Preise /

✓ Published1🌍 Public
Mmaya.cylkowski@gmail.com
Last edited Jan 29, 2026
Created on Jan 29, 2026

This interactive scatterplot visualizes survey responses on willingness to pay for music streaming subscriptions, comparing each person's stated maximum price with their estimate of the market price. Green bubbles represent actual responses, while yellow bubbles show the corresponding estimations. Users can submit their own value and estimation, which appear as purple points for direct comparison. The visualization uses React with D3.js v7, employing `forceSimulation`, `forceCollide`, and `forceX`/`forceY` for bubble positioning, while horizontal reference lines mark current Spotify subscription tiers.

AI-generated description

Musikstreaming Abo - Visualisierung der Zahlungsbereitschaft

Eine interaktive Visualisierung zur Analyse der Zahlungsbereitschaft für Musikstreaming-Abos basierend auf einer Umfrage.

Features

  • Interaktive Bubble-Chart-Visualisierung mit D3.js
  • Vergleich zwischen tatsächlicher Zahlungsbereitschaft und Schätzungen
  • Benutzereingabe und -vergleich mit aggregierten Daten
  • Responsive Design mit Hover- und Klick-Interaktionen

Technologie

  • React 19
  • D3.js v7
  • CSS für Styling
MIT Licensed

Similar vizzes

Loading thumbnail…

Scatterplot Zahlungsbereitschaft & Preise

This interactive scatterplot visualizes survey responses on willingness to pay for music streaming subscriptions, with each bubble representing an individual's maximum price in euros. Users can submit their own answer, which appears as a distinct purple bubble, and click or hover over bubbles to view accompanying text justifications. The visualization uses d3.forceSimulation with forceX, forceY, and forceCollide to position overlapping bubbles efficiently. A y-axis with tick marks shows the price scale, while blue circles represent participants' estimates of Spotify's actual price. The implementation uses React with D3 v7 and renders SVG elements.

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

Plot

Two mirrored bubble charts compare survey responses about music streaming: the left column shows maximum acceptable monthly price, while the right shows estimated fair price. Each bubble represents one respondent, sized by price value and positioned along a shared y-axis; clicking a bubble highlights the paired response across columns. The visualization uses React to manage state and `d3.forceSimulation` for collision detection, with `d3.scaleLinear` and `d3.scaleSqrt` mapping values to vertical position and radius, and includes value labels rendered as SVG text.

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

Plot Zahlungsbereitschaft und Schätzung

This example displays five circles at fixed x and y coordinates, representing a simple dataset of willingness-to-pay estimates. The visualization uses React to manage the component lifecycle and d3.v7 for DOM selection and data binding, rendering the circles as SVG elements. The code dynamically sizes the SVG to fit its container, then applies the `renderCircles` function to join the data and set each circle’s position and radius of 30 pixels. The visualization is static, with no axes, labels, or interactivity.

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

NUR BARS

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.

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

Spotify_Interactive Polished Scatter Plot with Menus and Colors and Color Legend

This interactive scatter plot visualizes a Spotify song dataset, mapping selected audio features like danceability, energy, and popularity against each other on the X and Y axes. A color legend and dropdown menus allow users to switch the categories and attributes being compared, while hovering over legend items fades unrelated data points. The visualization is built with React and D3 v7, using SVG for rendering, and includes filtering capabilities to narrow the data by a popularity range.

Sstephanie0215
70% match
Loading thumbnail…

Q4

This interactive visualization, part of a multi-chart music data explorer, presents a bubble chart analyzing Spotify artists. It plots each artist's average song popularity on the x-axis against their average valence (musical positivity) on the y-axis, with bubble size representing the total number of tracks per artist. Hovering over a bubble reveals the artist's name and track count via a tooltip. The chart is built with D3.js v4, using `d3.scaleLinear` for axes and bubble radius, `d3.scaleOrdinal` for colors, and loads data from a CSV file. It references other linked bar charts for song genres and artist popularity.

UUmarani Vemula
70% match
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
69% match
Loading thumbnail…

Fork of Mindestlohn Schieberegler

This interactive visualization demonstrates the financial relationship between music streaming counts and income relative to Germany's minimum wage. Users drag a slider to adjust the number of streams from zero to twenty million, with a progress bar and large counter showing the current value. Upon releasing the handle, a revealed bar chart compares the resulting income against the target annual wage of €28,912. The visualization uses React with D3 v7, implementing the slider with `scaleLinear` and `drag`, and displays income calculations in real-time using `Intl.NumberFormat`.

Wwdn616@haw-hamburg.de
69% match