Skip to main content
100%

Swimlane using d3.js

✓ Published0🌍 Public
Aamundo
Last edited Apr 2, 2012
Created on Apr 2, 2012

This visualization presents a time-based swimlane chart built with D3 v2, showing project tasks across multiple horizontal lanes. The main chart displays colored rectangles for each item, with green indicating past tasks and gray representing future ones, while a blue vertical line marks today's date. A smaller overview chart below provides a zoomed-out context with a brush for selecting a time range, which updates the main chart's x-axis accordingly. The layout includes two levels of time axes (daily and monthly/weekly labels) and lane labels on the left, with the mini chart enabling navigation and filtering of the detailed view. Data is generated by the randomData.js script, which creates lanes and items with start/end dates, handling overlap by stacking items into sublanes.

AI-generated description

Similar vizzes