Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-05 12:24:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix transform matrix bug. Closes #33.

Browse source
This commit is contained in:
kangax 2012-09-06 12:00:36 -04:00
parent 77c7bd134f
commit 06b0746258
6 changed files with 53 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
dist/all.js vendored
View file

@ -8016,20 +8016,9 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, {
: this.fill;
}
if (this.group && this.type === 'rect') {
if (m) {
ctx.translate(
-this.group.width / 2,
-this.group.height / 2
);
ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
}
else {
ctx.translate(
-this.group.width / 2 + this.width / 2,
-this.group.height / 2 + this.height / 2
);
}
if (m && this.group) {
ctx.translate(-this.group.width/2, -this.group.height/2);
ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
}
this._render(ctx, noTransform);
@ -9735,6 +9724,9 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, {
ctx.beginPath();
ctx.save();
ctx.globalAlpha *= this.opacity;
if (this.transformMatrix && this.group) {
ctx.translate(this.cx, this.cy);
}
ctx.transform(1, 0, 0, this.ry/this.rx, 0, 0);
ctx.arc(noTransform ? this.left : 0, noTransform ? this.top : 0, this.rx, 0, piBy2, false);
if (this.stroke) {
@ -9773,14 +9765,24 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, {
*/
fabric.Ellipse.fromElement = function(element, options) {
options || (options = { });
var parsedAttributes = fabric.parseAttributes(element, fabric.Ellipse.ATTRIBUTE_NAMES);
var cx = parsedAttributes.left;
var cy = parsedAttributes.top;
if ('left' in parsedAttributes) {
parsedAttributes.left -= (options.width / 2) || 0;
}
if ('top' in parsedAttributes) {
parsedAttributes.top -= (options.height / 2) || 0;
}
return new fabric.Ellipse(extend(parsedAttributes, options));
var ellipse = new fabric.Ellipse(extend(parsedAttributes, options));
ellipse.cx = cx || 0;
ellipse.cy = cy || 0;
return ellipse;
};
/**
@ -9881,8 +9883,15 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, {
ctx.beginPath();
ctx.globalAlpha *= this.opacity;
if (this.group) {
ctx.translate(this.x || 0, this.y || 0);
if (this.transformMatrix && this.group) {
ctx.translate(
this.width / 2 + this.x,
this.height / 2 + this.y);
}
if (!this.transformMatrix && this.group) {
ctx.translate(
-this.group.width / 2 + this.width / 2 + this.x,
-this.group.height / 2 + this.height / 2 + this.y);
}
ctx.moveTo(x+rx, y);

2
dist/all.min.js vendored
View file

File diff suppressed because one or more lines are too long

BIN
dist/all.min.js.gz vendored
View file

Binary file not shown.

15
src/ellipse.class.js
View file

@ -90,6 +90,9 @@
ctx.beginPath();
ctx.save();
ctx.globalAlpha *= this.opacity;
if (this.transformMatrix && this.group) {
ctx.translate(this.cx, this.cy);
}
ctx.transform(1, 0, 0, this.ry/this.rx, 0, 0);
ctx.arc(noTransform ? this.left : 0, noTransform ? this.top : 0, this.rx, 0, piBy2, false);
if (this.stroke) {
@ -128,14 +131,24 @@
*/
fabric.Ellipse.fromElement = function(element, options) {
options || (options = { });
var parsedAttributes = fabric.parseAttributes(element, fabric.Ellipse.ATTRIBUTE_NAMES);
var cx = parsedAttributes.left;
var cy = parsedAttributes.top;
if ('left' in parsedAttributes) {
parsedAttributes.left -= (options.width / 2) || 0;
}
if ('top' in parsedAttributes) {
parsedAttributes.top -= (options.height / 2) || 0;
}
return new fabric.Ellipse(extend(parsedAttributes, options));
var ellipse = new fabric.Ellipse(extend(parsedAttributes, options));
ellipse.cx = cx || 0;
ellipse.cy = cy || 0;
return ellipse;
};
/**

17
src/object.class.js
View file

@ -517,20 +517,9 @@
: this.fill;
}
if (this.group && this.type === 'rect') {
if (m) {
ctx.translate(
-this.group.width / 2,
-this.group.height / 2
);
ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
}
else {
ctx.translate(
-this.group.width / 2 + this.width / 2,
-this.group.height / 2 + this.height / 2
);
}
if (m && this.group) {
ctx.translate(-this.group.width/2, -this.group.height/2);
ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
}
this._render(ctx, noTransform);

11
src/rect.class.js
View file

@ -84,8 +84,15 @@
ctx.beginPath();
ctx.globalAlpha *= this.opacity;
if (this.group) {
ctx.translate(this.x || 0, this.y || 0);
if (this.transformMatrix && this.group) {
ctx.translate(
this.width / 2 + this.x,
this.height / 2 + this.y);
}
if (!this.transformMatrix && this.group) {
ctx.translate(
-this.group.width / 2 + this.width / 2 + this.x,
-this.group.height / 2 + this.height / 2 + this.y);
}
ctx.moveTo(x+rx, y);