Peter Prevos

@pprevos·2 public vizzes

Fork of Sol LeWitt Reproduction with D3

This example reproduces a Sol LeWitt art piece using D3.js version 6 and SVG rendering. The visualization shows a grid of horizontal and vertical rectangles, with two circular masks creating a layered geometric pattern where the lines alternate visibility. The code employs `d3.select`, `d3.range`, and the `join` method to generate 100 rect elements for each orientation. SVG masks—defined with distinct IDs and circles of white and black fills—control which line segments appear within the overlapping circular regions.

Jan 13, 2024

Loading thumbnail…

Fork of Temperature in San Francisco Line Chart

This line chart displays one week of temperature data in San Francisco, sourced from Data Canvas - Sense Your City. The visualization uses D3 v5 to render an SVG with time-scaled x-axis and linear y-axis, employing `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and a `line` generator with `curveBasis` smoothing. Gridlines are drawn via tick sizes while axis labels and a title are appended as SVG text elements. Data is loaded from an external CSV and parsed for temperature and timestamp values.

Jan 13, 2024