JavaScript Broken Axis Chart Column Chart

VIEW MORE CHARTS
SAVE
VIEW HTML
EDIT ON CODEPEN
A broken axis chart is used when a few data points greatly exceed the others. To create a broken axis chart using KoolChart's JavaScript charting library, the <BrokenAxis> element must be set within the <verticalAxis> (or <horizontalAxis>) element, and the <BrokenAxis2DRenderer> element must be set within the <verticalAxisRenderers> (or <horizontalAxisRenderers>) element. Users need to be aware that a broken axis can be created in the following chart types: Line Chart, Area Chart, Column Chart, Bar Chart.

In this JavaScript chart example, a <BrokenAxis> element is set in a column chart.
<verticalAxis>
<BrokenAxis id="vAxis" brokenMinimum="3000" brokenMaximum="100000" maximum="116000" brokenRatio="0.8" formatter="{numfmt}" />
</verticalAxis>
<verticalAxisRenderers>
<BrokenAxis2DRenderer axis="{vAxis}" />
</verticalAxisRenderers>