chartjs-plugin-piechart-outlabels - npm Package Compare versions

Comparing version 0.0.10 to 0.0.11

bower.json

@@ -6,4 +6,4 @@ {
   "license": "MIT",
-  "version": "0.0.1",
+  "version": "0.0.10",
   "main": "dist/chartjs-plugin-piechart-outlabels.js"
 }

package.json

@@ -5,3 +5,3 @@ {
   "description": "Chart.js plugin to display float data labels on pie/doughnut chart outside the border.",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "license": "MIT",
@@ -8,0 +8,0 @@ "main": "dist/chartjs-plugin-piechart-outlabels.js",

src/classes.js

@@ -15,4 +15,3 @@ 'use strict';
 		if (!resolve([config.display, true], context, index)) {
-			delete this;
-			return null;
+			throw new Error('Label display property is set to false.');
 		}
@@ -32,3 +31,3 @@ // Init text
 		if (!lines || !lines.length) {
-			return null;
+			throw new Error('No text to show.');
 		}
@@ -60,3 +59,3 @@
 				color: resolve([config.color, 'white'], context, index),
-				font: helpers.parseFont(resolve([config.font, {resizable: true}])),
+				font: helpers.parseFont(resolve([config.font, {resizable: true}]), ctx.canvas.style.height.slice(0, -2)),
 				padding: helpers.options.toPadding(resolve([config.padding, 0], context, index)),
@@ -63,0 +62,0 @@ textAlign: resolve([config.textAlign, 'left'], context, index),

src/helpers.js

@@ -45,5 +45,12 @@ 'use strict';
 	// @todo move this method in Chart.helpers.options.toFont
-	parseFont: function(value) {
+	parseFont: function(value, height) {
+		
 		var global = Chart.defaults.global;
 		var size = helpers.valueOrDefault(value.size, global.defaultFontSize);
+
+		
+		if (value.resizable) {
+			size = this.adaptTextSizeToHeight(height, value.minSize, value.maxSize);
+		}
+
 		var font = {
@@ -62,10 +69,12 @@ family: helpers.valueOrDefault(value.family, global.defaultFontFamily),
 
-	isEmptyObj: function(obj) {
-		for (var x in obj) {
-			if (x) {
-				return false;
-			}
+	adaptTextSizeToHeight: function(height, min, max) {
+		var size = (height / 100) * 2.5;
+		if(min && size < min) {
+			return min;
 		}
-		return true;
+		if(max && size > max) {
+			return max;
+		}
+		return size;
 	}
 });

src/plugin.js

 'use strict';
 
 import Chart from 'chart.js';
+import outlabeledCharts from './outlabeledCharts'
 import defaults from './defaults.js';
@@ -9,62 +10,5 @@
 
-Chart.defaults.outlabeledPie = Chart.defaults.doughnut;
 
-var custom = Chart.controllers.doughnut.extend({
-	update: function(reset) {
-		var me = this;
-		var chart = me.chart;
-		var chartArea = chart.chartArea;
-		var opts = chart.options;
-		var arcOpts = opts.elements.arc;
-		var availableWidth = chartArea.right - chartArea.left - arcOpts.borderWidth;
-		var availableHeight = chartArea.bottom - chartArea.top - arcOpts.borderWidth;
-		var minSize = Math.min(availableWidth, availableHeight);
-		var offset = {x: 0, y: 0};
-		var meta = me.getMeta();
-		var cutoutPercentage = opts.cutoutPercentage;
-		var circumference = opts.circumference;
+outlabeledCharts.init();
 
-		// If the chart's circumference isn't a full circle, calculate minSize as a ratio of the width/height of the arc
-		if (circumference < Math.PI * 2.0) {
-			var startAngle = opts.rotation % (Math.PI * 2.0);
-			startAngle += Math.PI * 2.0 * (startAngle >= Math.PI ? -1 : startAngle < -Math.PI ? 1 : 0);
-			var endAngle = startAngle + circumference;
-			var start = {x: Math.cos(startAngle), y: Math.sin(startAngle)};
-			var end = {x: Math.cos(endAngle), y: Math.sin(endAngle)};
-			var contains0 = (startAngle <= 0 && endAngle >= 0) || (startAngle <= Math.PI * 2.0 && Math.PI * 2.0 <= endAngle);
-			var contains90 = (startAngle <= Math.PI * 0.5 && Math.PI * 0.5 <= endAngle) || (startAngle <= Math.PI * 2.5 && Math.PI * 2.5 <= endAngle);
-			var contains180 = (startAngle <= -Math.PI && -Math.PI <= endAngle) || (startAngle <= Math.PI && Math.PI <= endAngle);
-			var contains270 = (startAngle <= -Math.PI * 0.5 && -Math.PI * 0.5 <= endAngle) || (startAngle <= Math.PI * 1.5 && Math.PI * 1.5 <= endAngle);
-			var cutout = cutoutPercentage / 100.0;
-			var min = {x: contains180 ? -1 : Math.min(start.x * (start.x < 0 ? 1 : cutout), end.x * (end.x < 0 ? 1 : cutout)), y: contains270 ? -1 : Math.min(start.y * (start.y < 0 ? 1 : cutout), end.y * (end.y < 0 ? 1 : cutout))};
-			var max = {x: contains0 ? 1 : Math.max(start.x * (start.x > 0 ? 1 : cutout), end.x * (end.x > 0 ? 1 : cutout)), y: contains90 ? 1 : Math.max(start.y * (start.y > 0 ? 1 : cutout), end.y * (end.y > 0 ? 1 : cutout))};
-			var size = {width: (max.x - min.x) * 0.5, height: (max.y - min.y) * 0.5};
-			minSize = Math.min(availableWidth / size.width, availableHeight / size.height);
-			offset = {x: (max.x + min.x) * -0.5, y: (max.y + min.y) * -0.5};
-		}
-
-		chart.borderWidth = me.getMaxBorderWidth(meta.data);
-		chart.outerRadius = Math.max((minSize - chart.borderWidth) / 2, 0);
-		chart.innerRadius = Math.max(cutoutPercentage ? (chart.outerRadius / 100) * (cutoutPercentage) : 0, 0);
-		chart.radiusLength = (chart.outerRadius - chart.innerRadius) / chart.getVisibleDatasetCount();
-		chart.offsetX = offset.x * chart.outerRadius;
-		chart.offsetY = offset.y * chart.outerRadius;
-
-		meta.total = me.calculateTotal();
-
-		me.outerRadius = chart.outerRadius - (chart.radiusLength * me.getRingIndex(me.index));
-		me.innerRadius = Math.max(me.outerRadius - chart.radiusLength, 0);
-
-		me.outerRadius *= 0.50;
-		me.innerRadius *= 0.50;
-
-		Chart.helpers.each(meta.data, function(arc, index) {
-			me.updateElement(arc, index, reset);
-		});
-	}
-});
-
-Chart.controllers.outlabeledPie = custom;
-
-
 Chart.defaults.global.plugins.outlabels = defaults;
@@ -74,3 +18,2 @@
 
-
 function configure(dataset, options) {
@@ -94,25 +37,5 @@ var override = dataset.outlabels;
 	resize: function(chart, size, options) {
-		if (options.font.resizable) {
-			options.font.size = (size.height / 100) * 2.5;
-			if(options.font.minSize && options.font.size < options.font.minSize) {
-				options.font.size = options.font.minSize;
-			}
-			if(options.font.maxSize && options.font.size > options.font.maxSize) {
-				options.font.size = options.font.maxSize;
-			}
-			options.font.changed = true;
-		}
+		chart.sizeChanged = true;
 	},
-	afterInit: function(chart, options) {
-		var size = chart.canvas.style;
-		if (options.font.resizable) {
-			options.font.size = (size.height.slice(0, -2) / 100) * 2.5;
-			if(options.font.minSize && options.font.size < options.font.minSize) {
-				options.font.size = options.font.minSize;
-			}
-			if(options.font.maxSize && options.font.size > options.font.maxSize) {
-				options.font.size = options.font.maxSize;
-			}
-		}
-	},
+
 	afterDatasetUpdate: function(chart, args, options) {
@@ -125,29 +48,35 @@ var labels = chart.config.data.labels;
 		var ctx = chart.ctx;
-		var el, label, percent, newLabel;
+		var el, label, percent, newLabel, context, i;
 
 		ctx.save();
 
-		for (var i = 0; i < elements.length; ++i) {
+		for (i = 0; i < elements.length; ++i) {
 			el = elements[i];
 			label = el[LABEL_KEY];
 			percent = dataset.data[i] / args.meta.total;
+			newLabel = null;
 
-			newLabel = (display && el && !el.hidden) ? new classes.OutLabel(
-				el,
-				i,
-				ctx,
-				config,
-				{
-					chart: chart,
-					dataIndex: i,
-					dataset: dataset,
-					labels: labels,
-					datasetIndex: args.index,
-					percent: percent
+			if (display && el && !el.hidden) {
+				try {
+					context = {
+						chart: chart,
+						dataIndex: i,
+						dataset: dataset,
+						labels: labels,
+						datasetIndex: args.index,
+						percent: percent
+					};
+					newLabel = new classes.OutLabel(el, i, ctx, config, context);
+				} catch(e) {
+					newLabel = null;
 				}
-			) : null;
+			}
 
-			newLabel = !helpers.isEmptyObj(newLabel) ? newLabel : null;
-
-			if (label && newLabel && !options.font.changed && (label.label === newLabel.label) && (label.encodedText === newLabel.encodedText)) {
+			if (
+				label && 
+				newLabel && 
+				!chart.sizeChanged &&
+				(label.label === newLabel.label) && 
+				(label.encodedText === newLabel.encodedText)
+			) {
 				newLabel.offset = label.offset;
@@ -160,6 +89,3 @@ }
 		ctx.restore();
-
-		if (options.font.changed) {
-			options.font.changed = false;
-		}
+		chart.sizeChanged = false;
 	},
@@ -166,0 +92,0 @@ afterDatasetDraw: function(chart, args) {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Number of package files

31

increased by3.33%

Worsened metrics

Total package byte prevSize

499748

decreased by-1.27%

Lines of code

953

decreased by-40.1%

No dependency changes