Worktime

Bar chart

This bar chart shows the distribution of work, stop, and idle time for four different crews, with time plotted on a time-based x-axis and crews on a categorical y-axis. It uses D3.js version 5.11's `scaleTime`, `scaleBand`, and `scaleOrdinal` to map the data, and `axisLeft` and `axisBottom` for rendering the axes. The chart is drawn as an SVG with a green fill for the bars, and the data is loaded from a CSV file via `csv`. The x-axis range is set from November 2016 to February 2017, with a custom tick format function.

79% match

Bar chart

This example shows a bar chart comparing workstation states for four crews, with each crew’s data split across work, stop, and idle segments over a time-scaled horizontal axis. The visualization uses a band scale for categories and a time scale for dates, with ordinal color encoding for the segments. It loads data from a CSV file and renders as static SVG rectangles, though the chart’s axes and tooltips are not fully wired in the provided code. The implementation relies on D3 v5 primitives such as `scaleTime`, `scaleBand`, `scaleOrdinal`, and `csv`.

78% match

Bar chart

This bar chart displays the distribution of work, stop, and idle time for four different crews, with each crew represented by a horizontal bar. The chart uses a time-based x-axis and a categorical y-axis, with green bars showing the population value from the CSV data. The visualization is built with D3.js, using scaleTime for the time axis, scaleBand for positioning the bars, and scaleOrdinal for color mapping, though the bars appear uniformly green due to CSS styling. Data is loaded from a CSV file and rendered as SVG.

Bar chart

This example shows a horizontal timeline of events for different crews, with colored bars marking periods of work, stops, and idle time. The code loads data from a CSV file and uses D3’s `scaleTime`, `scaleBand`, and `scaleOrdinal` to map dates, categories, and colors, while `axisBottom` renders the time axis. The SVG is sized at 960 by 120 pixels, and rectangles are filled with green via CSS, though the visible chart only displays the empty axes scaffolding.

Bar chart

Bar chart

Bar chart

A bar chart displays the relative proportions of work, stop, and idle time for four crews, using horizontal stacked bars. Each crew’s row is composed of three colored segments whose lengths correspond to the numeric values from the CSV data. The visualization uses D3 v5’s `csv`, `scaleLinear`, `scaleBand`, `scaleOrdinal`, `axisLeft`, and `axisBottom` to load the data, position the bars, and render axes in SVG. A static color scale assigns distinct hues to the three activity categories.

76% match

Bar chart

This bar chart displays work, stop, and idle statuses for four crews, with each crew’s data encoded as a single green bar scaled along a time-based x-axis from November 2016 to February 2017. The visualization uses d3.csv to load data, d3.scaleTime for the horizontal axis, d3.scaleBand for vertical positioning, and d3.scaleOrdinal for potential color mapping, though bars are uniformly styled via CSS. SVG rendering in index.html receives the chart through d3 selections and axes, with the dataset split into three columns per crew.