robinlecouteur

@robinlecouteur·3 public vizzes

D3 v6 Timeline

This example plots a line chart of temperature readings across five labeled states using Chart.js, with a time-based x-axis and a y-axis fixed between 0 and 30. The chart renders to a canvas element via the Chart constructor, pulling data from an inline dataset. The page integrates D3 v6 for potential data manipulation and Chart.js for the visualization.

Mar 9, 2023

Loading thumbnail…

Fork of Timeline Chart

This example displays a timeline chart that visualizes device activity periods, distinguishing between running and stoppage states through colored horizontal bars. The visualization uses React components with D3 v5 scales, including `scaleBand` for the y-axis categories and `scaleTime` for the x-axis time domain. SVG rectangles render the data intervals, with hover tooltips showing the exact start and end times. The chart includes a color scale that maps device states to blue and red, while the axis components handle tick generation and label truncation for longer device names.

Mar 9, 2023

Loading thumbnail…

Robin's Playground

This example displays a single large message, “Hello HTMdfgsdfgsdfgL!”, centered on the page using CSS. The text is styled with a font-size of 13em and aligned horizontally within the viewport. The visualization relies on plain HTML and CSS, with no JavaScript or external libraries involved. The rendering approach is static, presenting a typographic composition without any interactive or animated elements. No data processing or visualization APIs are used.

Mar 9, 2023