Elgato_dark/idraw
1
0
Fork 0
mirror of https://github.com/idrawjs/idraw synced 2026-05-23 17:48:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: update core rotate controll

Browse source
This commit is contained in:
chenshenhai 2021-05-29 11:01:13 +08:00
parent 4887501d3c
commit 5d3e84fbec
4 changed files with 27 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/core/example/lib/data.js
View file

@ -34,9 +34,9 @@ const data = {
x: 160,
y: 160,
w: 200,
h: 120,
h: 20,
type: 'rect',
// angle: 60,
angle: 80,
desc: {
color: '#c0c0c0',
}

10
packages/core/src/lib/draw.ts
View file

@ -38,12 +38,12 @@ function drawRect<T extends keyof TypeElemDesc>(ctx: TypeContext, ele: TypeEleme
const desc = ele.desc as TypeElemDesc['rect'];
const angle = translateRotateAngle(ele.angle);
const p = translateRotateCenter(ele);
const center = translateRotateCenter(ele);
if (angle > 0 || angle < 0) {
ctx.translate(p.x, p.y);
ctx.translate(center.x, center.y);
ctx.rotate(angle);
ctx.translate(0 - p.x, 0 - p.y);
ctx.translate(0 - center.x, 0 - center.y);
}
ctx.setFillStyle(desc.color);
@ -51,9 +51,9 @@ function drawRect<T extends keyof TypeElemDesc>(ctx: TypeContext, ele: TypeEleme
// reset rotate
if (angle > 0 || angle < 0) {
ctx.translate(p.x, p.y);
ctx.translate(center.x, center.y);
ctx.rotate(0 - angle);
ctx.translate(0 - p.x, 0 - p.y);
ctx.translate(0 - center.x, 0 - center.y);
}
}

38
packages/core/src/lib/element.ts
View file

@ -7,7 +7,7 @@ import {
// TypeElemDesc,
} from '@idraw/types';
import util from './../util';
// import { translateRotateAngle, translateRotateCenter } from './calculate';
import { translateRotateAngle, translateRotateCenter } from './calculate';
const { createUUID } = util.uuid;
@ -33,21 +33,21 @@ export class Element {
let uuid = null
for (let i = data.elements.length - 1; i >= 0; i--) {
const ele = data.elements[i];
// const angle = translateRotateAngle(ele.angle);
// const p = translateRotateCenter(ele);
const angle = translateRotateAngle(ele.angle);
const center = translateRotateCenter(ele);
// if (angle > 0 || angle < 0) {
// ctx.translate(p.x, p.y);
// ctx.rotate(angle);
// ctx.translate(0 - p.x, 0 - p.y);
// }
if (angle > 0 || angle < 0) {
ctx.translate(center.x, center.y);
ctx.rotate(angle);
ctx.translate(0 - center.x, 0 - center.y);
}
ctx.beginPath();
// ctx.moveTo(ele.x, ele.y);
// ctx.lineTo(ele.x + ele.w, ele.y);
// ctx.lineTo(ele.x + ele.w, ele.y + ele.h);
// ctx.lineTo(ele.x, ele.y + ele.h);
// ctx.lineTo(ele.x, ele.y);
ctx.moveTo(ele.x, ele.y);
ctx.lineTo(ele.x + ele.w, ele.y);
ctx.lineTo(ele.x + ele.w, ele.y + ele.h);
ctx.lineTo(ele.x, ele.y + ele.h);
ctx.lineTo(ele.x, ele.y);
ctx.rect(ele.x, ele.y, ele.w, ele.h);
ctx.closePath();
@ -56,12 +56,12 @@ export class Element {
uuid = ele.uuid;
}
// // reset rotate
// if (angle > 0 || angle < 0) {
// ctx.translate(p.x, p.y);
// ctx.rotate(0 - angle);
// ctx.translate(0 - p.x, 0 - p.y);
// }
// reset rotate
if (angle > 0 || angle < 0) {
ctx.translate(center.x, center.y);
ctx.rotate(0 - angle);
ctx.translate(0 - center.x, 0 - center.y);
}
if (idx >= 0) {
break;

2
packages/core/src/lib/helper.ts
View file

@ -145,7 +145,7 @@ export class Helper implements TypeHelper {
},
left: {
x: elem.x - dotSize,
y: elem.y + elem.h / 2 - dotSize / 2,
y: elem.y + elem.h / 2,
},
};