Next
Update
Prev
Default

Three types of zoom are supported in KoolChart. You can zoom in and out along the X-axis, Y-axis or both of the X- and Y-axes.

zoomType = "horizontal"

The <CrossRangeZoomer> element tag is used to add the zoom feature to the chart, and it must be defined as a child node of the <annotationElements> element tag which is a child node of the chart tags, such as <Line2DChart>, <Column2DChart>, etc.

...
<Line2DChart ... >
'''
  <annotationElements>
    <CrossRangeZoomer zoomType="horizontal" horizontalLabelFormatter="{numFmt}" enableZooming="true" backgroundColor="0xeb494a" borderColor="0xeb494a">
      <verticalStroke>
        <Stroke color="0xeb494a"/>
      <verticalStroke>
      <horizontalStroke>
        <Stroke color="0xeb494a"/>
      <horizontalStroke>
    </CrossRangeZoomer>
  </annotationElements>
</Line2DChart>
...
zoomType The zoomType attribute controls which axis can be zoomed in and out. The valid values are "horizontal", "vertical", "both", and the default value is "both".
horizontalLabelFormatter The horizontalLabelFormatter attribute is used to set formatter for the label displayed at the horizontal crosshair line.
enableZooming The enableZooming attribute determines whether or not to use the zoom feature. The default value is "true".
backgroundColor The backgroundColor attribute sets the background color of the label box of crosshair.
borderColor The borderColor attribute sets the border color of the label box of crosshair.

© 2017 KoolChart. All rights reserved.