Tell us what works and what could be better. We read every submission.
@jasminskoenig·5 public vizzes
This example recreates KP Brehmer's "Korrektur der Nationalfarben" as an interactive D3 visualization, showing the proportional wealth distribution across German social classes in 2023. The stacked horizontal rectangles form a stylized national flag, with widths corresponding to each class’s percentage of total wealth. The code uses D3’s `select` and `join` API to dynamically build an SVG container, then binds the dataset to `rect` elements, calculating each bar’s height and y-position cumulatively from the provided percentages.
This visualization recreates KP Brehmer’s “Korrektur der Nationalfarben,” showing the distribution of wealth in Germany for 2023 as a stylized national flag. Three stacked rectangles—black, red, and yellow—represent the middle, lower, and upper classes, with their widths proportional to each group’s share of wealth (36.44%, 2.31%, and 61.25%). The D3.js code uses `select`, `selectAll`, and `join` to construct the SVG, with dynamic `attr` bindings for rectangle positions and sizes, based on hardcoded percentage data.
This example recreates KP Brehmer's "Korrektur der Nationalfarben" as a horizontal stacked bar chart, showing the distribution of wealth in Germany in 2023. Three rectangles, colored black, red, and yellow, represent the middle, lower, and upper classes, with widths proportional to their respective wealth shares. The code uses D3.js’s `select` and `join` methods to build and update the SVG scene, calculating each rectangle’s x-offset cumulatively to form the flag-like composition.
This visualization reimagines KP Brehmer’s flag as a horizontal stacked bar chart, where three colored rectangles represent the percentage of wealth held by the upper, middle, and lower classes in Germany. The code uses `d3.select` and `.join` to create and update an SVG, computing each rectangle’s width from the data percentages and tracking cumulative x-offsets. The implementation relies on D3’s `attr` method to set dimensions and fills, with the German flag colors encoded in the dataset.