OFC-2 - Dual Y Axes Example

This example demonstrates how to create a chart with both a standard Left Y Axis and a Right Y Axis. The bar plot is using the left Y axis and the line plot is using the right Y axis. All of the code for using the right Y axis with line plots is already included in the development version of OFC2.

I did have to make a minor fix to the right Y axis labels to use the "steps" parameter when creating auto-labels. It was hard coded to 1... I should have caught that when I was working on the formatted Y axis labels patch. I hate to make this a patch but I will for tracking purposes.

This example is NOT compatible with the OFC2-Hyperion release.

Patch Information

ID #2432145 - Y Axis Right Steps Fix

Built with Rev #412 dated 14 December 2008. Patches are uploaded to the SourceForge SVN at OFC2 Patch Tracker

Download a prebuilt SWF and source code on the Downloads page.

As of 15 December 2008:

Y Axis Right Steps Fix has NOT been included in OFC2

Sample Chart

The chart below demonstrates a bar series plotted against the left Y axis and a line series plotted against the right Y axis. The secret to making the line series plot against the right axis is the "axis":"right" parameter in the JSON for the line series:

            { "type":"line_hollow", "colour":"#736AFF", "text":"Avg. wave height (cm)",
              "font-size":10, "width":2,"dot-size":4, "halo-size":0,
              "axis": "right",
              "values":[60, 64,
                        {"value":78, "colour":"#FF0000", "tip":"LINE<br>#val#", 
                         "dot-size":12, "halo-size": 3 },
                        58,50,41,41,36, 32 ]},

In order to make the right Y axis be displayed you need to include the "y_axis_right" object in your JSON:

              "y_axis_right":{"stroke":4, "tick_length":3, "colour":"#d000d0",
                              "grid_colour":"#00ff00", "grid_visible":true,
                              "offset":0, "steps":20, "max":100, "min":0},

Here is a link to view the JSON and finally the chart...