Brush Fork of Liniendiagramm gemeldete Covid-Faelle Berlin

Liniendiagramm gemeldete Covid-Faelle Berlin

The chart displays cumulative reported COVID-19 cases across Berlin’s districts from January 1 to November 9, 2021, using a line with circular markers. It is rendered as SVG via React components, with scales from d3.scaleTime and d3.scaleLinear, and axes built with custom tick components. The line path and circles are generated using d3.line and d3.curveNatural, while hover tooltips use native SVG `<title>` elements. Data is loaded asynchronously from a CSV via d3.csv, and the visualization is based on public Berlin open data.

90% match

Histogramm gemeldete Covid-Faelle Berlin

This interactive histogram visualizes reported COVID-19 cases in Berlin from January 1 to November 9, 2021, using public data from Berlin’s open data portal. It shows the cumulative number of cases per day, with the x-axis representing dates and the y-axis showing reported case counts. The chart is built with React and D3 v5, using `scaleTime` and `scaleLinear` for axes, and renders individual bars as SVG rectangles. The code reads the dataset via D3’s `csv` function and customizes axes and marks with helper components.

87% match

Covid-19 Map with brushable line chart and interatice bubble

This interactive visualization combines a world map of COVID-19 confirmed cases with a brushable line chart, allowing users to filter the map by selecting a date range. The map uses a natural Earth projection with circle sizes scaled by case counts, while the line chart shows daily totals for either the entire world or a hovered country. Built with React and D3 v5, the chart employs `d3.brushX` for selection and `d3.geoPath` for rendering country boundaries from the World Atlas TopoJSON, with data sourced from the CSSEGISandData COVID-19 time series.

SSatorumi

72% match

CoronaVirus multiple view with brush

This interactive visualization combines a geographic bubble map with a time-series histogram to explore global COVID-19 death data. A brush on the histogram filters the map’s circles, which represent cumulative deaths per location. The map uses d3.geoNaturalEarth1 projection and d3.geoPath for landmasses, while the histogram employs d3.scaleTime and d3.histogram for binning. Data is loaded via d3.csv from the CSSEGISandData repository, and the React interface manages the linked brushing state.

AAmir

Fork of Parallel Coordinates with Brushing

This interactive parallel coordinates plot visualizes COVID-19 case data across six quantitative dimensions—total cases, deaths, recovered, active cases, tests, and population—using D3.js in React. Each line represents a country, colored by total deaths, with a cyan-on-navy color scheme and screen blending for overplotting. Users can brush along any axis to filter the data; brushed intervals persist across axes, and the polylines fade smoothly (500ms) to show only rows within all active selections. The visualization supports dynamic brushing interactions, enabling exploratory analysis of multi-dimensional relationships in the dataset.

Wwkj0713@gmail.com

Prototyp

This dashboard prototype demonstrates the integration of four distinct visualizations: a bar chart depicting Berlin district populations from 2005 to 2020, a line chart of cumulative COVID-19 cases with a brushable timeline for filtering, and two scatter plots exploring demographic data (LOR codes and population attributes) and COVID-19 statistics by age group. Built with React and D3 v6, the interactive visualizations feature dropdown menus for attribute selection, color legends with hover filtering, and data loaded from CSV files via `d3.csv`. Each chart component—axes, marks, and legends—is modularized within the React framework, rendered as SVG elements.

Balkendiagramm Einwohner Bezirke Berlin

This interactive bar chart displays the population of Berlin's districts for the year 2020. Built with React and D3 v5, it uses `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the quantitative x-axis, rendering data as SVG rectangles. The chart includes axes with formatted tick labels and a tooltip showing the exact population value. Data is loaded from a CSV file via `d3.csv`, based on statistics from Stadtentwicklung Berlin.