From cca4c76c00da2a114345d7aae4eab9889a8cb4fa Mon Sep 17 00:00:00 2001
From: Evert Timberg <evert.timberg+github@gmail.com>
Date: Thu, 26 May 2016 19:38:27 -0400
Subject: [PATCH] Don't use translates and rotates for drawing rotated
 rectangles

---
 src/elements/element.point.js | 12 +++++++-----
 test/element.point.tests.js   | 26 ++++++++++++++++----------
 2 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/src/elements/element.point.js b/src/elements/element.point.js
index f96207713..3290041b2 100644
--- a/src/elements/element.point.js
+++ b/src/elements/element.point.js
@@ -88,12 +88,14 @@ module.exports = function(Chart) {
 				ctx.strokeRect(x - size, y - size, 2 * size, 2 * size);
 				break;
 			case 'rectRot':
-				ctx.translate(x, y);
-				ctx.rotate(Math.PI / 4);
 				size = 1 / Math.SQRT2 * radius;
-				ctx.fillRect(-size, -size, 2 * size, 2 * size);
-				ctx.strokeRect(-size, -size, 2 * size, 2 * size);
-				ctx.setTransform(1, 0, 0, 1, 0, 0);
+				ctx.beginPath();
+				ctx.moveTo(x - size, y);
+				ctx.lineTo(x, y + size);
+				ctx.lineTo(x + size, y);
+				ctx.lineTo(x, y - size);
+				ctx.closePath();
+				ctx.fill();
 				break;
 			case 'cross':
 				ctx.beginPath();
diff --git a/test/element.point.tests.js b/test/element.point.tests.js
index 66d7054c7..674682660 100644
--- a/test/element.point.tests.js
+++ b/test/element.point.tests.js
@@ -189,20 +189,26 @@ describe('Point element tests', function() {
 			name: 'setFillStyle',
 			args: ['rgba(0, 255, 0)']
 		}, {
-			name: 'translate',
-			args: [10, 15]
+			name: 'beginPath',
+			args: []
 		}, {
-			name: 'rotate',
-			args: [Math.PI / 4]
+			name: 'moveTo',
+			args: [10 - 1 / Math.SQRT2 * 2, 15]
 		}, {
-			name: 'fillRect',
-			args: [-1 / Math.SQRT2 * 2, -1 / Math.SQRT2 * 2, 2 / Math.SQRT2 * 2, 2 / Math.SQRT2 * 2],
+			name: 'lineTo',
+			args: [10, 15 + 1 / Math.SQRT2 * 2]
 		}, {
-			name: 'strokeRect',
-			args: [-1 / Math.SQRT2 * 2, -1 / Math.SQRT2 * 2, 2 / Math.SQRT2 * 2, 2 / Math.SQRT2 * 2],
+			name: 'lineTo',
+			args: [10 + 1 / Math.SQRT2 * 2, 15],
 		}, {
-			name: 'setTransform',
-			args: [1, 0, 0, 1, 0, 0],
+			name: 'lineTo',
+			args: [10, 15 - 1 / Math.SQRT2 * 2],
+		}, {
+			name: 'closePath',
+			args: []
+		}, {
+			name: 'fill',
+			args: [],
 		}, {
 			name: 'stroke',
 			args: []