A vertical line Scatter chart

A guide for drawing a vertical line chart. Vertical line charts aren't one of the supported base types of charts - but can be accomplished by using the Scatter chart.

View the bare-bones, stripped-down version of this demo

[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 and Y 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):