highcharts-rails 5.0.14 → 6.0.0

data/app/assets/javascripts/highcharts/modules/accessibility.js

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v5.0.14 (2017-07-28)
+ * @license Highcharts JS v6.0.0 (2017-10-04)
  * Accessibility module
  *
  * (c) 2010-2017 Highsoft AS
@@ -24,6 +24,7 @@
          *
          * License: www.highcharts.com/license
          */
+        /* eslint max-len: ["warn", 80, 4] */
 
         var win = H.win,
             doc = win.document,
@@ -34,7 +35,18 @@
             fireEvent = H.fireEvent,
             dateFormat = H.dateFormat,
             merge = H.merge,
-            // Human readable description of series and each point in singular and plural
+            // CSS style to hide element from visual users while still exposing it to
+            // screen readers
+            hiddenStyle = {
+                position: 'absolute',
+                left: '-9999px',
+                top: 'auto',
+                width: '1px',
+                height: '1px',
+                overflow: 'hidden'
+            },
+            // Human readable description of series and each point in singular and
+            // plural
             typeToSeriesMap = {
                 'default': ['series', 'data point', 'data points'],
                 'line': ['line', 'data point', 'data points'],
@@ -47,7 +59,11 @@
                 'scatter': ['scatter series', 'data point', 'data points'],
                 'boxplot': ['boxplot series', 'box', 'boxes'],
                 'arearange': ['arearange series', 'data point', 'data points'],
-                'areasplinerange': ['areasplinerange series', 'data point', 'data points'],
+                'areasplinerange': [
+                    'areasplinerange series',
+                    'data point',
+                    'data points'
+                ],
                 'bubble': ['bubble series', 'bubble', 'bubbles'],
                 'columnrange': ['columnrange series', 'column', 'columns'],
                 'errorbar': ['errorbar series', 'errorbar', 'errorbars'],
@@ -61,16 +77,26 @@
             },
             // Descriptions for exotic chart types
             typeDescriptionMap = {
-                boxplot: ' Box plot charts are typically used to display groups of statistical data. ' +
-                    'Each data point in the chart can have up to 5 values: minimum, lower quartile, median, upper quartile and maximum. ',
-                arearange: ' Arearange charts are line charts displaying a range between a lower and higher value for each point. ',
-                areasplinerange: ' These charts are line charts displaying a range between a lower and higher value for each point. ',
-                bubble: ' Bubble charts are scatter charts where each data point also has a size value. ',
-                columnrange: ' Columnrange charts are column charts displaying a range between a lower and higher value for each point. ',
-                errorbar: ' Errorbar series are used to display the variability of the data. ',
-                funnel: ' Funnel charts are used to display reduction of data in stages. ',
-                pyramid: ' Pyramid charts consist of a single pyramid with item heights corresponding to each point value. ',
-                waterfall: ' A waterfall chart is a column chart where each column contributes towards a total end value. '
+                boxplot: ' Box plot charts are typically used to display groups of ' +
+                    'statistical data. Each data point in the chart can have up to 5 ' +
+                    'values: minimum, lower quartile, median, upper quartile and ' +
+                    'maximum. ',
+                arearange: ' Arearange charts are line charts displaying a range ' +
+                    'between a lower and higher value for each point. ',
+                areasplinerange: ' These charts are line charts displaying a range ' +
+                    'between a lower and higher value for each point. ',
+                bubble: ' Bubble charts are scatter charts where each data point ' +
+                    'also has a size value. ',
+                columnrange: ' Columnrange charts are column charts displaying a ' +
+                    'range between a lower and higher value for each point. ',
+                errorbar: ' Errorbar series are used to display the variability of ' +
+                    'the data. ',
+                funnel: ' Funnel charts are used to display reduction of data in ' +
+                    'stages. ',
+                pyramid: ' Pyramid charts consist of a single pyramid with item ' +
+                    'heights corresponding to each point value. ',
+                waterfall: ' A waterfall chart is a column chart where each column ' +
+                    'contributes towards a total end value. '
             };
 
         // If a point has one of the special keys defined, we expose all keys to the
@@ -85,6 +111,15 @@
             H.seriesTypes.pie.prototype.specialKeys = [];
         }
 
