Skip to main content
SimilarExport ZIP
100%

Zahlungsbereitschaft

• Draft0🔗 Unlisted
Mmaya.cylkowski@gmail.com
Last edited Jan 16, 2026
Created on Jan 16, 2026

This visualization presents the results of a survey on willingness to pay for Spotify, showing the distribution of 203 participants across six price categories via a bar chart. The bars are color-coded by price range, and hovering over a bar reveals a tooltip with the exact count and percentage. The chart also includes value labels on each bar, a legend, and statistical summaries such as the average willingness to pay. The code uses D3.js v7 for chart rendering with `scaleBand` and `scaleLinear` for axes, while React manages the tooltip state and container dimensions via `useContainerDimensions`.

AI-generated description

Spotify Zahlungsbereitschaft Umfrage

Eine Visualisierung der Umfrageergebnisse zur Zahlungsbereitschaft für Spotify.

Daten

  • 203 Teilnehmer
  • 6 Preiskategorien:
    • Weniger als 10 Euro
    • 10 bis 20 Euro
    • 20 bis 30 Euro
    • 30 bis 40 Euro
    • 40 bis 50 Euro
    • Mehr als 50 Euro

Technologien

  • React 19
  • D3.js für die Visualisierung
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
85% match
Loading thumbnail…

Scatterplot Zahlungsbereitschaft & Preise /

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.

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

Scatterplot Zahlungsbereitschaft

This visualization presents survey responses about how much users would pay monthly for a music streaming subscription, displayed as a bubble chart overlaid on a y-axis of willingness to pay in euros. The React app loads CSV data and uses D3’s `forceSimulation`, `forceX`, `forceY`, and `forceCollide` to position bubbles in rows by amount, with circle sizes scaled to fit the viewport. Users can submit their own amount, which adds a bubble and enables clicking or hovering any bubble to reveal the respondent’s reasoning in an info panel.

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

Fork of Scatterplot Zahlungsbereitschaft

A scatterplot shows survey responses for how much participants would pay for a music streaming subscription, with each bubble positioned along a y-axis of euro amounts and grouped horizontally by identical values. Users enter their own amount, which adds a purple bubble to the chart and reveals an info panel displaying the reasoning behind any hovered or clicked response. Built with React and D3 v7, the visualization uses `d3.forceSimulation` with `forceX`, `forceY`, and `forceCollide` to resolve bubble overlaps, while SVG renders the chart, axis ticks, and interactive elements.

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

Fork of Scatterplot Zahlungsbereitschaft

This interactive scatterplot visualizes survey responses about how much people would pay for a music streaming subscription, with each bubble representing a participant’s maximum monthly amount in euros. Users can enter their own value to add a purple bubble to the chart. Clicking or hovering over any bubble reveals the participant’s written justification in a side panel. Built with React and D3 v7, the visualization uses `d3.forceSimulation` with `forceX`, `forceY`, and `forceCollide` to arrange overlapping bubbles, while SVG circles are rendered dynamically based on container dimensions.

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

Musikstreaming Scatterplot Abopreise

A scatterplot of survey responses visualizes music streaming subscription prices, comparing stated willingness to pay with independent estimates of fair prices. Green bubbles represent reported amounts respondents pay, while yellow bubbles represent their estimated fair prices. Users can enter their own values through forms, which are added as purple bubbles. The visualization uses D3’s `forceSimulation` for bubble positioning, `scaleLinear` for the y-axis, and React/D3 integration via `select` and SVG rendering.

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

Preisverteilung

This visualization shows the distribution of a music streaming subscription price among value-added tax, the platform, artists, and record labels using a vertical Sankey diagram. The flow starts with the subscription price at the top and branches downward, with the artist's share routed straight down and the other shares positioned to alternating sides. Built with D3 v7 and React, the implementation uses cubic Bézier curves to draw the flows and custom node positioning logic, while the ResizeObserver API handles responsive resizing of the SVG.

Mmaya.cylkowski@gmail.com
75% 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
74% match