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

feat: fix element in view calc

Browse source
This commit is contained in:
chenshenhai 2023-06-04 11:41:31 +08:00
parent 6a56b29f6f
commit 99f6ee8f41
4 changed files with 39 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
packages/board/src/lib/calculator.ts
View file

@ -1,5 +1,5 @@
import type { Data, Point, Element, ElementType, ViewCalculator, ViewCalculatorOptions, ViewScaleInfo, ElementSize, ViewSizeInfo } from '@idraw/types';
import { rotateElementVertexes } from '@idraw/util';
import { rotateElementVertexes, checkRectIntersect } from '@idraw/util';
export class Calculator implements ViewCalculator {
private _opts: ViewCalculatorOptions;
@ -123,17 +123,30 @@ export class Calculator implements ViewCalculator {
}
isElementInView(elem: ElementSize, scaleInfo: ViewScaleInfo, viewSizeInfo: ViewSizeInfo): boolean {
// const { width, height } = viewSizeInfo;
// const { angle } = elem;
// const { x, y, w, h } = this.elementSize(elem, scaleInfo, viewSizeInfo);
// const ves = rotateElementVertexes({ x, y, w, h, angle });
// for (let i = 0; i < ves.length; i++) {
// const v = ves[i];
// if (v.x >= 0 && v.x <= width && v.y >= 0 && v.y <= height) {
// return true;
// }
// }
const { width, height } = viewSizeInfo;
const { angle } = elem;
const { x, y, w, h } = this.elementSize(elem, scaleInfo, viewSizeInfo);
const vertexes = rotateElementVertexes({ x, y, w, h, angle });
for (let i = 0; i < vertexes.length; i++) {
const v = vertexes[i];
if (v.x >= 0 && v.x <= width && v.y >= 0 && v.y <= height) {
return true;
}
}
return false;
const ves = rotateElementVertexes({ x, y, w, h, angle });
const viewSize = { x: 0, y: 0, w: width, h: height };
const elemStartX = Math.min(ves[0].x, ves[1].x, ves[2].x, ves[3].x);
const elemStartY = Math.min(ves[0].y, ves[1].y, ves[2].y, ves[3].y);
const elemEndX = Math.max(ves[0].x, ves[1].x, ves[2].x, ves[3].x);
const elemEndY = Math.max(ves[0].y, ves[1].y, ves[2].y, ves[3].y);
const elemSize = { x: elemStartX, y: elemStartY, w: elemEndX - elemStartX, h: elemEndY - elemStartY };
return checkRectIntersect(viewSize, elemSize);
}
isPointInElement(p: Point, elem: Element<ElementType>, scaleInfo: ViewScaleInfo, viewSize: ViewSizeInfo): boolean {

1
packages/renderer/src/draw/elements.ts
View file

@ -50,6 +50,7 @@ export function drawElement(ctx: ViewContext2D, elem: Element<ElementType>, opts
export function drawElementList(ctx: ViewContext2D, elements: Data['elements'], opts: RendererDrawElementOptions) {
for (let i = 0; i < elements.length; i++) {
const elem = elements[i];
// TODO
if (!opts.calculator.isElementInView(elem, opts.scaleInfo, opts.viewSize)) {
continue;
}

1
packages/util/src/index.ts
View file

@ -22,3 +22,4 @@ export {
calcElementsContextSize,
calcElementsViewInfo
} from './lib/element';
export { checkRectIntersect } from './lib/rect';

15
packages/util/src/lib/rect.ts Normal file
View file

@ -0,0 +1,15 @@
import type { ElementSize } from '@idraw/types';
export function checkRectIntersect(rect1: ElementSize, rect2: ElementSize) {
const react1MinX = rect1.x;
const react1MinY = rect1.y;
const react1MaxX = rect1.x + rect1.w;
const react1MaxY = rect1.y + rect1.h;
const react2MinX = rect2.x;
const react2MinY = rect2.y;
const react2MaxX = rect2.x + rect2.w;
const react2MaxY = rect2.y + rect2.h;
return react1MinX <= react2MaxX && react1MaxX >= react2MinX && react1MinY <= react2MaxY && react1MaxY >= react2MinY;
}