A vertical line Scatter chart

Note There's now a better way to produce vertical line charts and that's to use the Horizontal Bar chart. There's quite a few options for it (including a spline mode) and there's a couple of demos for it in the download archive (hbar-vartical-line.html and hbar-vertical-line-multiple.html).

[No canvas support]

Vertical line charts are not supported natively in RGraph however they can be achieved using the Scatter chart. With the Scatter chart, unlike the Line chart, you can specify the X-axis and Y-axis coordinates and a connecting line can be shown as in the example.

Below is the code that's necessary to achieve the vertical line chart. The Y-axis labels are specific and used to show the labels for the chart whilst an X-axis scale is enabled to show the magnitude of values. The maximum values are set manually - so you may want to add code that determines these based on the data - as a normal Line chart would.

Read the comments in the code sample below to find out more information.


This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.scatter.js"></script>
Put this where you want the chart to show up:
<canvas id="cvs" width="400" height="550" style="float: right">
    [No canvas support]
</canvas>
This is the code that generates the chart - it should be placed AFTER the canvas tag(s):