From f4b9ba2b37e5094872e7862fac74e9836a562865 Mon Sep 17 00:00:00 2001 From: joylink_zhaoerwei Date: Fri, 2 Jun 2023 14:16:02 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=9A=E8=BE=B9=E5=BD=A2=E7=BA=BF=E6=AE=B5?= =?UTF-8?q?=E7=BB=86=E5=88=86=E5=A4=87=E7=94=A8--=E5=88=86=E5=89=B2?= =?UTF-8?q?=E5=A4=9A=E6=AE=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/jlgraphic/plugins/GraphicEditPlugin.ts | 19 ++++++++++++++++ src/jlgraphic/utils/GraphicUtils.ts | 25 ++++++++++++++++++++++ 2 files changed, 44 insertions(+) diff --git a/src/jlgraphic/plugins/GraphicEditPlugin.ts b/src/jlgraphic/plugins/GraphicEditPlugin.ts index 276b519..39075ca 100644 --- a/src/jlgraphic/plugins/GraphicEditPlugin.ts +++ b/src/jlgraphic/plugins/GraphicEditPlugin.ts @@ -19,6 +19,7 @@ import { distance2, linePoint, pointPolygon, + calculateLineSegmentingPoint, } from '../utils'; import { GraphicTransformEvent, ShiftData } from './GraphicTransformPlugin'; @@ -57,6 +58,9 @@ export abstract class GraphicEditPlugin< export const addWaypointConfig: MenuItemOptions = { name: '添加路径点', }; +export const addWaySegmentingConfig: MenuItemOptions = { + name: '细分', +}; export const removeWaypointConfig: MenuItemOptions = { name: '移除路径点', }; @@ -251,6 +255,21 @@ export function addLineWayPoint( graphic.linePoints = points; } +export function addPolygonSegmentingPoint( + graphic: ILineGraphic, + start: number, + end: number, + knife = 2 +) { + const linePoints = graphic.linePoints; + const points = linePoints.slice(0, start + 1); + points.push( + ...calculateLineSegmentingPoint(linePoints[start], linePoints[end], knife) + ); + points.push(...linePoints.slice(end)); + graphic.linePoints = points; +} + function assertBezierWayPoint(i: number) { const c = i % 3; if (c !== 0) { diff --git a/src/jlgraphic/utils/GraphicUtils.ts b/src/jlgraphic/utils/GraphicUtils.ts index 362935e..9cd3ff8 100644 --- a/src/jlgraphic/utils/GraphicUtils.ts +++ b/src/jlgraphic/utils/GraphicUtils.ts @@ -287,6 +287,31 @@ export function calculateLineMidpoint(p1: IPointData, p2: IPointData): Point { return new Point(x, y); } +/** + * 计算线段细分坐标--线段分成几份 + * @param p1 + * @param p2 + * @param knife + * @returns + */ +export function calculateLineSegmentingPoint( + p1: IPointData, + p2: IPointData, + knife: number +): IPointData[] { + const segmentingPoints: IPointData[] = []; + const x = p1.x < p2.x ? p1.x : p2.x; + const y = p1.y < p2.y ? p1.y : p2.y; + const w = Math.abs(p1.x - p2.x); + const h = Math.abs(p1.y - p2.y); + for (let i = 0; i < knife - 1; i++) { + const pointX = x + (w * (i + 1)) / knife; + const pointy = y + (h * (i + 1)) / knife; + segmentingPoints.push(new Point(pointX, pointy)); + } + return segmentingPoints; +} + /** * 计算点到直线距离 * @param p1