Add support for ellipses
This commit is contained in:
parent
f4b7ece357
commit
6c209fccdf
20
context.js
20
context.js
@ -1037,6 +1037,14 @@ export default (function () {
|
|||||||
if (startAngle === endAngle) {
|
if (startAngle === endAngle) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
x = this.__matrixTransform(x, y).x;
|
||||||
|
y = this.__matrixTransform(x, y).y;
|
||||||
|
var scaleX = Math.hypot(this.__transformMatrix.a, this.__transformMatrix.b);
|
||||||
|
var scaleY = Math.hypot(this.__transformMatrix.c, this.__transformMatrix.d);
|
||||||
|
radiusX = radiusX * scaleX;
|
||||||
|
radiusY = radiusY * scaleY;
|
||||||
|
|
||||||
startAngle = startAngle % (2*Math.PI);
|
startAngle = startAngle % (2*Math.PI);
|
||||||
endAngle = endAngle % (2*Math.PI);
|
endAngle = endAngle % (2*Math.PI);
|
||||||
if(startAngle === endAngle) {
|
if(startAngle === endAngle) {
|
||||||
@ -1064,9 +1072,17 @@ export default (function () {
|
|||||||
largeArcFlag = diff > Math.PI ? 1 : 0;
|
largeArcFlag = diff > Math.PI ? 1 : 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.lineTo(startX, startY);
|
this.lineTo(startX / scaleX, startY / scaleY);
|
||||||
this.__addPathCommand(format("A {rx} {ry} {xAxisRotation} {largeArcFlag} {sweepFlag} {endX} {endY}",
|
this.__addPathCommand(format("A {rx} {ry} {xAxisRotation} {largeArcFlag} {sweepFlag} {endX} {endY}",
|
||||||
{rx:radiusX, ry:radiusY, xAxisRotation:rotation*(180/Math.PI), largeArcFlag:largeArcFlag, sweepFlag:sweepFlag, endX:endX, endY:endY}));
|
{
|
||||||
|
rx:radiusX,
|
||||||
|
ry:radiusY,
|
||||||
|
xAxisRotation:rotation*(180/Math.PI),
|
||||||
|
largeArcFlag:largeArcFlag,
|
||||||
|
sweepFlag:sweepFlag,
|
||||||
|
endX:endX,
|
||||||
|
endY:endY
|
||||||
|
}));
|
||||||
|
|
||||||
this.__currentPosition = {x: endX, y: endY};
|
this.__currentPosition = {x: endX, y: endY};
|
||||||
};
|
};
|
||||||
|
@ -1,10 +1,7 @@
|
|||||||
export default function ellipse(ctx) {
|
export default function ellipse(ctx) {
|
||||||
|
|
||||||
//ctx.scale(2,0.5)
|
|
||||||
|
|
||||||
// Draw shapes
|
// Draw shapes
|
||||||
for (let i = 0; i < 4; i++) {
|
for (let i = 0; i < 4; i++) {
|
||||||
for (let j = 0; j < 4; j++) {
|
for (let j = 0; j < 3; j++) {
|
||||||
ctx.beginPath();
|
ctx.beginPath();
|
||||||
var x = 25 + j * 50; // x coordinate
|
var x = 25 + j * 50; // x coordinate
|
||||||
var y = 25 + i * 50; // y coordinate
|
var y = 25 + i * 50; // y coordinate
|
||||||
|
Loading…
x
Reference in New Issue
Block a user