From: Evert Timberg <evert.timberg@gmail.com>
Date: Sat, 20 Jun 2015 13:47:35 +0000 (-0400)
Subject: Can now change more properties for line drawing. Updated the sample file to demo
X-Git-Tag: 2.0.0-alpha4~69^2^2
X-Git-Url: http://git.ipfire.org/gitweb/?a=commitdiff_plain;h=refs%2Fpull%2F1232%2Fhead;p=thirdparty%2FChart.js.git

Can now change more properties for line drawing. Updated the sample file to demo
---

diff --git a/samples/line.html b/samples/line.html
index f4962480f..edcca91ec 100644
--- a/samples/line.html
+++ b/samples/line.html
@@ -42,6 +42,7 @@
                 label: "My First dataset",
                 data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()],
                 fill: false,
+                borderDash: [5, 5],
             }, {
                 label: "My Second dataset",
                 data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()],
diff --git a/src/controllers/controller.line.js b/src/controllers/controller.line.js
index 34680dc06..d007498a8 100644
--- a/src/controllers/controller.line.js
+++ b/src/controllers/controller.line.js
@@ -131,6 +131,10 @@
 					backgroundColor: line.custom && line.custom.backgroundColor ? line.custom.backgroundColor : (this.getDataset().backgroundColor || this.chart.options.elements.line.backgroundColor),
 					borderWidth: line.custom && line.custom.borderWidth ? line.custom.borderWidth : (this.getDataset().borderWidth || this.chart.options.elements.line.borderWidth),
 					borderColor: line.custom && line.custom.borderColor ? line.custom.borderColor : (this.getDataset().borderColor || this.chart.options.elements.line.borderColor),
+					borderCapStyle: line.custom && line.custom.borderCapStyle ? line.custom.borderCapStyle : (this.getDataset().borderCapStyle || this.chart.options.elements.line.borderCapStyle),
+					borderDash: line.custom && line.custom.borderDash ? line.custom.borderDash : (this.getDataset().borderDash || this.chart.options.elements.line.borderDash),
+					borderDashOffset: line.custom && line.custom.borderDashOffset ? line.custom.borderDashOffset : (this.getDataset().borderDashOffset || this.chart.options.elements.line.borderDashOffset),
+					borderJoinStyle: line.custom && line.custom.borderJoinStyle ? line.custom.borderJoinStyle : (this.getDataset().borderJoinStyle || this.chart.options.elements.line.borderJoinStyle),
 					fill: line.custom && line.custom.fill ? line.custom.fill : (this.getDataset().fill !== undefined ? this.getDataset().fill : this.chart.options.elements.line.fill),
 					skipNull: this.getDataset().skipNull !== undefined ? this.getDataset().skipNull : this.chart.options.elements.line.skipNull,
 					drawNull: this.getDataset().drawNull !== undefined ? this.getDataset().drawNull : this.chart.options.elements.line.drawNull,
diff --git a/src/elements/element.line.js b/src/elements/element.line.js
index bd5ba8326..c03f06684 100644
--- a/src/elements/element.line.js
+++ b/src/elements/element.line.js
@@ -22,6 +22,10 @@
 		backgroundColor: Chart.defaults.global.defaultColor,
 		borderWidth: 3,
 		borderColor: Chart.defaults.global.defaultColor,
+		borderCapStyle: 'butt',
+		borderDash: [],
+		borderDashOffset: 0.0,
+		borderJoinStyle: 'miter',
 		fill: true, // do we fill in the area between the line and its base axis
 		skipNull: true,
 		drawNull: false,
@@ -36,6 +40,8 @@
 			var first = this._children[0];
 			var last = this._children[this._children.length - 1];
 
+			ctx.save();
+
 			// Draw the background first (so the border is always on top)
 			helpers.each(this._children, function(point, index) {
 				var previous = helpers.previousItem(this._children, index);
@@ -107,6 +113,10 @@
 
 
 			// Now draw the line between all the points with any borders
+			ctx.lineCap = vm.borderCapStyle || Chart.defaults.global.elements.line.borderCapStyle;
+			ctx.setLineDash(vm.borderDash || Chart.defaults.global.elements.line.borderDash);
+			ctx.lineDashOffset = vm.borderDashOffset || Chart.defaults.global.elements.line.borderDashOffset;
+			ctx.lineJoin = vm.borderJoinStyle || Chart.defaults.global.elements.line.borderJoinStyle;
 			ctx.lineWidth = vm.borderWidth || Chart.defaults.global.defaultColor;
 			ctx.strokeStyle = vm.borderColor || Chart.defaults.global.defaultColor;
 			ctx.beginPath();
@@ -171,7 +181,7 @@
 
 
 			ctx.stroke();
-
+			ctx.restore();
 		},
 	});