+        // Set for which series types it makes sense to move to the closest point with
+        // up/down arrows, and which series types should just move to next series.
+        H.Series.prototype.keyboardMoveVertical = true;
+        each(['column', 'pie'], function(type) {
+            if (H.seriesTypes[type]) {
+                H.seriesTypes[type].prototype.keyboardMoveVertical = false;
+            }
+        });
+
 
         /**
          * Accessibility options
@@ -101,7 +136,6 @@
              * com/docs/chart-concepts/accessibility).
              * 
              * @since 5.0.0
-             * @product highcharts highstock highmaps
              */
             accessibility: {
 
@@ -111,7 +145,6 @@
                  * @type {Boolean}
                  * @default true
                  * @since 5.0.0
-                 * @product highcharts highstock highmaps
                  */
                 enabled: true,
 
@@ -124,7 +157,6 @@
                  * @type {Number|Boolean}
                  * @default 30
                  * @since 5.0.0
-                 * @product highcharts highstock highmaps
                  */
                 pointDescriptionThreshold: 30, // set to false to disable
 
@@ -133,7 +165,6 @@
                  * 
                  * @type {Object}
                  * @since 5.0.0
-                 * @product highcharts highstock highmaps
                  */
                 keyboardNavigation: {
 
@@ -144,17 +175,7 @@
                      * @default true
                      * @since 5.0.0
                      */
-                    enabled: true,
-
-                    /**
-                     * Enable tab navigation for points. Without this, only arrow keys
-                     * can be used to navigate between points.
-                     * 
-                     * @type {Boolean}
-                     * @default {all} true
-                     * @since next
-                     */
-                    tabThroughPoints: true
+                    enabled: true
 
                     /**
                      * Skip null points when navigating through points with the
@@ -174,7 +195,6 @@
                  * @type {Boolean}
                  * @default false
                  * @since 5.0.0
-                 * @product highcharts highstock highmaps
                  * @apioption accessibility.describeSingleSeries
                  */
 
@@ -196,8 +216,8 @@
                  * 
                  * Defaults to the same format as in tooltip.
                  * 
-                 * For an overview of the replacement codes, see [dateFormat](
-                 * #Highcharts.dateFormat).
+                 * For an overview of the replacement codes, see
+                 * [dateFormat](#Highcharts.dateFormat).
                  * 
                  * @type {String}
                  * @see [pointDateFormatter](#accessibility.pointDateFormatter)
@@ -206,11 +226,11 @@
                  */
 
                 /**
-                 * Formatter function to determine the date/time format used with points
-                 * on datetime axes when describing them to screen reader users. Receives
-                 * one argument, `point`, referring to the point to describe. Should
-                 * return a date format string compatible with [dateFormat](#Highcharts.
-                 * dateFormat).
+                 * Formatter function to determine the date/time format used with
+                 * points on datetime axes when describing them to screen reader users.
+                 * Receives one argument, `point`, referring to the point to describe.
+                 * Should return a date format string compatible with
+                 * [dateFormat](#Highcharts.dateFormat).
                  * 
                  * @type {Function}
                  * @see [pointDateFormat](#accessibility.pointDateFormat)
@@ -219,13 +239,14 @@
                  */
 
                 /**
-                 * Formatter function to use instead of the default for point descriptions.
+                 * Formatter function to use instead of the default for point
+                 * descriptions.
                  * Receives one argument, `point`, referring to the point to describe.
                  * Should return a String with the description of the point for a screen
                  * reader user.
                  * 
                  * @type {Function}
-                 * @see [point.description](#series<line>.data.description)
+                 * @see [point.description](#series.line.data.description)
                  * @since 5.0.0
                  * @apioption accessibility.pointDescriptionFormatter
                  */
@@ -236,8 +257,8 @@
                  * to the chart object. Should return a String with the HTML content
                  * of the region.
                  * 
-                 * The link to view the chart as a data table will be added automatically
-                 * after the custom HTML content.
+                 * The link to view the chart as a data table will be added
+                 * automatically after the custom HTML content.
                  * 
                  * @type {Function}
                  * @default undefined
@@ -246,10 +267,10 @@
                  */
 
                 /**
-                 * Formatter function to use instead of the default for series descriptions.
-                 * Receives one argument, `series`, referring to the series to describe.
-                 * Should return a String with the description of the series for a
-                 * screen reader user.
+                 * Formatter function to use instead of the default for series
+                 * descriptions. Receives one argument, `series`, referring to the
+                 * series to describe. Should return a String with the description of
+                 * the series for a screen reader user.
                  * 
                  * @type {Function}
                  * @see [series.description](#plotOptions.series.description)
@@ -290,6 +311,24 @@
          * @apioption chart.typeDescription
          */
 
+        /**
+         * Keyboard navigation for the legend. Requires the Accessibility module.
+         * @since 5.0.14
+         * @apioption legend.keyboardNavigation
+         */
+
+        /**
+         * Enable/disable keyboard navigation for the legend. Requires the Accessibility
+         * module.
+         * 
+         * @type {Boolean}
+         * @see [accessibility.keyboardNavigation](#accessibility.keyboardNavigation.
+         * enabled)
+         * @default true
+         * @since 5.0.13
+         * @apioption legend.keyboardNavigation.enabled
+         */
+
         /**
          * HTML encode some characters vulnerable for XSS.
          * @param  {string} html The input string
@@ -323,6 +362,43 @@
             }
         }
 
+        // Determine if a point should be skipped
+        function isSkipPoint(point) {
+            return point.isNull &&
+                point.series.chart.options.accessibility
+                .keyboardNavigation.skipNullPoints ||
+                point.series.options.skipKeyboardNavigation ||
+                !point.series.visible;
+        }
+
+        // Get the point in a series that is closest to a reference point
+        // Optionally supply weight factors for x and y directions
+        function getClosestPoint(point, series, xWeight, yWeight) {
+            var minDistance = Infinity,
+                dPoint,
+                minIx,
+                distance,
+                i = series.points.length;
+            if (point.plotX === undefined || point.plotY === undefined) {
+                return;
+            }
+            while (i--) {
+                dPoint = series.points[i];
+                if (dPoint.plotX === undefined || dPoint.plotY === undefined) {
+                    return;
+                }
+                distance = (point.plotX - dPoint.plotX) *
+                    (point.plotX - dPoint.plotX) * (xWeight || 1) +
+                    (point.plotY - dPoint.plotY) *
+                    (point.plotY - dPoint.plotY) * (yWeight || 1);
+                if (distance < minDistance) {
+                    minDistance = distance;
+                    minIx = i;
+                }
+            }
+            return series.points[minIx || 0];
+        }
+
         // Whenever drawing series, put info on DOM elements
         H.wrap(H.Series.prototype, 'render', function(proceed) {
             proceed.apply(this, Array.prototype.slice.call(arguments, 1));
@@ -334,17 +410,35 @@
         // Put accessible info on series and points of a series
         H.Series.prototype.setA11yDescription = function() {
             var a11yOptions = this.chart.options.accessibility,
-                firstPointEl = this.points && this.points.length && this.points[0].graphic && this.points[0].graphic.element,
-                seriesEl = firstPointEl && firstPointEl.parentNode || this.graph && this.graph.element || this.group && this.group.element; // Could be tracker series depending on series type
+                firstPointEl = (
+                    this.points &&
+                    this.points.length &&
+                    this.points[0].graphic &&
+                    this.points[0].graphic.element
+                ),
+                seriesEl = (
+                    firstPointEl &&
+                    firstPointEl.parentNode || this.graph &&
+                    this.graph.element || this.group &&
+                    this.group.element
+                ); // Could be tracker series depending on series type
 
             if (seriesEl) {
-                // For some series types the order of elements do not match the order of points in series
-                // In that case we have to reverse them in order for AT to read them out in an understandable order
+                // For some series types the order of elements do not match the order of
+                // points in series. In that case we have to reverse them in order for
+                // AT to read them out in an understandable order
                 if (seriesEl.lastChild === firstPointEl) {
                     reverseChildNodes(seriesEl);
                 }
-                // Make individual point elements accessible if possible. Note: If markers are disabled there might not be any elements there to make accessible.
-                if (this.points && (this.points.length < a11yOptions.pointDescriptionThreshold || a11yOptions.pointDescriptionThreshold === false)) {
+                // Make individual point elements accessible if possible. Note: If
+                // markers are disabled there might not be any elements there to make
+                // accessible.
+                if (
+                    this.points && (
+                        this.points.length < a11yOptions.pointDescriptionThreshold ||
+                        a11yOptions.pointDescriptionThreshold === false
+                    )
+                ) {
                     each(this.points, function(point) {
                         if (point.graphic) {
                             point.graphic.element.setAttribute('role', 'img');
@@ -365,23 +459,46 @@
                         this.options.exposeElementToA11y ? 'img' : 'region'
                     );
                     seriesEl.setAttribute('tabindex', '-1');
-                    seriesEl.setAttribute('aria-label', a11yOptions.seriesDescriptionFormatter && a11yOptions.seriesDescriptionFormatter(this) ||
-                        this.buildSeriesInfoString());
+                    seriesEl.setAttribute(
+                        'aria-label',
+                        a11yOptions.seriesDescriptionFormatter &&
+                        a11yOptions.seriesDescriptionFormatter(this) ||
+                        this.buildSeriesInfoString()
+                    );
                 }
             }
         };
 
         // Return string with information about series
         H.Series.prototype.buildSeriesInfoString = function() {
-            var typeInfo = typeToSeriesMap[this.type] || typeToSeriesMap['default'], // eslint-disable-line dot-notation
+            var typeInfo = (
+                    typeToSeriesMap[this.type] ||
+                    typeToSeriesMap['default'] // eslint-disable-line dot-notation
+                ),
                 description = this.description || this.options.description;
             return (this.name ? this.name + ', ' : '') +
-                (this.chart.types.length === 1 ? typeInfo[0] : 'series') + ' ' + (this.index + 1) + ' of ' + (this.chart.series.length) +
-                (this.chart.types.length === 1 ? ' with ' : '. ' + typeInfo[0] + ' with ') +
-                (this.points.length + ' ' + (this.points.length === 1 ? typeInfo[1] : typeInfo[2])) +
+                (this.chart.types.length === 1 ? typeInfo[0] : 'series') +
+                ' ' + (this.index + 1) + ' of ' + (this.chart.series.length) +
+                (
+                    this.chart.types.length === 1 ?
+                    ' with ' :
+                    '. ' + typeInfo[0] + ' with '
+                ) +
+                (
+                    this.points.length + ' ' +
+                    (this.points.length === 1 ? typeInfo[1] : typeInfo[2])
+                ) +
                 (description ? '. ' + description : '') +
-                (this.chart.yAxis.length > 1 && this.yAxis ? '. Y axis, ' + this.yAxis.getDescription() : '') +
-                (this.chart.xAxis.length > 1 && this.xAxis ? '. X axis, ' + this.xAxis.getDescription() : '');
+                (
+                    this.chart.yAxis.length > 1 && this.yAxis ?
+                    '. Y axis, ' + this.yAxis.getDescription() :
+                    ''
+                ) +
+                (
+                    this.chart.xAxis.length > 1 && this.xAxis ?
+                    '. X axis, ' + this.xAxis.getDescription() :
+                    ''
+                );
         };
 
         // Return string with information about point
@@ -391,38 +508,66 @@
                 a11yOptions = series.chart.options.accessibility,
                 infoString = '',
                 dateTimePoint = series.xAxis && series.xAxis.isDatetimeAxis,
-                timeDesc = dateTimePoint && dateFormat(a11yOptions.pointDateFormatter && a11yOptions.pointDateFormatter(point) || a11yOptions.pointDateFormat ||
-                    H.Tooltip.prototype.getXDateFormat(point, series.chart.options.tooltip, series.xAxis), point.x),
+                timeDesc =
+                dateTimePoint &&
+                dateFormat(
+                    a11yOptions.pointDateFormatter &&
+                    a11yOptions.pointDateFormatter(point) ||
+                    a11yOptions.pointDateFormat ||
+                    H.Tooltip.prototype.getXDateFormat(
+                        point,
+                        series.chart.options.tooltip,
+                        series.xAxis
+                    ),
+                    point.x
+                ),
                 hasSpecialKey = H.find(series.specialKeys, function(key) {
                     return point[key] !== undefined;
                 });
 
-            // If the point has one of the less common properties defined, display all that are defined
+            // If the point has one of the less common properties defined, display all
+            // that are defined
             if (hasSpecialKey) {
                 if (dateTimePoint) {
                     infoString = timeDesc;
                 }
                 each(series.commonKeys.concat(series.specialKeys), function(key) {
                     if (point[key] !== undefined && !(dateTimePoint && key === 'x')) {
-                        infoString += (infoString ? '. ' : '') + key + ', ' + point[key];
+                        infoString += (infoString ? '. ' : '') +
+                            key + ', ' +
+                            point[key];
                     }
                 });
             } else {
                 // Pick and choose properties for a succint label
-                infoString = (this.name || timeDesc || this.category || this.id || 'x, ' + this.x) + ', ' +
+                infoString =
+                    (
+                        this.name ||
+                        timeDesc ||
+                        this.category ||
+                        this.id ||
+                        'x, ' + this.x
+                    ) + ', ' +
                     (this.value !== undefined ? this.value : this.y);
             }
 
-            return (this.index + 1) + '. ' + infoString + '.' + (this.description ? ' ' + this.description : '');
+            return (this.index + 1) + '. ' + infoString + '.' +
+                (this.description ? ' ' + this.description : '');
         };
 
         // Get descriptive label for axis
         H.Axis.prototype.getDescription = function() {
-            return this.userOptions && this.userOptions.description || this.axisTitle && this.axisTitle.textStr ||
-                this.options.id || this.categories && 'categories' || 'values';
+            return (
+                this.userOptions && this.userOptions.description ||
+                this.axisTitle && this.axisTitle.textStr ||
+                this.options.id ||
+                this.categories && 'categories' ||
+                'values'
+            );
         };
 
-        // Pan along axis in a direction (1 or -1), optionally with a defined granularity (number of steps it takes to walk across current view)
+        // Pan along axis in a direction (1 or -1), optionally with a defined
+        // granularity (number of steps it takes to walk across current view)
         H.Axis.prototype.panStep = function(direction, granularity) {
             var gran = granularity || 3,
                 extremes = this.getExtremes(),
@@ -456,9 +601,13 @@
                     var removedSeries = this,
                         hasType = false;
 
-                    // Check if any of the other series have the same type as this one. Otherwise remove it from the list.
+                    // Check if any of the other series have the same type as this one.
+                    // Otherwise remove it from the list.
                     each(chart.series, function(s) {
-                        if (s !== removedSeries && chart.types.indexOf(removedSeries.type) < 0) {
+                        if (
+                            s !== removedSeries &&
+                            chart.types.indexOf(removedSeries.type) < 0
+                        ) {
                             hasType = true;
                         }
                     });
@@ -469,7 +618,8 @@
             }
         });
 
-        // Return simplified description of chart type. Some types will not be familiar to most screen reader users, but we try.
+        // Return simplified description of chart type. Some types will not be familiar
+        // to most screen reader users, but we try.
         H.Chart.prototype.getTypeDescription = function() {
             var firstType = this.types && this.types[0],
                 mapTitle = this.series[0] && this.series[0].mapTitle;
@@ -493,7 +643,8 @@
                 i;
 
             if (numXAxes) {
-                desc.xAxis = 'The chart has ' + numXAxes + (numXAxes > 1 ? ' X axes' : ' X axis') + ' displaying ';
+                desc.xAxis = 'The chart has ' + numXAxes +
+                    (numXAxes > 1 ? ' X axes' : ' X axis') + ' displaying ';
                 if (numXAxes < 2) {
                     desc.xAxis += this.xAxis[0].getDescription() + '.';
                 } else {
@@ -505,7 +656,8 @@
             }
 
             if (numYAxes) {
-                desc.yAxis = 'The chart has ' + numYAxes + (numYAxes > 1 ? ' Y axes' : ' Y axis') + ' displaying ';
+                desc.yAxis = 'The chart has ' + numYAxes +
+                    (numYAxes > 1 ? ' Y axes' : ' Y axis') + ' displaying ';
                 if (numYAxes < 2) {
                     desc.yAxis += this.yAxis[0].getDescription() + '.';
                 } else {
@@ -538,7 +690,8 @@
             }
         };
 
-        // Highlight a point (show tooltip and display hover state). Returns the highlighted point.
+        // Highlight a point (show tooltip and display hover state). Returns the
+        // highlighted point.
         H.Point.prototype.highlight = function() {
             var chart = this.series.chart;
             if (this.graphic && this.graphic.element.focus) {
@@ -574,12 +727,6 @@
                 lastSeries.points[lastSeries.points.length - 1],
                 newSeries,
                 newPoint,
-                isSkipPoint = function(point) {
-                    return point.isNull &&
-                        chart.options.accessibility.keyboardNavigation.skipNullPoints ||
-                        point.series.options.skipKeyboardNavigation ||
-                        !point.series.visible;
-                },
                 // Handle connecting ends - where the points array has an extra last
                 // point that is a reference to the first one. We skip this.
                 forwardSkipAmount = curPoint && curPoint.series.connectEnds &&
@@ -632,6 +779,123 @@
             return newPoint.highlight();
         };
 
+        // Highlight first valid point in a series. Returns the point if successfully
+        // highlighted, otherwise false. If there is a highlighted point in the series,
+        // use that as starting point.
+        H.Series.prototype.highlightFirstValidPoint = function() {
+            var curPoint = this.chart.highlightedPoint,
+                start = curPoint.series === this ? curPoint.index : 0,
+                points = this.points;
+
+            for (var i = start, len = points.length; i < len; ++i) {
+                if (!isSkipPoint(points[i])) {
+                    return points[i].highlight();
+                }
+            }
+            for (var j = start; j >= 0; --j) {
+                if (!isSkipPoint(points[j])) {
+                    return points[j].highlight();
+                }
+            }
+            return false;
+        };
+
+        // Highlight next/previous series in chart. Returns false if no adjacent series
+        // in the direction, otherwise returns new highlighted point.
+        H.Chart.prototype.highlightAdjacentSeries = function(down) {
+            var chart = this,
+                newSeries,
+                newPoint,
+                adjacentNewPoint,
+                curPoint = chart.highlightedPoint,
+                lastSeries = chart.series && chart.series[chart.series.length - 1],
+                lastPoint = lastSeries && lastSeries.points &&
+                lastSeries.points[lastSeries.points.length - 1];
+
+            // If no point is highlighted, highlight the first/last point
+            if (!chart.highlightedPoint) {
+                newSeries = down ? (chart.series && chart.series[0]) : lastSeries;
+                newPoint = down ?
+                    (newSeries && newSeries.points && newSeries.points[0]) : lastPoint;
+                return newPoint ? newPoint.highlight() : false;
+            }
+
+            newSeries = chart.series[curPoint.series.index + (down ? -1 : 1)];
+
+            if (!newSeries) {
+                return false;
+            }
+
+            // We have a new series in this direction, find the right point
+            // Weigh xDistance as counting much higher than Y distance
+            newPoint = getClosestPoint(curPoint, newSeries, 4);
+
+            if (!newPoint) {
+                return false;
+            }
+
+            // New series and point exists, but we might want to skip it
+            if (!newSeries.visible) {
+                // Skip the series
+                newPoint.highlight();
+                adjacentNewPoint = chart.highlightAdjacentSeries(down); // Try recurse
+                if (!adjacentNewPoint) {
+                    // Recurse failed
+                    curPoint.highlight();
+                    return false;
+                }
+                // Recurse succeeded
+                return adjacentNewPoint;
+            }
+
+            // Highlight the new point or any first valid point back or forwards from it
+            newPoint.highlight();
+            return newPoint.series.highlightFirstValidPoint();
+        };
+
+        // Highlight the closest point vertically
+        H.Chart.prototype.highlightAdjacentPointVertical = function(down) {
+            var curPoint = this.highlightedPoint,
+                minDistance = Infinity,
+                bestPoint;
+
+            if (curPoint.plotX === undefined || curPoint.plotY === undefined) {
+                return false;
+            }
+            each(this.series, function(series) {
+                each(series.points, function(point) {
+                    if (point.plotY === undefined || point.plotX === undefined ||
+                        point === curPoint) {
+                        return;
+                    }
+                    var yDistance = point.plotY - curPoint.plotY,
+                        width = Math.abs(point.plotX - curPoint.plotX),
+                        distance = Math.abs(yDistance) * Math.abs(yDistance) +
+                        width * width * 4; // Weigh horizontal distance highly
+
+                    // Reverse distance number if axis is reversed
+                    if (series.yAxis.reversed) {
+                        yDistance *= -1;
+                    }
+
+                    if (
+                        yDistance < 0 && down || yDistance > 0 && !down || // Wrong dir
+                        distance < 5 || // Points in same spot => infinite loop
+                        isSkipPoint(point)
+                    ) {
+                        return;
+                    }
+
+                    if (distance < minDistance) {
+                        minDistance = distance;
+                        bestPoint = point;
+                    }
+                });
+            });
+
+            return bestPoint ? bestPoint.highlight() : false;
+        };
+
         // Show the export menu and focus the first item (if exists)
         H.Chart.prototype.showExportMenu = function() {
             if (this.exportSVGElements && this.exportSVGElements[0]) {
@@ -643,9 +907,15 @@
         // Highlight export menu item by index
         H.Chart.prototype.highlightExportItem = function(ix) {
             var listItem = this.exportDivElements && this.exportDivElements[ix],
-                curHighlighted = this.exportDivElements && this.exportDivElements[this.highlightedExportItem];
+                curHighlighted =
+                this.exportDivElements &&
+                this.exportDivElements[this.highlightedExportItem];
 
-            if (listItem && listItem.tagName === 'DIV' && !(listItem.children && listItem.children.length)) {
+            if (
+                listItem &&
+                listItem.tagName === 'DIV' &&
+                !(listItem.children && listItem.children.length)
+            ) {
                 if (listItem.focus) {
                     listItem.focus();
                 }
@@ -665,7 +935,9 @@
             var buttons = this.rangeSelector.buttons;
             // Deselect old
             if (buttons[this.highlightedRangeSelectorItemIx]) {
-                buttons[this.highlightedRangeSelectorItemIx].setState(this.oldRangeSelectorItemState || 0);
+                buttons[this.highlightedRangeSelectorItemIx].setState(
+                    this.oldRangeSelectorItemState || 0
+                );
             }
             // Select new
             this.highlightedRangeSelectorItemIx = ix;
@@ -684,7 +956,10 @@
         H.Chart.prototype.highlightLegendItem = function(ix) {
             var items = this.legend.allItems;
             if (items[this.highlightedLegendItemIx]) {
-                fireEvent(items[this.highlightedLegendItemIx].legendGroup.element, 'mouseout');
+                fireEvent(
+                    items[this.highlightedLegendItemIx].legendGroup.element,
+                    'mouseout'
+                );
             }
             this.highlightedLegendItemIx = ix;
             if (items[ix]) {
@@ -704,7 +979,10 @@
                 each(exportList, function(el) {
                     fireEvent(el, 'mouseleave');
                 });
-                if (exportList[this.highlightedExportItem] && exportList[this.highlightedExportItem].onmouseout) {
+                if (
+                    exportList[this.highlightedExportItem] &&
+                    exportList[this.highlightedExportItem].onmouseout
+                ) {
                     exportList[this.highlightedExportItem].onmouseout();
                 }
                 this.highlightedExportItem = 0;
@@ -716,12 +994,13 @@
         H.Chart.prototype.addKeyboardNavEvents = function() {
             var chart = this;
 
-            // Abstraction layer for keyboard navigation. Keep a map of keyCodes to handler functions, and a next/prev move handler for tab order.
-            // The module's keyCode handlers determine when to move to another module.
-            // Validate holds a function to determine if there are prerequisites for this module to run that are not met.
-            // Init holds a function to run once before any keyCodes are interpreted.
-            // Terminate holds a function to run once before moving to next/prev module.
-            // transformTabs determines whether to transform tabs to left/right events or not. Defaults to true.
+            // Abstraction layer for keyboard navigation. Keep a map of keyCodes to
+            // handler functions, and a next/prev move handler for tab order. The
+            // module's keyCode handlers determine when to move to another module.
+            // Validate holds a function to determine if there are prerequisites for
+            // this module to run that are not met. Init holds a function to run once
+            // before any keyCodes are interpreted. Terminate holds a function to run
+            // once before moving to next/prev module.
             function KeyboardNavigationModule(options) {
                 this.id = options.id;
                 this.keyCodeMap = options.keyCodeMap;
@@ -729,36 +1008,47 @@
                 this.validate = options.validate;
                 this.init = options.init;
                 this.terminate = options.terminate;
-                this.transformTabs = options.transformTabs !== false;
             }
             KeyboardNavigationModule.prototype = {
                 // Find handler function(s) for key code in the keyCodeMap and run it.
                 run: function(e) {
                     var navModule = this,
                         keyCode = e.which || e.keyCode,
+                        found = false,
                         handled = false;
-                    keyCode = this.transformTabs && keyCode === 9 ? (e.shiftKey ? 37 : 39) : keyCode; // Transform tabs
                     each(this.keyCodeMap, function(codeSet) {
                         if (codeSet[0].indexOf(keyCode) > -1) {
-                            handled = codeSet[1].call(navModule, keyCode, e) === false ? false : true; // If explicitly returning false, we haven't handled it
+                            found = true;
+                            handled = codeSet[1].call(navModule, keyCode, e) === false ?
+                                // If explicitly returning false, we haven't handled it
+                                false :
+                                true;
                         }
                     });
+                    // Default tab handler, move to next/prev module
+                    if (!found && keyCode === 9) {
+                        handled = this.move(e.shiftKey ? -1 : 1);
+                    }
                     return handled;
                 }
             };
-            // Maintain abstraction between KeyboardNavigationModule and Highcharts
-            // The chart object keeps track of a list of KeyboardNavigationModules that we move through
+            // Maintain abstraction between KeyboardNavigationModule and Highcharts.
+            // The chart object keeps track of a list of KeyboardNavigationModules that
+            // we move through.
             function navModuleFactory(id, keyMap, options) {
                 return new KeyboardNavigationModule(merge({
                     keyCodeMap: keyMap,
-                    // Move to next/prev valid module, or undefined if none, and init it.
-                    // Returns true on success and false if there is no valid module to move to.
+                    // Move to next/prev valid module, or undefined if none, and init
+                    // it. Returns true on success and false if there is no valid module
+                    // to move to.
                     move: function(direction) {
                         if (this.terminate) {
                             this.terminate(direction);
                         }
                         chart.keyboardNavigationModuleIndex += direction;
-                        var newModule = chart.keyboardNavigationModules[chart.keyboardNavigationModuleIndex];
+                        var newModule = chart.keyboardNavigationModules[
+                            chart.keyboardNavigationModuleIndex
+                        ];
                         if (newModule) {
                             if (newModule.validate && !newModule.validate()) {
                                 return this.move(direction); // Invalid module
@@ -770,7 +1060,14 @@
                         }
                         // No module
                         chart.keyboardNavigationModuleIndex = 0; // Reset counter
-                        chart.slipNextTab = true; // Allow next tab to slip, as we will have focus on chart now
+
+                        // Set focus to chart or exit anchor depending on direction
+                        if (direction > 0) {
+                            chart.tabExitAnchor.focus();
+                        } else {
+                            chart.renderTo.focus();
+                        }
+
                         return false;
                     }
                 }, {
@@ -781,56 +1078,49 @@
             // Route keydown events
             function keydownHandler(ev) {
                 var e = ev || win.event,
-                    keyCode = e.which || e.keyCode,
-                    curNavModule = chart.keyboardNavigationModules[chart.keyboardNavigationModuleIndex];
-
-                // Handle tabbing
-                if (keyCode === 9) {
-                    // If we reached end of chart, we need to let this tab slip through to allow users to tab further
-                    if (chart.slipNextTab) {
-                        chart.slipNextTab = false;
-                        return;
-                    }
-                }
-                // If key was not tab, don't slip the next tab
-                chart.slipNextTab = false;
+                    curNavModule = chart.keyboardNavigationModules[
+                        chart.keyboardNavigationModuleIndex
+                    ];
 
-                // If there is a navigation module for the current index, run it. Otherwise, we are outside of the chart in some direction.
+                // If there is a navigation module for the current index, run it.
+                // Otherwise, we are outside of the chart in some direction.
                 if (curNavModule) {
                     if (curNavModule.run(e)) {
-                        e.preventDefault(); // If successfully handled, stop the event here.
+                        // Successfully handled this key event, stop default handling
+                        e.preventDefault();
                     }
                 }
             }
 
-            // List of the different keyboard handling modes we use depending on where we are in the chart.
-            // Each mode has a set of handling functions mapped to key codes.
-            // Each mode determines when to move to the next/prev mode.
+            // List of the different keyboard handling modes we use depending on where
+            // we are in the chart. Each mode has a set of handling functions mapped to
+            // key codes. Each mode determines when to move to the next/prev mode.
             chart.keyboardNavigationModules = [
+                // Entry point catching the first tab, allowing users to tab into points
+                // more intuitively.
+                navModuleFactory('entry', []),
+
                 // Points
+                // Prevents default and ignores failure regardless
                 navModuleFactory('points', [
                     // Left/Right
                     [
                         [37, 39],
                         function(keyCode) {
-                            if (!chart.highlightAdjacentPoint(keyCode === 39)) { // Try to highlight adjacent point
-                                return this.move(keyCode === 39 ? 1 : -1); // Failed. Move to next/prev module
-                            }
+                            chart.highlightAdjacentPoint(keyCode === 39);
+                            return true;
                         }
                     ],
                     // Up/Down
                     [
                         [38, 40],
                         function(keyCode) {
-                            var newSeries;
-                            if (chart.highlightedPoint) {
-                                newSeries = chart.series[chart.highlightedPoint.series.index + (keyCode === 38 ? -1 : 1)]; // Find prev/next series
-                                if (newSeries && newSeries.points[0]) { // If series exists and has data, go for it
-                                    newSeries.points[0].highlight();
-                                } else {
-                                    return this.move(keyCode === 40 ? 1 : -1); // Otherwise, attempt to move to next/prev module
-                                }
-                            }
+                            var highlightMethod = chart.highlightedPoint &&
+                                chart.highlightedPoint.series.keyboardMoveVertical ?
+                                'highlightAdjacentPointVertical' :
+                                'highlightAdjacentSeries';
+                            chart[highlightMethod](keyCode !== 38);
+                            return true;
                         }
                     ],
                     // Enter/Spacebar
@@ -846,6 +1136,15 @@
                     // Always start highlighting from scratch when entering this module
                     init: function() {
                         delete chart.highlightedPoint;
+                        // Find first valid point to highlight
+                        for (var i = 0; i < chart.series.length; ++i) {
+                            for (var j = 0, len = chart.series[i].points &&
+                                    chart.series[i].points.length; j < len; ++j) {
+                                if (!isSkipPoint(chart.series[i].points[j])) {
+                                    return chart.series[i].points[j].highlight();
+                                }
+                            }
+                        }
                     },
                     // If leaving points, don't show tooltip anymore
                     terminate: function() {
@@ -853,9 +1152,7 @@
                             chart.tooltip.hide(0);
                         }
                         delete chart.highlightedPoint;
-                    },
-
-                    transformTabs: chart.options.accessibility.keyboardNavigation.tabThroughPoints
+                    }
                 }),
 
                 // Exporting
@@ -866,7 +1163,8 @@
                         function() {
                             var i = chart.highlightedExportItem || 0,
                                 reachedEnd = true;
-                            // Try to highlight prev item in list. Highlighting e.g. separators will fail.
+                            // Try to highlight prev item in list. Highlighting e.g.
+                            // separators will fail.
                             while (i--) {
                                 if (chart.highlightExportItem(i)) {
                                     reachedEnd = false;
@@ -885,8 +1183,12 @@
                         function() {
                             var highlightedExportItem = chart.highlightedExportItem || 0,
                                 reachedEnd = true;
-                            // Try to highlight next item in list. Highlighting e.g. separators will fail.
-                            for (var i = highlightedExportItem + 1; i < chart.exportDivElements.length; ++i) {
+                            // Try to highlight next item in list. Highlighting e.g.
+                            // separators will fail.
+                            for (
+                                var i = highlightedExportItem + 1; i < chart.exportDivElements.length;
+                                ++i
+                            ) {
                                 if (chart.highlightExportItem(i)) {
                                     reachedEnd = false;
                                     break;
@@ -902,19 +1204,29 @@
                     [
                         [13, 32],
                         function() {
-                            fakeClickEvent(chart.exportDivElements[chart.highlightedExportItem]);
+                            fakeClickEvent(
+                                chart.exportDivElements[chart.highlightedExportItem]
+                            );
                         }
                     ]
                 ], {
-                    // Only run exporting navigation if exporting support exists and is enabled on chart
+                    // Only run exporting navigation if exporting support exists and is
+                    // enabled on chart
                     validate: function() {
-                        return chart.exportChart && !(chart.options.exporting && chart.options.exporting.enabled === false);
+                        return (
+                            chart.exportChart &&
+                            !(
+                                chart.options.exporting &&
+                                chart.options.exporting.enabled === false
+                            )
+                        );
                     },
                     // Show export menu
                     init: function(direction) {
                         chart.highlightedPoint = null;
                         chart.showExportMenu();
-                        // If coming back to export menu from other module, try to highlight last item in menu
+                        // If coming back to export menu from other module, try to
+                        // highlight last item in menu
                         if (direction < 0 && chart.exportDivElements) {
                             for (var i = chart.exportDivElements.length; i > -1; --i) {
                                 if (chart.highlightExportItem(i)) {
@@ -922,6 +1234,10 @@
                                 }
                             }
                         }
+                    },
+                    // Hide the menu
+                    terminate: function() {
+                        chart.hideExportMenu();
                     }
                 }),
 
@@ -931,7 +1247,8 @@
                     [
                         [38, 40, 37, 39],
                         function(keyCode) {
-                            chart[keyCode === 38 || keyCode === 40 ? 'yAxis' : 'xAxis'][0].panStep(keyCode < 39 ? -1 : 1);
+                            chart[keyCode === 38 || keyCode === 40 ? 'yAxis' : 'xAxis'][0]
+                                .panStep(keyCode < 39 ? -1 : 1);
                         }
                     ],
 
@@ -940,10 +1257,15 @@
                         [9],
                         function(keyCode, e) {
                             var button;
-                            chart.mapNavButtons[chart.focusedMapNavButtonIx].setState(0); // Deselect old
-                            if (e.shiftKey && !chart.focusedMapNavButtonIx || !e.shiftKey && chart.focusedMapNavButtonIx) { // trying to go somewhere we can't?
+                            // Deselect old
+                            chart.mapNavButtons[chart.focusedMapNavButtonIx].setState(0);
+                            if (
+                                e.shiftKey && !chart.focusedMapNavButtonIx ||
+                                !e.shiftKey && chart.focusedMapNavButtonIx
+                            ) { // trying to go somewhere we can't?
                                 chart.mapZoom(); // Reset zoom
-                                return this.move(e.shiftKey ? -1 : 1); // Nowhere to go, go to prev/next module
+                                // Nowhere to go, go to prev/next module
+                                return this.move(e.shiftKey ? -1 : 1);
                             }
                             chart.focusedMapNavButtonIx += e.shiftKey ? -1 : 1;
                             button = chart.mapNavButtons[chart.focusedMapNavButtonIx];
@@ -958,18 +1280,21 @@
                     [
                         [13, 32],
                         function() {
-                            fakeClickEvent(chart.mapNavButtons[chart.focusedMapNavButtonIx].element);
+                            fakeClickEvent(
+                                chart.mapNavButtons[chart.focusedMapNavButtonIx].element
+                            );
                         }
                     ]
                 ], {
                     // Only run this module if we have map zoom on the chart
                     validate: function() {
-                        return chart.mapZoom && chart.mapNavButtons && chart.mapNavButtons.length === 2;
+                        return (
+                            chart.mapZoom &&
+                            chart.mapNavButtons &&
+                            chart.mapNavButtons.length === 2
+                        );
                     },
 
-                    // Handle tabs separately
-                    transformTabs: false,
-
                     // Make zoom buttons do their magic
                     init: function(direction) {
                         var zoomIn = chart.mapNavButtons[0],
@@ -979,7 +1304,10 @@
                         each(chart.mapNavButtons, function(button, i) {
                             button.element.setAttribute('tabindex', -1);
                             button.element.setAttribute('role', 'button');
-                            button.element.setAttribute('aria-label', 'Zoom ' + (i ? 'out' : '') + 'chart');
+                            button.element.setAttribute(
+                                'aria-label',
+                                'Zoom ' + (i ? 'out' : '') + 'chart'
+                            );
                         });
 
                         if (initialButton.element.focus) {
@@ -998,7 +1326,9 @@
                         function(keyCode) {
                             var direction = (keyCode === 37 || keyCode === 38) ? -1 : 1;
                             // Try to highlight next/prev button
-                            if (!chart.highlightRangeSelectorButton(chart.highlightedRangeSelectorItemIx + direction)) {
+                            if (!chart.highlightRangeSelectorButton(
+                                    chart.highlightedRangeSelectorItemIx + direction
+                                )) {
                                 return this.move(direction);
                             }
                         }
@@ -1007,15 +1337,24 @@
                     [
                         [13, 32],
                         function() {
-                            if (chart.oldRangeSelectorItemState !== 3) { // Don't allow click if button used to be disabled
-                                fakeClickEvent(chart.rangeSelector.buttons[chart.highlightedRangeSelectorItemIx].element);
+                            // Don't allow click if button used to be disabled
+                            if (chart.oldRangeSelectorItemState !== 3) {
+                                fakeClickEvent(
+                                    chart.rangeSelector.buttons[
+                                        chart.highlightedRangeSelectorItemIx
+                                    ].element
+                                );
                             }
                         }
                     ]
                 ], {
                     // Only run this module if we have range selector
                     validate: function() {
-                        return chart.rangeSelector && chart.rangeSelector.buttons && chart.rangeSelector.buttons.length;
+                        return (
+                            chart.rangeSelector &&
+                            chart.rangeSelector.buttons &&
+                            chart.rangeSelector.buttons.length
+                        );
                     },
 
                     // Make elements focusable and accessible
@@ -1023,10 +1362,15 @@
                         each(chart.rangeSelector.buttons, function(button) {
                             button.element.setAttribute('tabindex', '-1');
                             button.element.setAttribute('role', 'button');
-                            button.element.setAttribute('aria-label', 'Select range ' + (button.text && button.text.textStr));
+                            button.element.setAttribute(
+                                'aria-label',
+                                'Select range ' + (button.text && button.text.textStr)
+                            );
                         });
                         // Focus first/last button
-                        chart.highlightRangeSelectorButton(direction > 0 ? 0 : chart.rangeSelector.buttons.length - 1);
+                        chart.highlightRangeSelectorButton(
+                            direction > 0 ? 0 : chart.rangeSelector.buttons.length - 1
+                        );
                     }
                 }),
 
@@ -1036,29 +1380,42 @@
                     [
                         [9, 38, 40],
                         function(keyCode, e) {
-                            var direction = (keyCode === 9 && e.shiftKey || keyCode === 38) ? -1 : 1,
-                                newIx = chart.highlightedInputRangeIx = chart.highlightedInputRangeIx + direction;
+                            var direction =
+                                (keyCode === 9 && e.shiftKey || keyCode === 38) ? -1 : 1,
+
+                                newIx = chart.highlightedInputRangeIx =
+                                chart.highlightedInputRangeIx + direction;
+
                             // Try to highlight next/prev item in list.
                             if (newIx > 1 || newIx < 0) { // Out of range
                                 return this.move(direction);
                             }
-                            chart.rangeSelector[newIx ? 'maxInput' : 'minInput'].focus(); // Input boxes are HTML, and should have focus support in all browsers
+                            chart.rangeSelector[newIx ? 'maxInput' : 'minInput'].focus();
                         }
                     ]
                 ], {
                     // Only run if we have range selector with input boxes
                     validate: function() {
-                        var inputVisible = chart.rangeSelector && chart.rangeSelector.inputGroup && chart.rangeSelector.inputGroup.element.getAttribute('visibility') !== 'hidden';
-                        return inputVisible && chart.options.rangeSelector.inputEnabled !== false && chart.rangeSelector.minInput && chart.rangeSelector.maxInput;
+                        var inputVisible = (
+                            chart.rangeSelector &&
+                            chart.rangeSelector.inputGroup &&
+                            chart.rangeSelector.inputGroup.element
+                            .getAttribute('visibility') !== 'hidden'
+                        );
+                        return (
+                            inputVisible &&
+                            chart.options.rangeSelector.inputEnabled !== false &&
+                            chart.rangeSelector.minInput &&
+                            chart.rangeSelector.maxInput
+                        );
                     },
 
-                    // Handle tabs different from left/right (because we don't want to catch left/right in a text area)
-                    transformTabs: false,
-
                     // Highlight first/last input box
                     init: function(direction) {
                         chart.highlightedInputRangeIx = direction > 0 ? 0 : 1;
-                        chart.rangeSelector[chart.highlightedInputRangeIx ? 'maxInput' : 'minInput'].focus();
+                        chart.rangeSelector[
+                            chart.highlightedInputRangeIx ? 'maxInput' : 'minInput'
+                        ].focus();
                     }
                 }),
 
@@ -1070,7 +1427,9 @@
                         function(keyCode) {
                             var direction = (keyCode === 37 || keyCode === 38) ? -1 : 1;
                             // Try to highlight next/prev legend item
-                            if (!chart.highlightLegendItem(chart.highlightedLegendItemIx + direction)) {
+                            if (!chart.highlightLegendItem(
+                                    chart.highlightedLegendItemIx + direction
+                                )) {
                                 return this.move(direction);
                             }
                         }
@@ -1079,12 +1438,16 @@
                     [
                         [13, 32],
                         function() {
-                            fakeClickEvent(chart.legend.allItems[chart.highlightedLegendItemIx].legendItem.element.parentNode);
+                            fakeClickEvent(
+                                chart.legend.allItems[
+                                    chart.highlightedLegendItemIx
+                                ].legendItem.element.parentNode
+                            );
                         }
                     ]
                 ], {
-                    // Only run this module if we have at least one legend - wait for it - item.
-                    // Don't run if the legend is populated by a colorAxis.
+                    // Only run this module if we have at least one legend - wait for
+                    // it - item. Don't run if the legend is populated by a colorAxis.
                     // Don't run if legend navigation is disabled.
                     validate: function() {
                         return chart.legend && chart.legend.allItems &&
@@ -1099,15 +1462,22 @@
                         each(chart.legend.allItems, function(item) {
                             item.legendGroup.element.setAttribute('tabindex', '-1');
                             item.legendGroup.element.setAttribute('role', 'button');
-                            item.legendGroup.element.setAttribute('aria-label', 'Toggle visibility of series ' + item.name);
+                            item.legendGroup.element.setAttribute(
+                                'aria-label',
+                                'Toggle visibility of series ' + item.name
+                            );
                         });
                         // Focus first/last item
-                        chart.highlightLegendItem(direction > 0 ? 0 : chart.legend.allItems.length - 1);
+                        chart.highlightLegendItem(
+                            direction > 0 ? 0 : chart.legend.allItems.length - 1
+                        );
                     }
                 })
             ];
 
-            // Init nav module index. We start at the first module, and as the user navigates through the chart the index will increase to use different handler modules.
+            // Init nav module index. We start at the first module, and as the user
+            // navigates through the chart the index will increase to use different
+            // handler modules.
             chart.keyboardNavigationModuleIndex = 0;
 
             // Make chart reachable by tab
@@ -1118,6 +1488,17 @@
                 chart.container.setAttribute('tabindex', '0');
             }
 
+            // Add tab exit anchor
+            // We use this to move focus out of chart whenever we want, by setting focus
+            // to this and not preventing the default tab action.
+            if (!chart.tabExitAnchor) {
+                chart.tabExitAnchor = doc.createElement('div');
+                // Not reachable by user
+                chart.tabExitAnchor.setAttribute('tabindex', '-1');
+                merge(true, chart.tabExitAnchor.style, hiddenStyle);
+                chart.renderTo.appendChild(chart.tabExitAnchor);
+            }
+
             // Handle keyboard events
             addEvent(chart.renderTo, 'keydown', keydownHandler);
             addEvent(chart, 'destroy', function() {
@@ -1126,7 +1507,8 @@
         };
 
         // Add screen reader region to chart.
-        // tableId is the HTML id of the table to focus when clicking the table anchor in the screen reader region.
+        // tableId is the HTML id of the table to focus when clicking the table anchor
+        // in the screen reader region.
         H.Chart.prototype.addScreenReaderRegion = function(id, tableId) {
             var chart = this,
                 series = chart.series,
@@ -1136,32 +1518,53 @@
                 tableShortcut = doc.createElement('h4'),
                 tableShortcutAnchor = doc.createElement('a'),
                 chartHeading = doc.createElement('h4'),
-                hiddenStyle = { // CSS style to hide element from visual users while still exposing it to screen readers
-                    position: 'absolute',
-                    left: '-9999px',
-                    top: 'auto',
-                    width: '1px',
-                    height: '1px',
-                    overflow: 'hidden'
-                },
                 chartTypes = chart.types || [],
-                // Build axis info - but not for pies and maps. Consider not adding for certain other types as well (funnel, pyramid?)
-                axesDesc = (chartTypes.length === 1 && chartTypes[0] === 'pie' || chartTypes[0] === 'map') && {} || chart.getAxesDescription(),
-                chartTypeInfo = series[0] && typeToSeriesMap[series[0].type] || typeToSeriesMap['default']; // eslint-disable-line dot-notation
+                // Build axis info - but not for pies and maps. Consider not adding for
+                // certain other types as well (funnel, pyramid?)
+                axesDesc = (
+                    chartTypes.length === 1 && chartTypes[0] === 'pie' ||
+                    chartTypes[0] === 'map'
+                ) && {} || chart.getAxesDescription(),
+                chartTypeInfo = series[0] && typeToSeriesMap[series[0].type] ||
+                typeToSeriesMap['default']; // eslint-disable-line dot-notation
 
             hiddenSection.setAttribute('id', id);
             hiddenSection.setAttribute('role', 'region');
-            hiddenSection.setAttribute('aria-label', 'Chart screen reader information.');
-
-            hiddenSection.innerHTML = a11yOptions.screenReaderSectionFormatter && a11yOptions.screenReaderSectionFormatter(chart) ||
+            hiddenSection.setAttribute(
+                'aria-label',
+                'Chart screen reader information.'
+            );
+
+            hiddenSection.innerHTML =
+                a11yOptions.screenReaderSectionFormatter &&
+                a11yOptions.screenReaderSectionFormatter(chart) ||
                 '<div>Use regions/landmarks to skip ahead to chart' +
                 (series.length > 1 ? ' and navigate between data series' : '') +
-                '.</div><h3>' + (options.title.text ? htmlencode(options.title.text) : 'Chart') +
-                (options.subtitle && options.subtitle.text ? '. ' + htmlencode(options.subtitle.text) : '') +
-                '</h3><h4>Long description.</h4><div>' + (options.chart.description || 'No description available.') +
-                '</div><h4>Structure.</h4><div>Chart type: ' + (options.chart.typeDescription || chart.getTypeDescription()) + '</div>' +
-                (series.length === 1 ? '<div>' + chartTypeInfo[0] + ' with ' + series[0].points.length + ' ' +
-                    (series[0].points.length === 1 ? chartTypeInfo[1] : chartTypeInfo[2]) + '.</div>' : '') +
+                '.</div><h3>' +
+                (options.title.text ? htmlencode(options.title.text) : 'Chart') +
+                (
+                    options.subtitle && options.subtitle.text ?
+                    '. ' + htmlencode(options.subtitle.text) :
+                    ''
+                ) +
+                '</h3><h4>Long description.</h4><div>' +
+                (options.chart.description || 'No description available.') +
+                '</div><h4>Structure.</h4><div>Chart type: ' +
+                (options.chart.typeDescription || chart.getTypeDescription()) +
+                '</div>' +
+                (
+                    series.length === 1 ?
+                    (
+                        '<div>' + chartTypeInfo[0] + ' with ' +
+                        series[0].points.length + ' ' +
+                        (
+                            series[0].points.length === 1 ?
+                            chartTypeInfo[1] :
+                            chartTypeInfo[2]
+                        ) +
+                        '.</div>'
+                    ) : ''
+                ) +
                 (axesDesc.xAxis ? ('<div>' + axesDesc.xAxis + '</div>') : '') +
                 (axesDesc.yAxis ? ('<div>' + axesDesc.yAxis + '</div>') : '');
 
@@ -1169,11 +1572,13 @@
             if (chart.getCSV) {
                 tableShortcutAnchor.innerHTML = 'View as data table.';
                 tableShortcutAnchor.href = '#' + tableId;
-                tableShortcutAnchor.setAttribute('tabindex', '-1'); // Make this unreachable by user tabbing
-                tableShortcutAnchor.onclick = a11yOptions.onTableAnchorClick || function() {
-                    chart.viewData();
-                    doc.getElementById(tableId).focus();
-                };
+                // Make this unreachable by user tabbing
+                tableShortcutAnchor.setAttribute('tabindex', '-1');
+                tableShortcutAnchor.onclick =
+                    a11yOptions.onTableAnchorClick || function() {
+                        chart.viewData();
+                        doc.getElementById(tableId).focus();
+                    };
                 tableShortcut.appendChild(tableShortcutAnchor);
                 hiddenSection.appendChild(tableShortcut);
             }
@@ -1199,15 +1604,25 @@
                 return;
             }
 
-            var titleElement = doc.createElementNS('http://www.w3.org/2000/svg', 'title'),
-                exportGroupElement = doc.createElementNS('http://www.w3.org/2000/svg', 'g'),
+            var titleElement = doc.createElementNS(
+                    'http://www.w3.org/2000/svg',
+                    'title'
+                ),
+                exportGroupElement = doc.createElementNS(
+                    'http://www.w3.org/2000/svg',
+                    'g'
+                ),
                 descElement = chart.container.getElementsByTagName('desc')[0],
                 textElements = chart.container.getElementsByTagName('text'),
                 titleId = 'highcharts-title-' + chart.index,
                 tableId = 'highcharts-data-table-' + chart.index,
                 hiddenSectionId = 'highcharts-information-region-' + chart.index,
                 chartTitle = options.title.text || 'Chart',
-                oldColumnHeaderFormatter = options.exporting && options.exporting.csv && options.exporting.csv.columnHeaderFormatter,
+                oldColumnHeaderFormatter = (
+                    options.exporting &&
+                    options.exporting.csv &&
+                    options.exporting.csv.columnHeaderFormatter
+                ),
                 topLevelColumns = [];
 
             // Add SVG title/desc tags
@@ -1215,35 +1630,51 @@
             titleElement.id = titleId;
             descElement.parentNode.insertBefore(titleElement, descElement);
             chart.renderTo.setAttribute('role', 'region');
-            //chart.container.setAttribute('aria-details', hiddenSectionId); // JAWS currently doesn't handle this too well
-            chart.renderTo.setAttribute('aria-label', 'Interactive chart. ' + chartTitle +
-                '. Use up and down arrows to navigate with most screen readers.');
+            chart.renderTo.setAttribute(
+                'aria-label',
+                'Interactive chart. ' + chartTitle +
+                '. Use up and down arrows to navigate with most screen readers.'
+            );
 
             // Set screen reader properties on export menu
-            if (chart.exportSVGElements && chart.exportSVGElements[0] && chart.exportSVGElements[0].element) {
+            if (
+                chart.exportSVGElements &&
+                chart.exportSVGElements[0] &&
+                chart.exportSVGElements[0].element
+            ) {
                 var oldExportCallback = chart.exportSVGElements[0].element.onclick,
                     parent = chart.exportSVGElements[0].element.parentNode;
                 chart.exportSVGElements[0].element.onclick = function() {
-                    oldExportCallback.apply(this, Array.prototype.slice.call(arguments));
+                    oldExportCallback.apply(
+                        this,
+                        Array.prototype.slice.call(arguments)
+                    );
                     chart.addAccessibleContextMenuAttribs();
                     chart.highlightExportItem(0);
                 };
                 chart.exportSVGElements[0].element.setAttribute('role', 'button');
-                chart.exportSVGElements[0].element.setAttribute('aria-label', 'View export menu');
+                chart.exportSVGElements[0].element.setAttribute(
+                    'aria-label',
+                    'View export menu'
+                );
                 exportGroupElement.appendChild(chart.exportSVGElements[0].element);
                 exportGroupElement.setAttribute('role', 'region');
                 exportGroupElement.setAttribute('aria-label', 'Chart export menu');
                 parent.appendChild(exportGroupElement);
             }
 
-            // Set screen reader properties on input boxes for range selector. We need to do this regardless of whether or not these are visible, as they are 
+            // Set screen reader properties on input boxes for range selector. We need
+            // to do this regardless of whether or not these are visible, as they are 
             // by default part of the page's tabindex unless we set them to -1.
             if (chart.rangeSelector) {
                 each(['minInput', 'maxInput'], function(key, i) {
                     if (chart.rangeSelector[key]) {
                         chart.rangeSelector[key].setAttribute('tabindex', '-1');
                         chart.rangeSelector[key].setAttribute('role', 'textbox');
-                        chart.rangeSelector[key].setAttribute('aria-label', 'Select ' + (i ? 'end' : 'start') + ' date.');
+                        chart.rangeSelector[key].setAttribute(
+                            'aria-label',
+                            'Select ' + (i ? 'end' : 'start') + ' date.'
+                        );
                     }
                 });
             }
@@ -1277,7 +1708,8 @@
                         var prevCol = topLevelColumns[topLevelColumns.length - 1];
                         if (keyLength > 1) {
                             // We need multiple levels of column headers
-                            // Populate a list of column headers to add in addition to the ones added by export-data
+                            // Populate a list of column headers to add in addition to
+                            // the ones added by export-data
                             if ((prevCol && prevCol.text) !== item.name) {
                                 topLevelColumns.push({
                                     text: item.name,
@@ -1286,7 +1718,12 @@
                             }
                         }
                         if (oldColumnHeaderFormatter) {
-                            return oldColumnHeaderFormatter.call(this, item, key, keyLength);
+                            return oldColumnHeaderFormatter.call(
+                                this,
+                                item,
+                                key,
+                                keyLength
+                            );
                         }
                         return keyLength > 1 ? key : item.name;
                     }
@@ -1296,7 +1733,11 @@
             // Add ID and title/caption to table HTML
             H.wrap(chart, 'getTable', function(proceed) {
                 return proceed.apply(this, Array.prototype.slice.call(arguments, 1))
-                    .replace('<table>', '<table id="' + tableId + '" summary="Table representation of chart"><caption>' + chartTitle + '</caption>');
+                    .replace(
+                        '<table>',
+                        '<table id="' + tableId + '" summary="Table representation ' +
+                        'of chart"><caption>' + chartTitle + '</caption>'
+                    );
             });
 
             // Add accessibility attributes and top level columns
@@ -1334,7 +1775,8 @@
                     // Add top level columns
                     if (topLevelColumns.length) {
                         each(topLevelColumns, function(col) {
-                            columnHeaderRow += '<th scope="col" colspan="' + col.span + '">' + col.text + '</th>';
+                            columnHeaderRow += '<th scope="col" colspan="' + col.span +
+                                '">' + col.text + '</th>';
                         });
                         head.insertAdjacentHTML('afterbegin', columnHeaderRow);
                     }