KM44VW@student.aau.dk

@Jens-Jakob·3 public vizzes

Fork of Stylized Bar Chart

This example visualizes the iris dataset as a stylized scatter plot, displaying each flower’s sepal length and width as a circle. The chart uses D3 v5’s `scaleLinear` and `extent` to compute scales from the data, with axes rendered via custom React components (`AxisBottom`, `AxisLeft`). Tooltips show formatted tick values using `format('.2s')`. The visualization is built with React, uses SVG for rendering, and loads data via `csv` from a GitHub-hosted URL.

May 28, 2024

Loading thumbnail…

Fork of Stylized Scatter Plot

This is a fork of a stylized scatter plot visualizing the Iris Dataset, comparing petal length and sepal width for individual flowers. It renders an SVG chart using React components for the axes and marks, with scales and data loading handled through d3.scaleLinear and d3.csv. The code includes custom styling for axis ticks, labels, and circle marks, plus a tooltip via the native SVG title element.

May 28, 2024

Loading thumbnail…

Fork of Responsive Scatter Plot

This scatter plot visualizes the relationship between bill length and flipper length in penguins, using data from the Palmer Penguins dataset. The visualization dynamically resizes to fit its container using the `observeResize` utility, then renders axes and circles with D3's `scaleLinear`, `axisLeft`, and `extent` functions. The code uses the `@curran/responsive-axes` library to handle axis rendering, while circles are positioned using the x and y scales with adjustable radius and opacity.

May 28, 2024