highcharts-rails 4.0.4.1 → 4.1.0

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

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.0.4 (2014-09-02)
+ * @license Highcharts JS v4.1.0 (2015-02-16)
  * Exporting module
  *
  * (c) 2010-2014 Torstein Honsi
@@ -8,7 +8,7 @@
  */
 
 // JSLint options:
-/*global Highcharts, document, window, Math, setTimeout */
+/*global Highcharts, HighchartsAdapter, document, window, Math, setTimeout */
 
 (function (Highcharts) { // encapsulate
 
@@ -16,6 +16,7 @@
 var Chart = Highcharts.Chart,
 	addEvent = Highcharts.addEvent,
 	removeEvent = Highcharts.removeEvent,
+	fireEvent = HighchartsAdapter.fireEvent,
 	createElement = Highcharts.createElement,
 	discardElement = Highcharts.discardElement,
 	css = Highcharts.css,
@@ -244,6 +245,7 @@ extend(Chart.prototype, {
 			height: sourceHeight
 		});
 		options.exporting.enabled = false; // hide buttons in print
+		delete options.data; // #3004
 
 		// prepare for replicating the chart
 		options.series = [];
@@ -298,7 +300,9 @@ extend(Chart.prototype, {
 			// Any HTML added to the container after the SVG (#894)
 			.replace(/<\/svg>.*?$/, '</svg>') 
 			// Batik doesn't support rgba fills and strokes (#3095)
-			.replace(/(fill|stroke)="rgba\(([ 0-9]+,[ 0-9]+,[ 0-9]+),([ 0-9\.]+)\)"/g, '$1="rgb($2)" $1-opacity="$3"') 
+			.replace(/(fill|stroke)="rgba\(([ 0-9]+,[ 0-9]+,[ 0-9]+),([ 0-9\.]+)\)"/g, '$1="rgb($2)" $1-opacity="$3"')
+			// An issue with PhantomJS as of 2015-01-11. Revisit with newer versions. (#3649)
+			.replace(/(text-shadow:[ 0-9a-z]+),[^"]+([;"])/g, '$1$2') 
 			/* This fails in IE < 8
 			.replace(/([0-9]+)\.([0-9]+)/g, function(s1, s2, s3) { // round off to save weight
 				return s2 +'.'+ s3[0];
@@ -382,6 +386,8 @@ extend(Chart.prototype, {
 
 		chart.isPrinting = true;
 
+		fireEvent(chart, 'beforePrint');
+
 		// hide all body content
 		each(childNodes, function (node, i) {
 			if (node.nodeType === 1) {
@@ -412,6 +418,8 @@ extend(Chart.prototype, {
 
 			chart.isPrinting = false;
 
+			fireEvent(chart, 'afterPrint');
+
 		}, 1000);
 
 	},
@@ -504,7 +512,9 @@ extend(Chart.prototype, {
 							},
 							onclick: function () {
 								hide();
-								item.onclick.apply(chart, arguments);
+								if (item.onclick) {
+									item.onclick.apply(chart, arguments);
+								}
 							},
 							innerHTML: item.text || chart.options.lang[item.textKey]
 						}, extend({

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

@@ -18,7 +18,8 @@ var defaultOptions = Highcharts.getOptions(),
 	seriesTypes = Highcharts.seriesTypes,
 	merge = Highcharts.merge,
 	noop = function () {},
-	each = Highcharts.each;
+	each = Highcharts.each,
+	pick = Highcharts.pick;
 
 // set default options
 defaultPlotOptions.funnel = merge(defaultPlotOptions.pie, {
@@ -49,7 +50,6 @@ seriesTypes.funnel = Highcharts.extendClass(seriesTypes.pie, {
 	
 	type: 'funnel',
 	animate: noop,
-	singularTooltips: true,
 
 	/**
 	 * Overrides the pie translate method
@@ -222,16 +222,16 @@ seriesTypes.funnel = Highcharts.extendClass(seriesTypes.pie, {
 			renderer = chart.renderer;
 
 		each(series.data, function (point) {
-			
-			var graphic = point.graphic,
+			var pointOptions = point.options,
+				graphic = point.graphic,
 				shapeArgs = point.shapeArgs;
 
-			if (!graphic) { // Create the shapes
+			if (!graphic) { // Create the shapes				
 				point.graphic = renderer.path(shapeArgs).
 					attr({
 						fill: point.color,
-						stroke: options.borderColor,
-						'stroke-width': options.borderWidth
+						stroke: pick(pointOptions.borderColor, options.borderColor),
+						'stroke-width': pick(pointOptions.borderWidth, options.borderWidth)
 					}).
 					add(series.group);
 					

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

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.0.4 (2014-09-02)
+ * @license Highcharts JS v4.1.0 (2015-02-16)
  *
  * (c) 2011-2014 Torstein Honsi
  *
@@ -17,7 +17,6 @@ var UNDEFINED,
 	Legend = Highcharts.Legend,
 	LegendSymbolMixin = Highcharts.LegendSymbolMixin,
 	Series = Highcharts.Series,
-	SVGRenderer = Highcharts.SVGRenderer,
 	
 	defaultOptions = Highcharts.getOptions(),
 	each = Highcharts.each,
@@ -25,7 +24,6 @@ var UNDEFINED,
 	extendClass = Highcharts.extendClass,
 	merge = Highcharts.merge,
 	pick = Highcharts.pick,
-	numberFormat = Highcharts.numberFormat,
 	seriesTypes = Highcharts.seriesTypes,
 	wrap = Highcharts.wrap,
 	noop = function () {};
@@ -103,12 +101,19 @@ extend(ColorAxis.prototype, {
 	tweenColors: function (from, to, pos) {
 		// Check for has alpha, because rgba colors perform worse due to lack of
 		// support in WebKit.
-		var hasAlpha = (to.rgba[3] !== 1 || from.rgba[3] !== 1);
+		var hasAlpha;
+
+		from = from.rgba;
+		to = to.rgba;
+		hasAlpha = (to[3] !== 1 || from[3] !== 1);
+		if (!to.length || !from.length) {
+			Highcharts.error(23);
+		}
 		return (hasAlpha ? 'rgba(' : 'rgb(') + 
-			Math.round(to.rgba[0] + (from.rgba[0] - to.rgba[0]) * (1 - pos)) + ',' + 
-			Math.round(to.rgba[1] + (from.rgba[1] - to.rgba[1]) * (1 - pos)) + ',' + 
-			Math.round(to.rgba[2] + (from.rgba[2] - to.rgba[2]) * (1 - pos)) + 
-			(hasAlpha ? (',' + (to.rgba[3] + (from.rgba[3] - to.rgba[3]) * (1 - pos))) : '') + ')';
+			Math.round(to[0] + (from[0] - to[0]) * (1 - pos)) + ',' + 
+			Math.round(to[1] + (from[1] - to[1]) * (1 - pos)) + ',' + 
+			Math.round(to[2] + (from[2] - to[2]) * (1 - pos)) + 
+			(hasAlpha ? (',' + (to[3] + (from[3] - to[3]) * (1 - pos))) : '') + ')';
 	},
 
 	initDataClasses: function (userOptions) {
@@ -258,6 +263,9 @@ extend(ColorAxis.prototype, {
 				this.labelGroup.add(group);
 
 				this.added = true;
+
+				this.labelLeft = 0;
+				this.labelRight = this.width;
 			}
 			// Reset it to avoid color axis reserving space
 			this.chart.axisOffset[this.side] = sideOffset;
@@ -270,9 +278,10 @@ extend(ColorAxis.prototype, {
 	setLegendColor: function () {
 		var grad,
 			horiz = this.horiz,
-			options = this.options;
+			options = this.options,
+			reversed = this.reversed;
 
-		grad = horiz ? [0, 0, 1, 0] : [0, 0, 0, 1]; 
+		grad = horiz ? [+reversed, 0, +!reversed, 0] : [0, +!reversed, 0, +reversed]; // #3190
 		this.legendColor = {
 			linearGradient: { x1: grad[0], y1: grad[1], x2: grad[2], y2: grad[3] },
 			stops: options.stops || [
@@ -335,7 +344,7 @@ extend(ColorAxis.prototype, {
 			axisLen = this.len;
 		
 		if (point) {
-			crossPos = this.toPixels(point.value);
+			crossPos = this.toPixels(point[point.series.colorKey]);
 			if (crossPos < axisPos) {
 				crossPos = axisPos - 2;
 			} else if (crossPos > axisPos + axisLen) {
@@ -353,7 +362,7 @@ extend(ColorAxis.prototype, {
 					.attr({
 						fill: this.crosshair.color
 					})
-					.add(this.labelGroup);
+					.add(this.legendGroup);
 			}
 		}
 	},
@@ -404,13 +413,13 @@ extend(ColorAxis.prototype, {
 					name = '> ';
 				}
 				if (from !== UNDEFINED) {
-					name += numberFormat(from, valueDecimals) + valueSuffix;
+					name += Highcharts.numberFormat(from, valueDecimals) + valueSuffix;
 				}
 				if (from !== UNDEFINED && to !== UNDEFINED) {
 					name += ' - ';
 				}
 				if (to !== UNDEFINED) {
-					name += numberFormat(to, valueDecimals) + valueSuffix;
+					name += Highcharts.numberFormat(to, valueDecimals) + valueSuffix;
 				}
 				
 				// Add a mock object to the legend items
@@ -533,55 +542,6 @@ var colorSeriesMixin = {
 		});
 	}
 };
-
-
-/**
- * Wrap the buildText method and add the hook for add text stroke
- */
-wrap(SVGRenderer.prototype, 'buildText', function (proceed, wrapper) {
-
-	var textStroke = wrapper.styles && wrapper.styles.HcTextStroke;
-
-	proceed.call(this, wrapper);
-
-	// Apply the text stroke
-	if (textStroke && wrapper.applyTextStroke) {
-		wrapper.applyTextStroke(textStroke);
-	}
-});
-
-/**
- * Apply an outside text stroke to data labels, based on the custom CSS property, HcTextStroke.
- * Consider moving this to Highcharts core, also makes sense on stacked columns etc.
- */
-SVGRenderer.prototype.Element.prototype.applyTextStroke = function (textStroke) {
-	var elem = this.element,
-		tspans,
-		firstChild;
-	
-	textStroke = textStroke.split(' ');
-	tspans = elem.getElementsByTagName('tspan');
-	firstChild = elem.firstChild;
-	
-	// In order to get the right y position of the clones, 
-	// copy over the y setter
-	this.ySetter = this.xSetter;
-	
-	each([].slice.call(tspans), function (tspan, y) {
-		var clone;
-		if (y === 0) {
-			tspan.setAttribute('x', elem.getAttribute('x'));
-			if ((y = elem.getAttribute('y')) !== null) {
-				tspan.setAttribute('y', y);
-			}
-		}
-		clone = tspan.cloneNode(1);
-		clone.setAttribute('stroke', textStroke[1]);
-		clone.setAttribute('stroke-width', textStroke[0]);
-		clone.setAttribute('stroke-linejoin', 'round');
-		elem.insertBefore(clone, firstChild);
-	});
-};
 /**
  * Extend the default options with map options
  */
@@ -593,14 +553,10 @@ defaultOptions.plotOptions.heatmap = merge(defaultOptions.plotOptions.scatter, {
 		formatter: function () { // #2945
 			return this.point.value;
 		},
+		inside: true,
 		verticalAlign: 'middle',
 		crop: false,
-		overflow: false,
-		style: {
-			color: 'white',
-			fontWeight: 'bold',
-			HcTextStroke: '1px rgba(0,0,0,0.5)'
-		}
+		overflow: false
 	},
 	marker: null,
 	tooltip: {
@@ -611,6 +567,7 @@ defaultOptions.plotOptions.heatmap = merge(defaultOptions.plotOptions.scatter, {
 			animation: true
 		},
 		hover: {
+			halo: false,  // #3406, halo is not required on heatmaps
 			brightness: 0.2
 		}
 	}

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

@@ -1,5 +1,5 @@
 /**
- * @license Highcharts JS v4.0.4 (2014-09-02)
+ * @license Highcharts JS v4.1.0 (2015-02-16)
  * Plugin for displaying a message when there is no data visible in chart.
  *
  * (c) 2010-2014 Highsoft AS
@@ -57,7 +57,7 @@
 	}
 
 	H.Series.prototype.hasData = function () {
-		return this.dataMax !== undefined && this.dataMin !== undefined;
+		return this.visible && this.dataMax !== undefined && this.dataMin !== undefined; // #3703
 	};
 	
 	/**

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

@@ -1,5 +1,5 @@
 /**
- * @license  Highcharts JS v4.0.4 (2014-09-02)
+ * @license  Highcharts JS v4.1.0 (2015-02-16)
  * Solid angular gauge module
  *
  * (c) 2010-2014 Torstein Honsi
@@ -7,7 +7,7 @@
  * License: www.highcharts.com/license
  */
 
-/*global Highcharts*/
+/*global Highcharts, HighchartsAdapter*/
 (function (H) {
 	"use strict";
 
@@ -136,6 +136,15 @@
 		}
 	};
 
+	/**
+	 * Handle animation of the color attributes directly
+	 */
+	each(['fill', 'stroke'], function (prop) {
+		HighchartsAdapter.addAnimSetter(prop, function (fx) {
+			fx.elem.attr(prop, colorAxisMethods.tweenColors(H.Color(fx.start), H.Color(fx.end), fx.pos));
+		});
+	});
+
 	// The series prototype
 	H.seriesTypes.solidgauge = H.extendClass(H.seriesTypes.gauge, {
 		type: 'solidgauge',
@@ -162,18 +171,21 @@
 				yAxis = series.yAxis,
 				center = yAxis.center,
 				options = series.options,
+				radius = series.radius = (pInt(pick(options.radius, 100)) * center[2]) / 200,
 				renderer = series.chart.renderer;
 
 			H.each(series.points, function (point) {
 				var graphic = point.graphic,
 					rotation = yAxis.startAngleRad + yAxis.translate(point.y, null, null, null, true),
-					radius = (pInt(pick(options.radius, 100)) * center[2]) / 200,
 					innerRadius = (pInt(pick(options.innerRadius, 60)) * center[2]) / 200,
 					shapeArgs,
 					d,
 					toColor = yAxis.toColor(point.y, point),
 					fromColor;
 
+				if (toColor === 'none') { // #3708
+					toColor = point.color || series.color || 'none';
+				}
 				if (toColor !== 'none') {
 					fromColor = point.color;
 					point.color = toColor;
@@ -194,41 +206,44 @@
 					maxAngle = minAngle + 2 * Math.PI;
 				}
 
-				shapeArgs = {
+				point.shapeArgs = shapeArgs = {
 					x: center[0],
 					y: center[1],
 					r: radius,
 					innerR: innerRadius,
 					start: minAngle,
-					end: maxAngle 
+					end: maxAngle,
+					fill: toColor
 				};
 
 				if (graphic) {
 					d = shapeArgs.d;
-
-					/*jslint unparam: true*/
-					graphic.attr({
-						fill: point.color
-					}).animate(shapeArgs, {
-						step: function (value, fx) {
-							graphic.attr('fill', colorAxisMethods.tweenColors(H.Color(fromColor), H.Color(toColor), fx.pos));
-						}
-					});
-					/*jslint unparam: false*/
+					graphic.animate(shapeArgs);
 					shapeArgs.d = d; // animate alters it
 				} else {					
 					point.graphic = renderer.arc(shapeArgs)
 						.attr({
 							stroke: options.borderColor || 'none',
 							'stroke-width': options.borderWidth || 0,
-							fill: point.color,
+							fill: toColor,
 							'sweep-flag': 0
 						})
 						.add(series.group);
 				}
 			});
 		},
-		animate: null
+
+		/**
+		 * Extend the pie slice animation by animating from start angle and up
+		 */
+		animate: function (init) {
+
+			this.center = this.yAxis.center;
+			this.center[3] = 2 * this.radius;
+			this.startAngleRad = this.yAxis.startAngleRad;
+
+			H.seriesTypes.pie.prototype.animate.call(this, init);
+		}
 	});
 
 }(Highcharts));

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

@@ -0,0 +1,806 @@
+/**
+ * @license Highcharts JS v4.1.0 (2015-02-16)
+ *
+ * (c) 2014 Highsoft AS
+ * Authors: Jon Arild Nygard / Oystein Moseng
+ *
+ * License: www.highcharts.com/license
+ */
+
+/*global HighchartsAdapter */
+(function (H) {
+	var seriesTypes = H.seriesTypes,
+		merge = H.merge,
+		extendClass = H.extendClass,
+		defaultOptions = H.getOptions(),
+		plotOptions = defaultOptions.plotOptions,
+		noop = function () { return; },
+		each = H.each,
+		pick = H.pick,
+		Series = H.Series,
+		Color = H.Color;
+
+	// Define default options
+	plotOptions.treemap = merge(plotOptions.scatter, {
+		showInLegend: false,
+		marker: false,
+		borderColor: '#E0E0E0',
+		borderWidth: 1,
+		dataLabels: {
+			enabled: true,
+			defer: false,
+			verticalAlign: 'middle',
+			formatter: function () { // #2945
+				return this.point.name || this.point.id;
+			},
+			inside: true
+		},
+		tooltip: {
+			headerFormat: '',
+			pointFormat: '<b>{point.name}</b>: {point.value}</b><br/>'
+		},
+		layoutAlgorithm: 'sliceAndDice',
+		layoutStartingDirection: 'vertical',
+		alternateStartingDirection: false,
+		levelIsConstant: true,
+		states: {
+			hover: {
+				borderColor: '#A0A0A0',
+				brightness: seriesTypes.heatmap ? 0 : 0.1,
+				shadow: false
+			}
+		},
+		drillUpButton: {
+			position: { 
+				align: 'left',
+				x: 10,
+				y: -50
+			}
+		}
+	});
+	
+	// Stolen from heatmap	
+	var colorSeriesMixin = {
+		// mapping between SVG attributes and the corresponding options
+		pointAttrToOptions: { 
+			stroke: 'borderColor',
+			'stroke-width': 'borderWidth',
+			fill: 'color',
+			dashstyle: 'borderDashStyle'
+		},
+		pointArrayMap: ['value'],
+		axisTypes: seriesTypes.heatmap ? ['xAxis', 'yAxis', 'colorAxis'] : ['xAxis', 'yAxis'],
+		optionalAxis: 'colorAxis',
+		getSymbol: noop,
+		parallelArrays: ['x', 'y', 'value', 'colorValue'],
+		colorKey: 'colorValue', // Point color option key
+		translateColors: seriesTypes.heatmap && seriesTypes.heatmap.prototype.translateColors
+	};
+
+	// The Treemap series type
+	seriesTypes.treemap = extendClass(seriesTypes.scatter, merge(colorSeriesMixin, {
+		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) });
+					}
+				}
+			}
+		}),
+		handleLayout: function () {
+			var series = this,
+				tree = this.tree,
+				seriesArea;
+			if (this.points.length) {
+				// Assign variables
+				if (!tree) {
+					this.nodeMap = [];
+					tree = this.tree = this.getTree();
+				}
+				if (!this.rootNode) {
+					this.rootNode = "";
+				}
+				this.levelMap = this.getLevels();
+				each(series.points, function (point) {
+					// Reset visibility
+					delete point.plotX;
+					delete point.plotY;
+				});
+				seriesArea = this.getSeriesArea(tree.val);
+				this.nodeMap[""].values = seriesArea;
+				this.calculateArea(tree, seriesArea);
+				this.setPointValues();
+			}
+		},
+		/**
+		* Creates a tree structured object from the series points
+		*/
+		getTree: function () {
+			var tree,
+				series = this,
+				i = 0,
+				parentList = [],
+				allIds = [],
+				key,
+				insertItem = function (key) {
+					each(parentList[key], function (item) {
+						parentList[""].push(item);
+					});
+				},
+				getNodeTree = function (id, i, level, list, points, parent) {
+					var children = [],
+						sortedChildren = [],
+						childrenTotal = 0,
+						val,
+						point = points[i],
+						nodeTree,
+						node,
+						insertNode,
+						name;
+					insertNode = function () {
+						var i = 0,
+							inserted = false;
+						if (sortedChildren.length !== 0) {
+							each(sortedChildren, function (child) {
+								if (node.val > child.val && !inserted) {
+									sortedChildren.splice(i, 0, node);
+									inserted = true;
+								}
+								i = i + 1;					
+							});
+						} 
+						if (!inserted) {
+							sortedChildren.push(node);
+						}
+					};
+
+					// Actions
+					if (point) {
+						name = point.name || "";
+					}
+					if (list[id] !== undefined) {
+						each(list[id], function (i) {
+							node = getNodeTree(points[i].id, i, (level + 1), list, points, id);
+							childrenTotal += node.val;
+							insertNode();
+							children.push(node);
+						});
+					}
+					val = pick((points[i] && points[i].value), childrenTotal, 0);
+					nodeTree = {
+						id: id,
+						i: i,
+						children: sortedChildren,
+						childrenTotal: childrenTotal,
+						val: val,
+						level: level,
+						parent: parent,
+						name: name
+					};
+					series.nodeMap[nodeTree.id] = nodeTree;
+					return nodeTree;
+				};
+			// Actions
+			// Map children to index
+			each(this.points, function (point) {
+				var parent = "";
+				allIds.push(point.id);
+				if (point.parent !== undefined) {
+					parent = point.parent;
+				}
+				if (parentList[parent] === undefined) {
+					parentList[parent] = [];
+				}
+				parentList[parent].push(i);
+				i = i + 1;
+			});
+			/* 
+			*  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)) {
+					if (key !== "") {
+						if (HighchartsAdapter.inArray(key, allIds) === -1) {
+							insertItem(key);
+							delete parentList[key];
+						}
+					}
+				}
+			}
+			tree = getNodeTree("", -1, 0, parentList, this.points, null);
+			return tree;
+		},
+		calculateArea: function (node, area) {
+			var childrenValues = [],
+				childValues,
+				series = this,
+				options = series.options,
+				algorithm = options.layoutAlgorithm,
+				alternate = options.alternateStartingDirection,
+				levelRoot = this.nodeMap[this.rootNode].level,							
+				i = 0,
+				level,
+				levelNr = options.levelIsConstant ? node.level : (node.level - levelRoot),
+				point;
+			node.isVisible = (node.id === this.rootNode) || !!(this.nodeMap[node.parent] && this.nodeMap[node.parent].isVisible);
+			levelNr = (levelNr > 0) ? levelNr : 0;
+			// If layoutAlgorithm is set for the level of the children, then default is overwritten
+			if (this.levelMap[levelNr + 1]) {
+				level = this.levelMap[levelNr + 1];
+				if (level.layoutAlgorithm && series[level.layoutAlgorithm]) {
+					algorithm = level.layoutAlgorithm;
+				}
+				if (level.layoutStartingDirection) {
+					area.direction = level.layoutStartingDirection === 'vertical' ? 0 : 1;
+				}
+			}
+			childrenValues = series[algorithm](area, node.children);
+			each(node.children, function (child) {
+				levelNr = options.levelIsConstant ? child.level : (child.level - levelRoot);
+				point = series.points[child.i];
+				point.level = levelNr;
+				childValues = childrenValues[i];
+				childValues.val = child.childrenTotal;
+				childValues.direction = area.direction;
+				if (alternate) {
+					childValues.direction = 1 - childValues.direction;
+				}
+				child.values = childValues;
+				child.isVisible = node.isVisible;
+				point.node = child;
+				point.value = child.val;
+				point.isLeaf = true;
+				// If node has children, then call method recursively
+				if (child.children.length) {
+					point.isLeaf = false;
+					series.calculateArea(child, childValues);
+				}
+				i = i + 1;
+			});
+		},
+		setPointValues: function () {
+			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,
+					x1,
+					x2,
+					y1,
+					y2;
+				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));
+				y2 = Math.round(yAxis.translate(values.y + values.height, 0, 0, 0, 1));
+				if (point.value > 0) {
+					// Set point values
+					point.shapeType = 'rect';
+					point.shapeArgs = {
+						x: Math.min(x1, x2),
+						y: Math.min(y1, y2),
+						width: Math.abs(x2 - x1),
+						height: Math.abs(y2 - y1)
+					};
+					point.plotX = point.shapeArgs.x + (point.shapeArgs.width / 2);
+					point.plotY = point.shapeArgs.y + (point.shapeArgs.height / 2);
+				}
+			});
+		},
+		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
+				};
+			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];
+				// Select either point color, level color or inherited color.
+				color = pick(point && point.options.color, level && level.color, color);
+				if (point) {
+					point.color = color;
+				}
+				// Do it all again with the children	
+				if (node.children.length) {
+					each(node.children, function (child) {
+						series.setColorRecursive(child, color);
+					});
+				}
+			}
+		},
+		alg_func_group: function (h, w, d, p) {
+			this.height = h;
+			this.width = w;
+			this.plot = p;
+			this.direction = d;
+			this.startDirection = d;
+			this.total = 0;
+			this.nW = 0;
+			this.lW = 0;
+			this.nH = 0;
+			this.lH = 0;
+			this.elArr = [];
+			this.lP = {
+				total: 0,
+				lH: 0,
+				nH: 0,
+				lW: 0,
+				nW: 0,
+				nR: 0,
+				lR: 0,
+				aspectRatio: function (w, h) {
+					return Math.max((w / h), (h / w));
+				}
+			};
+			this.addElement = function (el) {
+				this.lP.total = this.elArr[this.elArr.length - 1];
+				this.total = this.total + el;
+				if (this.direction === 0) {
+					// Calculate last point old aspect ratio
+					this.lW = this.nW;
+					this.lP.lH = this.lP.total / this.lW;
+					this.lP.lR = this.lP.aspectRatio(this.lW, this.lP.lH);
+					// Calculate last point new aspect ratio
+					this.nW = this.total / this.height;
+					this.lP.nH = this.lP.total / this.nW;
+					this.lP.nR = this.lP.aspectRatio(this.nW, this.lP.nH);
+				} else {
+					// Calculate last point old aspect ratio
+					this.lH = this.nH;
+					this.lP.lW = this.lP.total / this.lH;
+					this.lP.lR = this.lP.aspectRatio(this.lP.lW, this.lH);
+					// Calculate last point new aspect ratio
+					this.nH = this.total / this.width;
+					this.lP.nW = this.lP.total / this.nH;
+					this.lP.nR = this.lP.aspectRatio(this.lP.nW, this.nH);
+				}
+				this.elArr.push(el);						
+			};
+			this.reset = function () {
+				this.nW = 0;
+				this.lW = 0;
+				this.elArr = [];
+				this.total = 0;
+			};
+		},
+		alg_func_calcPoints: function (directionChange, last, group, childrenArea) {
+			var pX,
+				pY,
+				pW,
+				pH,
+				gW = group.lW,
+				gH = group.lH,
+				plot = group.plot,
+				keep,
+				i = 0,
+				end = group.elArr.length - 1;
+			if (last) {
+				gW = group.nW;
+				gH = group.nH;
+			} else {
+				keep = group.elArr[group.elArr.length - 1];
+			}
+			each(group.elArr, function (p) {
+				if (last || (i < end)) {
+					if (group.direction === 0) {
+						pX = plot.x;
+						pY = plot.y; 
+						pW = gW;
+						pH = p / pW;
+					} else {
+						pX = plot.x;
+						pY = plot.y;
+						pH = gH;
+						pW = p / pH;
+					}
+					childrenArea.push({
+						x: pX,
+						y: pY,
+						width: pW,
+						height: pH
+					});
+					if (group.direction === 0) {
+						plot.y = plot.y + pH;
+					} else {
+						plot.x = plot.x + pW;
+					}						
+				}
+				i = i + 1;
+			});
+			// Reset variables
+			group.reset();
+			if (group.direction === 0) {
+				group.width = group.width - gW;
+			} else {
+				group.height = group.height - gH;
+			}
+			plot.y = plot.parent.y + (plot.parent.height - group.height);
+			plot.x = plot.parent.x + (plot.parent.width - group.width);
+			if (directionChange) {
+				group.direction = 1 - group.direction;
+			}
+			// If not last, then add uncalculated element
+			if (!last) {
+				group.addElement(keep);
+			}
+		},
+		alg_func_lowAspectRatio: function (directionChange, parent, children) {
+			var childrenArea = [],
+				series = this,
+				pTot,
+				plot = {
+					x: parent.x,
+					y: parent.y,
+					parent: parent
+				},
+				direction = parent.direction,
+				i = 0,
+				end = children.length - 1,
+				group = new this.alg_func_group(parent.height, parent.width, direction, plot);
+			// Loop through and calculate all areas
+			each(children, function (child) {
+				pTot = (parent.width * parent.height) * (child.val / parent.val);
+				group.addElement(pTot);
+				if (group.lP.nR > group.lP.lR) {
+					series.alg_func_calcPoints(directionChange, false, group, childrenArea, plot);
+				}
+				// If last child, then calculate all remaining areas
+				if (i === end) {
+					series.alg_func_calcPoints(directionChange, true, group, childrenArea, plot);
+				}
+				i = i + 1;
+			});
+			return childrenArea;
+		},
+		alg_func_fill: function (directionChange, parent, children) {
+			var childrenArea = [],
+				pTot,
+				direction = parent.direction,
+				x = parent.x,
+				y = parent.y,
+				width = parent.width,
+				height = parent.height,
+				pX,
+				pY,
+				pW,
+				pH;
+			each(children, function (child) {
+				pTot = (parent.width * parent.height) * (child.val / parent.val);
+				pX = x;
+				pY = y;
+				if (direction === 0) {
+					pH = height;
+					pW = pTot / pH;
+					width = width - pW;
+					x = x + pW;
+				} else {
+					pW = width;
+					pH = pTot / pW;
+					height = height - pH;
+					y = y + pH;
+				}
+				childrenArea.push({
+					x: pX,
+					y: pY,
+					width: pW,
+					height: pH
+				});
+				if (directionChange) {
+					direction = 1 - direction;
+				}
+			});
+			return childrenArea;
+		},
+		strip: function (parent, children) {
+			return this.alg_func_lowAspectRatio(false, parent, children);
+		},
+		squarified: function (parent, children) {
+			return this.alg_func_lowAspectRatio(true, parent, children);
+		},
+		sliceAndDice: function (parent, children) {
+			return this.alg_func_fill(true, parent, children);
+		},
+		stripes: function (parent, children) {
+			return this.alg_func_fill(false, parent, children);
+		},
+		translate: function () {
+			// Call prototype function
+			Series.prototype.translate.call(this);
+			this.handleLayout();
+
+			// If a colorAxis is defined
+			if (this.colorAxis) {
+				this.translateColors();
+			} else {
+				this.setColorRecursive(this.tree, undefined);
+			}
+		},
+		/**
+		* Extend drawDataLabels with logic to handle the levels option
+		*/
+		drawDataLabels: function () {
+			var series = this,
+				points = series.points,
+				options,
+				level,
+				dataLabelsGroup = this.dataLabelsGroup,
+				dataLabels;
+			each(points, function (point) {
+				if (point.node.isVisible) {
+					level = series.levelMap[point.level];
+					if (!point.isLeaf || level) {
+						options = undefined;
+						// If not a leaf, then label should be disabled as default
+						if (!point.isLeaf) {
+							options = {enabled: false};
+						}
+						if (level) {
+							dataLabels = level.dataLabels;
+							if (dataLabels) {
+								options = merge(options, dataLabels);
+								series._hasPointLabels = true;
+							}
+						}
+						options = merge(options, point.options.dataLabels);
+						point.dlOptions = options;
+					} else {
+						delete point.dlOptions;
+					}
+				}
+			});
+			this.dataLabelsGroup = this.group;
+			Series.prototype.drawDataLabels.call(this);
+			this.dataLabelsGroup = dataLabelsGroup;
+		},
+		alignDataLabel: seriesTypes.column.prototype.alignDataLabel,
+		/**
+		* Extending ColumnSeries drawPoints
+		*/
+		drawPoints: function () {
+			var series = this,
+				points = series.points,
+				seriesOptions = series.options,
+				attr,
+				hover,
+				level;
+			each(points, function (point) {
+				if (point.node.isVisible) {
+					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.isLeaf) {
+						if (seriesOptions.allowDrillToNode) {
+							// TODO: let users set the opacity
+							attr.fill = Color(attr.fill).setOpacity(0.15).get();
+							hover.fill = Color(hover.fill).setOpacity(0.75).get();
+						} else {
+							attr.fill = 'none';
+							delete hover.fill;
+						}
+					}
+					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);
+					if (point.dataLabel) {
+						point.dataLabel.attr({ zIndex: (point.pointAttr[''].zIndex + 1) });
+					}
+				}
+			});
+			// 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.drillCloser();
+			}
+		},
+		/**
+		* Add drilling on the suitable points
+		* TODO: review and better naming
+		*/
+		drillCloser: function () {
+			var series = this,
+				points = series.points,
+				nodeParent;
+			each(points, function (point) {
+				var nodeParentName;
+				if (point.node.isVisible) {
+					H.removeEvent(point, 'click');
+					if (point.graphic) {
+						point.graphic.css({ cursor: 'default' });
+					}
+					if ((point.node.level - series.nodeMap[series.rootNode].level) === 1 && !point.isLeaf) {
+						nodeParent = series.nodeMap[series.nodeMap[point.id].parent];
+						nodeParentName = nodeParent.name || nodeParent.id;
+						if (point.graphic) {
+							point.graphic.css({ cursor: 'pointer' });
+						}
+						H.addEvent(point, 'click', function () {
+							// Remove hover
+							point.setState('');
+							series.drillToNode(point.id);
+							series.showDrillUpButton(nodeParentName);
+						});
+					}
+				}
+			});
+		},
+		drillUp: function () {
+			var drillPoint = null,
+				node,
+				parent;
+			if (this.rootNode) {
+				node = this.nodeMap[this.rootNode];
+				if (node.parent !== null) {
+					drillPoint = this.nodeMap[node.parent];
+				} else {
+					drillPoint = this.nodeMap[""];
+				}
+			}
+
+			if (drillPoint !== null) {
+				this.drillToNode(drillPoint.id);
+				if (drillPoint.id === "") {
+					this.drillUpButton = this.drillUpButton.destroy();
+				} else {
+					parent = this.nodeMap[drillPoint.parent];
+					this.showDrillUpButton((parent.name || parent.id));
+				}
+			} 
+		},
+		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.chart.redraw();
+		},
+		showDrillUpButton: function (name) {
+			var series = this,
+				backText = (name || '< Back'),
+				buttonOptions = series.options.drillUpButton,
+				attr,
+				states;
+
+			if (buttonOptions.text) {
+				backText = buttonOptions.text;
+			}
+			if (!this.drillUpButton) {
+				attr = buttonOptions.theme;
+				states = attr && attr.states;
+							
+				this.drillUpButton = this.chart.renderer.button(
+					backText,
+					null,
+					null,
+					function () {
+						series.drillUp(); 
+					},
+					attr, 
+					states && states.hover,
+					states && states.select
+				)
+				.attr({
+					align: buttonOptions.position.align,
+					zIndex: 9
+				})
+				.add()
+				.align(buttonOptions.position, false, buttonOptions.relativeTo || 'plotBox');
+			} else {
+				this.drillUpButton.attr({
+					text: backText
+				})
+				.align();
+			}
+		},
+		buildKDTree: noop,
+		drawLegendSymbol: H.LegendSymbolMixin.drawRectangle,
+		getExtremes: function () {
+			// Get the extremes from the value data
+			Series.prototype.getExtremes.call(this, this.colorValueData);
+			this.valueMin = this.dataMin;
+			this.valueMax = this.dataMax;
+
+			// Get the extremes from the y data
+			Series.prototype.getExtremes.call(this);
+		},
+		bindAxes: function () {
+			var treeAxis = {
+				endOnTick: false,
+				gridLineWidth: 0,
+				lineWidth: 0,
+				min: 0,
+				dataMin: 0,
+				minPadding: 0,
+				max: 100,
+				dataMax: 100,
+				maxPadding: 0,
+				startOnTick: false,
+				title: null,
+				tickPositions: []
+			};
+			Series.prototype.bindAxes.call(this);
+			H.extend(this.yAxis.options, treeAxis);
+			H.extend(this.xAxis.options, treeAxis);
+		}
+	}));
+}(Highcharts));