There are occassions when what we need to chart are not linear values over time - as is typical, but instead category data - like the status of a piece of machinery in a manufacturing process over the course of the day. This can be achieved using KX Dashboards with the Canvas Chart component.
Lets start with the data:
Time State 2014-02-24D08:00:11.113000000 Running Off 2014-02-24D08:10:11.894000000 Idle 2014-02-24D08:20:12.565000000 Idle 2014-02-24D09:00:18.114000000 Starting 2014-02-24D10:30:18.620000000 Faulted 2014-02-24D10:40:22.820000000 Stopping 2014-02-24D12:30:24.635000000 Starting 2014-02-24D12:35:25.888000000 Ready 2014-02-24D15:20:37.880000000 Ready 2014-02-24D19:59:45.713000000 Stopping 2014-02-25D08:00:11.113000000 Idle 2014-02-25D09:00:11.894000000 Idle 2014-02-25D10:10:12.565000000 Idle 2014-02-25D11:20:18.114000000 Out of Production 2014-02-25D13:50:18.620000000 Out of Production 2014-02-25D15:00:22.820000000 Starting 2014-02-25D15:10:24.635000000 Ready 2014-02-25D18:00:25.888000000 Starved 2014-02-25D18:05:37.880000000 Blocked 2014-02-25D18:10:45.713000000 Stopping
Add a Canvas Chart and start by defining the layer; here, X-Axis Data is going to be State, and a _Y-Axis Data _is going to be Time.
Next, we set our X-Axes to use category data, and the Y-Axes to use time data.
We then need to flip the chart, so our time data is along the bottom of the chart. We do this by checking the _Transpose _option in the Basics property. Our x-axis and y-axis have been reversed for display, but x-axis is still Time and our y-axis is still State as we continue to configure the chart.
This still leaves our charted states as duplicated values. We can elminate this by checking the _Filter Unique _property in our X-Axes Labels.
We now have the core of our chart. We can start the tidy up by making the Line chart a stepped chart; In the _Interpolation _of the Line Layer, select Stepped from the dropdown.
Our line is still quite feint, so we can improve this by changing the _Border Width _to 3 in _Layer Basics _and in Layer Points, changing the _Radius _property to 5. _Name _the layer, “Status”
Next, we tidy the Y-axis (which is actually our x-axis!). We want to set the _Time __Format _to use _Force Time Unit _of hour. Then for the _Hour _property, set the value to hh:00. In the _Y Axis 1, Labels - _check the _Offset _property to move the edge values off the axis.
Nice to have is a day label. To do this, we create a copy of our existing Layer; just adding a new _Layer _will automatically do this for us.
Then disable its display
However, we do add a second y-axis which we will use for this (now hidden) layer. Create a second Y-axis, and set the format to use time.
Set the_Time Format, Force Time Unit_ of _Y-Axis _2 to use day.
Now we go back to the copied Layer (“Status 1”), and set the _Y-axis ID _to use our newly created Y-Axis 2
This will give us our second label for the axis showing the day, “Feb 25”.
As a final touch, I like to add a highlight rule for when the status is Faulted. We do this from our initial layer.
Our final chart, now looks like this.
Happy charting!