Broken Axis

by maritavindedal

HTML

<script src="https://code.highcharts.com/highcharts.src.js"></script>
<script src="https://code.highcharts.com/modules/broken-axis.src.js"></script>
<div id="container"></div>

CSS

#container {
    height: 700px;
    width: 1000px;
}

JavaScript

(function (H) {
// override dash style to provide a custom dashes
    H.wrap(
        H.SVGElement.prototype,
        'dashstyleSetter',
        function (proceed, value) {
            if (value === 'EgmGrid') {
                this.element
                    .setAttribute(
                        'stroke-dasharray', '0, 3, 1, 3, 1, 3, 1, 3, 1, 4'
                    );
            } else {
                proceed.apply(this, [].slice.call(arguments, 1));
            }
        });
        
        
    H.Axis.prototype.getMinorTickPositions = function() {
                const axis = this, options = axis.options, tickPositions = axis.tickPositions, minorTickInterval = axis.minorTickInterval, pointRangePadding = axis.pointRangePadding || 0, min = (axis.min || 0) - pointRangePadding, // #1498
                max = (axis.max || 0) + pointRangePadding, // #1498
                // --- Workaround - take correct range for broken axis
                range = axis.brokenAxis ? axis.brokenAxis.unitLength : max - min;
                // ---
                let minorTickPositions = [], pos;
                // If minor ticks get too dense, they are hard to read, and may cause
                // long running script. So we don't draw them.
                if (range && range / minorTickInterval < axis.len / 3) { // #3875
                    const logarithmic = axis.logarithmic;
                    if (logarithmic) {
                        // For each interval in the major ticks, compute the minor ticks
                        // separately.
                        this.paddedTicks.forEach(function (_pos, i, paddedTicks) {
                            if (i) {
                                minorTickPositions.push.apply(minorTickPositions, logarithmic.getLogTickPositions(minorTickInterval, paddedTicks[i - 1], paddedTicks[i], true));
                            }
                        });
                    }
                    else if (axis.dateTime &&
                     ...