RubyGems - highcharts-rails - Versions diffs - 4.1.8 → 4.1.9 - Mend

highcharts-rails 4.1.8 → 4.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (18) hide show

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

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  * Data module
  *
  * (c) 2012-2014 Torstein Honsi

data/app/assets/javascripts/highcharts/modules/exporting.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  * Exporting module
  *
  * (c) 2010-2014 Torstein Honsi
@@ -293,7 +293,8 @@ extend(Chart.prototype, {
 		extend(options.chart, {
 			animation: false,
 			renderTo: sandbox,
-			forExport: !allowHTML,
+			forExport: true,
+			renderer: 'SVGRenderer',
 			width: sourceWidth,
 			height: sourceHeight
 		});
@@ -353,7 +354,7 @@ extend(Chart.prototype, {
 		if (allowHTML) {
 			html = svg.match(/<\/svg>(.*?$)/);
 			if (html) {
-				html = '<foreignObject x="0" y="0 width="200" height="200">' +
+				html = '<foreignObject x="0" y="0" width="200" height="200">' +
 					'<body xmlns="http://www.w3.org/1999/xhtml">' +
 					html[1] +
 					'</body>' +

data/app/assets/javascripts/highcharts/modules/heatmap.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  *
  * (c) 2011-2014 Torstein Honsi
  *
@@ -256,20 +256,23 @@ extend(ColorAxis.prototype, {
 		return color;
 	},
+	/**
+	 * Override the getOffset method to add the whole axis groups inside the legend.
+	 */
 	getOffset: function () {
 		var group = this.legendGroup,
 			sideOffset = this.chart.axisOffset[this.side];
 		if (group) {
+			// Hook for the getOffset method to add groups to this parent group
+			this.axisParent = group;
+			// Call the base
 			Axis.prototype.getOffset.call(this);
-			if (!this.axisGroup.parentGroup) {
-				// Move the axis elements inside the legend group
-				this.axisGroup.add(group);
-				this.gridGroup.add(group);
-				this.labelGroup.add(group);
+			// First time only
+			if (!this.added) {
 				this.added = true;
@@ -644,17 +647,20 @@ seriesTypes.heatmap = extendClass(seriesTypes.scatter, merge(colorSeriesMixin, {
 		var series = this,
 			options = series.options,
 			xAxis = series.xAxis,
-			yAxis = series.yAxis;
+			yAxis = series.yAxis,
+			between = function (x, a, b) {
+				return Math.min(Math.max(a, x), b);
+			};
 		series.generatePoints();
 		each(series.points, function (point) {
 			var xPad = (options.colsize || 1) / 2,
 				yPad = (options.rowsize || 1) / 2,
-				x1 = Math.round(xAxis.len - xAxis.translate(point.x - xPad, 0, 1, 0, 1)),
-				x2 = Math.round(xAxis.len - xAxis.translate(point.x + xPad, 0, 1, 0, 1)),
-				y1 = Math.round(yAxis.translate(point.y - yPad, 0, 1, 0, 1)),
-				y2 = Math.round(yAxis.translate(point.y + yPad, 0, 1, 0, 1));
+				x1 = between(Math.round(xAxis.len - xAxis.translate(point.x - xPad, 0, 1, 0, 1)), 0, xAxis.len),
+				x2 = between(Math.round(xAxis.len - xAxis.translate(point.x + xPad, 0, 1, 0, 1)), 0, xAxis.len),
+				y1 = between(Math.round(yAxis.translate(point.y - yPad, 0, 1, 0, 1)), 0, yAxis.len),
+				y2 = between(Math.round(yAxis.translate(point.y + yPad, 0, 1, 0, 1)), 0, yAxis.len);
 			// Set plotX and plotY for use in K-D-Tree and more
 			point.plotX = point.clientX = (x1 + x2) / 2;

data/app/assets/javascripts/highcharts/modules/no-data-to-display.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  * Plugin for displaying a message when there is no data visible in chart.
  *
  * (c) 2010-2014 Highsoft AS

data/app/assets/javascripts/highcharts/modules/offline-exporting.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  * Client side exporting module
  *
  * (c) 2015 Torstein Honsi / Oystein Moseng
@@ -85,7 +85,8 @@ Highcharts.Chart.prototype.exportChartLocal = function (exportingOptions, chartO
 		svgToDataUrl = function (svg) {
 			try {
 				// Safari requires data URI since it doesn't allow navigation to blob URLs
-				if (!webKit) {
+				// Firefox has an issue with Blobs and internal references, leading to gradients not working using Blobs (#4550)
+				if (!webKit && navigator.userAgent.toLowerCase().indexOf('firefox') < 0) {
 					return domurl.createObjectURL(new Blob([svg], { type: 'image/svg+xml;charset-utf-16'}));
 				}
 			} catch (e) {

data/app/assets/javascripts/highcharts/modules/solid-gauge.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license  Highcharts JS v4.1.8 (2015-08-20)
+ * @license  Highcharts JS v4.1.9 (2015-10-07)
  * Solid angular gauge module
  *
  * (c) 2010-2014 Torstein Honsi

data/app/assets/javascripts/highcharts/modules/treemap.js CHANGED

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.1.8 (2015-08-20)
+ * @license Highcharts JS v4.1.9 (2015-10-07)
  *
  * (c) 2014 Highsoft AS
  * Authors: Jon Arild Nygard / Oystein Moseng
@@ -10,6 +10,7 @@
 /*global HighchartsAdapter */
 (function (H) {
 	var seriesTypes = H.seriesTypes,
+		map = H.map,
 		merge = H.merge,
 		extend = H.extend,
 		extendClass = H.extendClass,
@@ -20,7 +21,33 @@
 		grep = HighchartsAdapter.grep,
 		pick = H.pick,
 		Series = H.Series,
-		Color = H.Color;
+		Color = H.Color,
+		eachObject = function (list, func, context) {
+			var key;
+			context = context || this;
+			for (key in list) {
+				if (list.hasOwnProperty(key)) {
+					func.call(context, list[key], key, list);
+				}
+			}
+		},
+		reduce = function (arr, func, previous, context) {
+			context = context || this;
+			arr = arr || []; // @note should each be able to handle empty values automatically?
+			each(arr, function (current, i) {
+				previous = func.call(context, previous, current, i, arr);
+			});
+			return previous;
+		},
+		// @todo find correct name for this function.
+		recursive = function (item, func, context) {
+			var next;
+			context = context || this;
+			next = func.call(context, item);
+			if (next !== false) {
+				recursive(next, func, context);
+			}
+		};
 	// Define default options
 	plotOptions.treemap = merge(plotOptions.scatter, {
@@ -64,12 +91,7 @@
 	// Stolen from heatmap
 	var colorSeriesMixin = {
 		// mapping between SVG attributes and the corresponding options
-		pointAttrToOptions: {
-			stroke: 'borderColor',
-			'stroke-width': 'borderWidth',
-			fill: 'color',
-			dashstyle: 'borderDashStyle'
-		},
+		pointAttrToOptions: {},
 		pointArrayMap: ['value'],
 		axisTypes: seriesTypes.heatmap ? ['xAxis', 'yAxis', 'colorAxis'] : ['xAxis', 'yAxis'],
 		optionalAxis: 'colorAxis',
@@ -84,33 +106,35 @@
 		type: 'treemap',
 		trackerGroups: ['group', 'dataLabelsGroup'],
 		pointClass: extendClass(H.Point, {
-			setState: function (state, move) {
-				H.Point.prototype.setState.call(this, state, move);
-				if (state === 'hover') {
-					if (this.dataLabel) {
-						this.dataLabel.attr({ zIndex: 1002 });
-					}
-				} else {
-					if (this.dataLabel) {
-						this.dataLabel.attr({ zIndex: (this.pointAttr[''].zIndex + 1) });
-					}
-				}
-			},
 			setVisible: seriesTypes.pie.prototype.pointClass.prototype.setVisible
 		}),
-		// @todo Move to translate
-		handleLayout: function () {
-			var tree = this.tree,
-				seriesArea;
-			if (this.points.length) {
-				// Assign variables
-				this.rootNode = pick(this.rootNode, "");
-				tree = this.tree = this.getTree();
-				this.levelMap = this.getLevels();
-				seriesArea = this.getSeriesArea(tree.val);
-				this.calculateChildrenAreas(tree, seriesArea);
-				this.setPointValues();
-			}
+		/**
+		 * Creates an object map from parent id to childrens index.
+		 * @param {Array} data List of points set in options.
+		 * @param {string} data[].parent Parent id of point.
+		 * @param {Array} ids List of all point ids.
+		 * @return {Object} Map from parent id to children index in data.
+		 */
+		getListOfParents: function (data, ids) {
+			var listOfParents = reduce(data, function (prev, curr, i) {
+				var parent = pick(curr.parent, "");
+				if (prev[parent] === undefined) {
+					prev[parent] = [];
+				}
+				prev[parent].push(i);
+				return prev;
+			}, {});
+			// If parent does not exist, hoist parent to root of tree.
+			eachObject(listOfParents, function (children, parent, list) {
+				if ((parent !== "") && (HighchartsAdapter.inArray(parent, ids) === -1)) {
+					each(children, function (child) {
+						list[""].push(child);
+					});
+					delete list[parent];
+				}
+			});
+			return listOfParents;
 		},
 		/**
 		* Creates a tree structured object from the series points
@@ -118,51 +142,42 @@
 		getTree: function () {
 			var tree,
 				series = this,
-				parentList = [],
-				allIds = [],
-				key,
-				insertItem = function (key) {
-					each(parentList[key], function (item) {
-						parentList[""].push(item);
-					});
-				};
-			// Actions
-			this.nodeMap = [];
-			// Map children to index
-			// @todo Use data instead of points
-			each(this.points, function (point, index) {
-				var parent = "";
-				allIds.push(point.id);
-				if (point.parent !== undefined) {
-					parent = point.parent;
-				}
-				if (parentList[parent] === undefined) {
-					parentList[parent] = [];
-				}
-				parentList[parent].push(index);
-			});
-			/*
-			*  Quality check:
-			*  - If parent does not exist, then set parent to tree root
-			*  - Add node id to parents children list
-			*/
-			for (key in parentList) {
-				if ((parentList.hasOwnProperty(key)) && (key !== "") && (HighchartsAdapter.inArray(key, allIds) === -1)) {
-					insertItem(key);
-					delete parentList[key];
-				}
-			}
+				allIds = map(this.data, function (d) {
+					return d.id;
+				}),
+				parentList = series.getListOfParents(this.data, allIds);
+			series.nodeMap = [];
 			tree = series.buildNode("", -1, 0, parentList, null);
-			this.eachParents(this.nodeMap[this.rootNode], function (node) {
+			recursive(this.nodeMap[this.rootNode], function (node) {
+				var next = false,
+					p = node.parent;
 				node.visible = true;
+				if (p || p === "") {
+					next = series.nodeMap[p];
+				}
+				return next;
 			});
-			this.eachChildren(this.nodeMap[this.rootNode], function (node) {
-				node.visible = true;
+			recursive(this.nodeMap[this.rootNode].children, function (children) {
+				var next = false;
+				each(children, function (child) {
+					child.visible = true;
+					if (child.children.length) {
+						next = (next || []).concat(child.children);
+					}
+				});
+				return next;
 			});
 			this.setTreeValues(tree);
 			return tree;
 		},
+		init: function (chart, options) {
+			var series = this;
+			Series.prototype.init.call(series, chart, options);
+			if (series.options.allowDrillToNode) {
+				series.drillTo();
+			}
+		},
 		buildNode: function (id, i, level, list, parent) {
 			var series = this,
 				children = [],
@@ -191,6 +206,7 @@
 		},
 		setTreeValues: function (tree) {
 			var series = this,
+				options = series.options,
 				childrenTotal = 0,
 				sorted = [],
 				val,
@@ -207,12 +223,19 @@
 					childrenTotal += child.val;
 				} else {
 					// @todo Add predicate to avoid looping already ignored children
-					series.eachChildren(child, function (node) {
-						extend(node, {
-							ignore: true,
-							isLeaf: false,
-							visible: false
+					recursive(child.children, function (children) {
+						var next = false;
+						each(children, function (node) {
+							extend(node, {
+								ignore: true,
+								isLeaf: false,
+								visible: false
+							});
+							if (node.children.length) {
+								next = (next || []).concat(node.children);
+							}
 						});
+						return next;
 					});
 				}
 			});
@@ -225,28 +248,12 @@
 				// Ignore this node if point is not visible
 				ignore: !(pick(point && point.visible, true) && (val > 0)),
 				isLeaf: tree.visible && !childrenTotal,
+				levelDynamic: (options.levelIsConstant ? tree.level : (tree.level - series.nodeMap[series.rootNode].level)),
 				name: pick(point && point.name, ""),
 				val: val
 			});
 			return tree;
 		},
-		eachChildren: function (node, callback) {
-			var series = this,
-				children = node.children;
-			callback(node);
-			if (children.length) {
-				each(children, function (child) {
-					series.eachChildren(child, callback);
-				});
-			}
-		},
-		eachParents: function (node, callback) {
-			var parent = this.nodeMap[node.parent];
-			callback(node);
-			if (parent) {
-				this.eachParents(parent, callback);
-			}
-		},
 		/**
 		 * Recursive function which calculates the area for all children of a node.
 		 * @param {Object} node The node which is parent to the children.
@@ -255,13 +262,11 @@
 		calculateChildrenAreas: function (parent, area) {
 			var series = this,
 				options = series.options,
-				levelNumber = (options.levelIsConstant ? parent.level : (parent.level - this.nodeMap[this.rootNode].level)),
-				level = this.levelMap[levelNumber + 1],
+				level = this.levelMap[parent.levelDynamic + 1],
 				algorithm = pick((series[level && level.layoutAlgorithm] && level.layoutAlgorithm), options.layoutAlgorithm),
 				alternate = options.alternateStartingDirection,
 				childrenValues = [],
-				children,
-				point;
+				children;
 			// Collect all children which should be included
 			children = grep(parent.children, function (n) {
@@ -273,12 +278,15 @@
 			}
 			childrenValues = series[algorithm](area, children);
 			each(children, function (child, index) {
-				point = series.points[child.i];
-				point.level = levelNumber + 1;
-				child.values = merge(childrenValues[index], {
+				var values = childrenValues[index];
+				child.values = merge(values, {
 					val: child.childrenTotal,
 					direction: (alternate ? 1 - area.direction : area.direction)
 				});
+				child.pointValues = merge(values, {
+					x: (values.x / series.axisRatio),
+					width: (values.width / series.axisRatio)
+				});
 				// If node has children, then call method recursively
 				if (child.children.length) {
 					series.calculateChildrenAreas(child, child.values);
@@ -289,23 +297,15 @@
 			var series = this,
 				xAxis = series.xAxis,
 				yAxis = series.yAxis;
-			series.nodeMap[""].values = {
-				x: 0,
-				y: 0,
-				width: 100,
-				height: 100
-			};
 			each(series.points, function (point) {
 				var node = point.node,
-					values = node.values,
+					values = node.pointValues,
 					x1,
 					x2,
 					y1,
 					y2;
 				// Points which is ignored, have no values.
 				if (values) {
-					values.x = values.x / series.axisRatio;
-					values.width = values.width / series.axisRatio;
 					x1 = Math.round(xAxis.translate(values.x, 0, 0, 0, 1));
 					x2 = Math.round(xAxis.translate(values.x + values.width, 0, 0, 0, 1));
 					y1 = Math.round(yAxis.translate(values.y, 0, 0, 0, 1));
@@ -327,43 +327,13 @@
 				}
 			});
 		},
-		getSeriesArea: function (val) {
-			var x = 0,
-				y = 0,
-				h = 100,
-				r = this.axisRatio = (this.xAxis.len / this.yAxis.len),
-				w = 100 * r,
-				d = this.options.layoutStartingDirection === 'vertical' ? 0 : 1,
-				seriesArea = {
-					x: x,
-					y: y,
-					width: w,
-					height: h,
-					direction: d,
-					val: val
-				};
-				this.nodeMap[""].values = seriesArea;
-			return seriesArea;
-		},
-		getLevels: function () {
-			var map = [],
-				levels = this.options.levels;
-			if (levels) {
-				each(levels, function (level) {
-					if (level.level !== undefined) {
-						map[level.level] = level;
-					}
-				});
-			}
-			return map;
-		},
 		setColorRecursive: function (node, color) {
 			var series = this,
 				point,
 				level;
 			if (node) {
 				point = series.points[node.i];
-				level = series.levelMap[node.level];
+				level = series.levelMap[node.levelDynamic];
 				// Select either point color, level color or inherited color.
 				color = pick(point && point.options.color, level && level.color, color);
 				if (point) {
@@ -573,16 +543,51 @@
 			return this.alg_func_fill(false, parent, children);
 		},
 		translate: function () {
+			var pointValues,
+				seriesArea,
+				tree,
+				val;
 			// Call prototype function
 			Series.prototype.translate.call(this);
-			this.handleLayout();
-			// If a colorAxis is defined
+			if (this.points.length) {
+				// Assign variables
+				this.rootNode = pick(this.options.rootId, "");
+				// Create a object map from level to options
+				this.levelMap = reduce(this.options.levels, function (arr, item) {
+					arr[item.level] = item;
+					return arr;
+				}, {});
+				tree = this.tree = this.getTree(); // @todo Only if series.isDirtyData is true
+				// Calculate plotting values.
+				this.axisRatio = (this.xAxis.len / this.yAxis.len);
+				this.nodeMap[""].pointValues = pointValues = {x: 0, y: 0, width: 100, height: 100 };
+				this.nodeMap[""].values = seriesArea = merge(pointValues, {
+					width: (pointValues.width * this.axisRatio),
+					direction: (this.options.layoutStartingDirection === 'vertical' ? 0 : 1),
+					val: tree.val
+				});
+				this.calculateChildrenAreas(tree, seriesArea);
+			}
+			// Logic for point colors
 			if (this.colorAxis) {
 				this.translateColors();
 			} else if (!this.options.colorByPoint) {
 				this.setColorRecursive(this.tree, undefined);
 			}
+			// Update axis extremes according to the root node.
+			val = this.nodeMap[this.rootNode].pointValues;
+			this.xAxis.setExtremes(val.x, val.x + val.width, false);
+			this.yAxis.setExtremes(val.y, val.y + val.height, false);
+			this.xAxis.setScale();
+			this.yAxis.setScale();
+			// Assign values to points.
+			this.setPointValues();
 		},
 		/**
 		 * Extend drawDataLabels with logic to handle custom options related to the treemap series:
@@ -592,12 +597,13 @@
 		 */
 		drawDataLabels: function () {
 			var series = this,
-				dataLabelsGroup = series.dataLabelsGroup,
-				points = series.points,
+				points = grep(series.points, function (n) {
+					return n.node.visible;
+				}),
 				options,
 				level;
 			each(points, function (point) {
-				level = series.levelMap[point.level];
+				level = series.levelMap[point.node.levelDynamic];
 				// Set options to new object to avoid problems with scope
 				options = {style: {}};
@@ -620,82 +626,88 @@
 				// Merge custom options with point options
 				point.dlOptions = merge(options, point.options.dataLabels);
 			});
-			this.dataLabelsGroup = this.group; // Draw dataLabels in same group as points, because of z-index on hover
 			Series.prototype.drawDataLabels.call(this);
-			this.dataLabelsGroup = dataLabelsGroup;
 		},
 		alignDataLabel: seriesTypes.column.prototype.alignDataLabel,
+		/**
+		 * Get presentational attributes
+		 */
+		pointAttribs: function (point, state) {
+			var level = this.levelMap[point.node.levelDynamic] || {},
+				options = this.options,
+				attr,
+				stateOptions = (state && options.states[state]) || {};
+			// Set attributes by precedence. Point trumps level trumps series. Stroke width uses pick
+			// because it can be 0.
+			attr = {
+				'stroke': point.borderColor || level.borderColor || stateOptions.borderColor || options.borderColor,
+				'stroke-width': pick(point.borderWidth, level.borderWidth, stateOptions.borderWidth, options.borderWidth),
+				'dashstyle': point.borderDashStyle || level.borderDashStyle || stateOptions.borderDashStyle || options.borderDashStyle,
+				'fill': point.color || this.color
+			};
+			if (state === 'hover') {
+				attr.zIndex = 1;
+			}
+			if (point.node.level <= this.nodeMap[this.rootNode].level) {
+				// Hide levels above the current view
+				attr.fill = 'none';
+				attr["stroke-width"] = 0;
+			} else if (!point.node.isLeaf) {
+				// If not a leaf, then remove fill
+				// @todo let users set the opacity
+				attr.fill = pick(options.interactByLeaf, !options.allowDrillToNode) ? 'none' : Color(attr.fill).setOpacity(state === 'hover' ? 0.75 : 0.15).get();
+			} else if (state) {
+				// Brighten and hoist the hover nodes
+				attr.fill = Color(attr.fill).brighten(stateOptions.brightness).get();
+			}
+			return attr;
+		},
 		/**
 		* Extending ColumnSeries drawPoints
 		*/
 		drawPoints: function () {
 			var series = this,
-				points = series.points,
-				seriesOptions = series.options,
-				attr,
-				hover,
-				level;
+				points = grep(series.points, function (n) {
+					return n.node.visible;
+				});
 			each(points, function (point) {
-				level = series.levelMap[point.level];
-				attr = {
-					stroke: seriesOptions.borderColor,
-					'stroke-width': seriesOptions.borderWidth,
-					dashstyle: seriesOptions.borderDashStyle,
-					r: 0, // borderRadius gives wrong size relations and should always be disabled
-					fill: pick(point.color, series.color)
-				};
-				// Overwrite standard series options with level options
-				if (level) {
-					attr.stroke = level.borderColor || attr.stroke;
-					attr['stroke-width'] = level.borderWidth || attr['stroke-width'];
-					attr.dashstyle = level.borderDashStyle || attr.dashstyle;
-				}
-				// Merge with point attributes
-				attr.stroke = point.borderColor || attr.stroke;
-				attr['stroke-width'] = point.borderWidth || attr['stroke-width'];
-				attr.dashstyle = point.borderDashStyle || attr.dashstyle;
-				attr.zIndex = (1000 - (point.level * 2));
-				// Make a copy to prevent overwriting individual props
-				point.pointAttr = merge(point.pointAttr);
-				hover = point.pointAttr.hover;
-				hover.zIndex = 1001;
-				hover.fill = Color(attr.fill).brighten(seriesOptions.states.hover.brightness).get();
-				// If not a leaf, then remove fill
-				if (!point.node.isLeaf) {
-					if (pick(seriesOptions.interactByLeaf, !seriesOptions.allowDrillToNode)) {
-						attr.fill = 'none';
-						delete hover.fill;
-					} else {
-						// TODO: let users set the opacity
-						attr.fill = Color(attr.fill).setOpacity(0.15).get();
-						hover.fill = Color(hover.fill).setOpacity(0.75).get();
-					}
-				}
-				if (point.node.level <= series.nodeMap[series.rootNode].level) {
-					attr.fill = 'none';
-					attr.zIndex = 0;
-					delete hover.fill;
-				}
-				point.pointAttr[''] = H.extend(point.pointAttr[''], attr);
-				// @todo Move this to drawDataLabels
-				if (point.dataLabel) {
-					point.dataLabel.attr({ zIndex: (point.pointAttr[''].zIndex + 1) });
+				var groupKey = "levelGroup-" + point.node.levelDynamic;
+				if (!series[groupKey]) {
+					series[groupKey] = series.chart.renderer.g(groupKey)
+						.attr({
+							zIndex: 1000 - point.node.levelDynamic // @todo Set the zIndex based upon the number of levels, instead of using 1000
+						})
+						.add(series.group);
 				}
+				point.group = series[groupKey];
+				// Preliminary code in prepraration for HC5 that uses pointAttribs for all series
+				point.pointAttr = {
+					'': series.pointAttribs(point),
+					'hover': series.pointAttribs(point, 'hover'),
+					'select': {}
+				};
 			});
 			// Call standard drawPoints
 			seriesTypes.column.prototype.drawPoints.call(this);
-			each(points, function (point) {
-				if (point.graphic) {
-					point.graphic.attr(point.pointAttr['']);
-				}
-			});
-			// Set click events on points
-			if (seriesOptions.allowDrillToNode) {
-				series.drillTo();
+			// If drillToNode is allowed, set a point cursor on clickables & add drillId to point
+			if (series.options.allowDrillToNode) {
+				each(points, function (point) {
+					var cursor,
+						drillId;
+					if (point.graphic) {
+						drillId = point.drillId = series.options.interactByLeaf ? series.drillToByLeaf(point) : series.drillToByGroup(point);
+						cursor = drillId ? "pointer" : "default";
+						point.graphic.css({ cursor: cursor });
+					}
+				});
 			}
 		},
 		/**
@@ -725,34 +737,17 @@
 		* Add drilling on the suitable points
 		*/
 		drillTo: function () {
-			var series = this,
-				points = series.points;
-			each(points, function (point) {
-				var drillId,
+			var series = this;
+			H.addEvent(series, 'click', function (event) {
+				var point = event.point,
+					drillId = point.drillId,
 					drillName;
-				H.removeEvent(point, 'click.drillTo');
-				if (point.graphic) {
-					point.graphic.css({ cursor: 'default' });
-				}
-				// Get the drill to id
-				if (series.options.interactByLeaf) {
-					drillId = series.drillToByLeaf(point);
-				} else {
-					drillId = series.drillToByGroup(point);
-				}
 				// If a drill id is returned, add click event and cursor.
 				if (drillId) {
 					drillName = series.nodeMap[series.rootNode].name || series.rootNode;
-					if (point.graphic) {
-						point.graphic.css({ cursor: 'pointer' });
-					}
-					H.addEvent(point, 'click.drillTo', function () {
-						point.setState(''); // Remove hover
-						series.drillToNode(drillId);
-						series.showDrillUpButton(drillName);
-					});
+					point.setState(''); // Remove hover
+					series.drillToNode(drillId);
+					series.showDrillUpButton(drillName);
 				}
 			});
 		},
@@ -815,11 +810,7 @@
 			}
 		},
 		drillToNode: function (id) {
-			var node = this.nodeMap[id],
-				val = node.values;
-			this.rootNode = id;
-			this.xAxis.setExtremes(val.x, val.x + val.width, false);
-			this.yAxis.setExtremes(val.y, val.y + val.height, false);
+			this.options.rootId = id;
 			this.isDirty = true; // Force redraw
 			this.chart.redraw();
 		},