Next
Update
Prev
Default

This sample is to display two data series along the left vertical axis, and to display a data series along the right vertical axis.

The two <verticalAxis> element tags are defined as a child node of the <Line2DSeries> element tag which is drawn along the corresponding vertical axis.

The lastly defined <Line2DSeries> in this layout is drawn along the first vertical axis ( verticalAxis="{vAxis1}" ).

...
<Line2DChart ... >
'''
  <horizontalAxis>
    <CategoryAxis categoryField="Month" padding="0"/>
  </horizontalAxis>
  ...
    <Line2DSeries ... >
      <verticalAxis>
        <LinearAxis id="vAxis1" formatter="{fmt}" interval="300"/>
      </verticalAxis>
      ...
    </Line2DSeries>
    <Line2DSeries ... >
      <verticalAxis>
        <LinearAxis id="vAxis2" formatter="{fmt}"/>
      </verticalAxis>
      ...
    </Line2DSeries>
    <Line2DSeries  verticalAxis="{vAxis1}" ... >
      ...
    </Line2DSeries>  
  ...
  <verticalAxisRenderers>
    <Axis2DRenderer axis="{vAxis1}" placement="left">
      <axisStroke>
        <Stroke color="0xE48701" weight="2">
      </axisStroke>
    </Axis2DRenderer>
    <Axis2DRenderer axis="{vAxis2}" placement="right">
      <axisStroke>
        <Stroke color="0xA5BC4E" weight="2">
      </axisStroke>
    </Axis2DRenderer>
  </verticalAxisRenderers>
...
</Line2DChart>
...

© 2017 KoolChart. All rights reserved.