diff --git a/packages/x6-vector/src/element/container/clippath-ext.ts b/packages/x6-vector/src/element/container/clippath-ext.ts index 4c63d8f7330..fb3d32ae0b3 100644 --- a/packages/x6-vector/src/element/container/clippath-ext.ts +++ b/packages/x6-vector/src/element/container/clippath-ext.ts @@ -1,8 +1,8 @@ import { Attrs } from '../../types' import { Adopter } from '../adopter' +import { Decorator } from '../decorator' import { Vector } from '../vector' import { VectorElement } from '../element' -import { Decorator } from '../decorator' import { Container } from './container' import { ClipPath } from './clippath' diff --git a/packages/x6-vector/src/element/shape/line.ts b/packages/x6-vector/src/element/shape/line.ts index a0d9801dbe0..6d31f9c9ad7 100644 --- a/packages/x6-vector/src/element/shape/line.ts +++ b/packages/x6-vector/src/element/shape/line.ts @@ -29,38 +29,44 @@ export class Line extends Shape { return h == null ? this.bbox().height : this.size(this.bbox().width, h) } - array() { - return new PointArray([ - [this.attr('x1'), this.attr('y1')], - [this.attr('x2'), this.attr('y2')], - ]) + size(width: string | number, height: string | number): this + size(width: string | number, height: string | number | null | undefined): this + size(width: string | number | null | undefined, height: string | number): this + size(width?: string | number | null, height?: string | number | null) { + const p = Util.proportionalSize(this, width, height) + return this.plot(this.toPointArray().size(p.width, p.height)) } move(x: number | string, y: number | string) { - return this.attr(this.array().move(x, y).toLine()) + return this.plot(this.toPointArray().move(x, y)) } - plot(): PointArray - plot(points: [[number, number], [number, number]]): this + plot(): Line.Array + plot(points: Line.Array | PointArray): this plot(x1: number, y1: number, x2: number, y2: number): this plot( - x1?: [[number, number], [number, number]] | number, + x1?: Line.Array | PointArray | number, y1?: number, x2?: number, y2?: number, ): this plot( - x1?: [[number, number], [number, number]] | number, + x1?: Line.Array | PointArray | number, y1?: number, x2?: number, y2?: number, ) { if (x1 == null) { - return this.array() + return this.toArray() } const attrs = Array.isArray(x1) - ? new PointArray(x1).toLine() + ? { + x1: x1[0][0], + y1: x1[0][1], + x2: x1[1][0], + y2: x1[1][1], + } : { x1, y1, @@ -71,21 +77,23 @@ export class Line extends Shape { return this.attr(attrs) } - size(width: string | number, height: string | number): this - size(width: string | number, height: string | number | null | undefined): this - size(width: string | number | null | undefined, height: string | number): this - size(width?: string | number | null, height?: string | number | null) { - const p = Util.proportionalSize(this, width, height) - return this.attr(this.array().size(p.width, p.height).toLine()) + toArray(): Line.Array { + return [ + [this.attr('x1'), this.attr('y1')], + [this.attr('x2'), this.attr('y2')], + ] + } + + toPointArray() { + return new PointArray(this.toArray()) } } export namespace Line { + export type Array = [[number, number], [number, number]] + export function create(attrs?: Attrs | null): Line - export function create( - points: [[number, number], [number, number]], - attrs?: Attrs | null, - ): Line + export function create(points: Array, attrs?: Attrs | null): Line export function create( x1: number, y1: number, @@ -94,14 +102,14 @@ export namespace Line { attrs?: Attrs | null, ): Line export function create( - x1?: [[number, number], [number, number]] | number | Attrs | null, + x1?: Array | number | Attrs | null, y1?: number | Attrs | null, x2?: number, y2?: number, attrs?: Attrs | null, ): Line export function create( - x1?: [[number, number], [number, number]] | number | Attrs | null, + x1?: Array | number | Attrs | null, y1?: number | Attrs | null, x2?: number, y2?: number, diff --git a/packages/x6-vector/src/element/shape/path.ts b/packages/x6-vector/src/element/shape/path.ts index d058e8ff151..d8b5417bdb5 100644 --- a/packages/x6-vector/src/element/shape/path.ts +++ b/packages/x6-vector/src/element/shape/path.ts @@ -33,22 +33,15 @@ export class Path extends Shape { return h == null ? this.bbox().height : this.size(this.bbox().width, h) } - array() { - if (this.arr == null) { - this.arr = new PathArray(this.attr('d')) - } - return this.arr - } - move(x: number | string, y: number | string) { - return this.attr('d', this.array().move(x, y).toString()) + return this.attr('d', this.toPathArray().move(x, y).toString()) } - plot(): PathArray + plot(): Path.Segment[] plot(d: string | Path.Segment[] | PathArray): this plot(d?: string | Path.Segment[] | PathArray) { if (d == null) { - return this.array() + return this.toArray() } this.arr = null @@ -68,7 +61,7 @@ export class Path extends Shape { size(width: string | number | null | undefined, height: string | number): this size(width?: string | number | null, height?: string | number | null) { const p = Util.proportionalSize(this, width, height) - return this.attr('d', this.array().size(p.width, p.height).toString()) + return this.attr('d', this.toPathArray().size(p.width, p.height).toString()) } length() { @@ -78,6 +71,17 @@ export class Path extends Shape { pointAt(length: number) { return new Point(this.node.getPointAtLength(length)) } + + toArray() { + return this.toPathArray().toArray() + } + + toPathArray() { + if (this.arr == null) { + this.arr = new PathArray(this.attr('d')) + } + return this.arr + } } export namespace Path { diff --git a/packages/x6-vector/src/element/shape/poly.ts b/packages/x6-vector/src/element/shape/poly.ts index 22df88b47b4..a3704db8551 100644 --- a/packages/x6-vector/src/element/shape/poly.ts +++ b/packages/x6-vector/src/element/shape/poly.ts @@ -31,24 +31,17 @@ export class Poly< return h == null ? this.bbox().height : this.size(this.bbox().width, h) } - array() { - if (this.arr == null) { - this.arr = new PointArray(this.attr('points')) - } - return this.arr - } - move(x: number | string, y: number | string) { - return this.attr('points', this.array().move(x, y).toString()) + return this.attr('points', this.toPointArray().move(x, y).toString()) } - plot(): PointArray + plot(): [number, number][] plot(d: string): this plot(points: [number, number][]): this plot(points: string | [number, number][]): this plot(d?: string | [number, number][]) { if (d == null) { - return this.array() + return this.toArray() } this.arr = null @@ -68,6 +61,20 @@ export class Poly< size(width: string | number | null | undefined, height: string | number): this size(width?: string | number | null, height?: string | number | null) { const s = Util.proportionalSize(this, width, height) - return this.attr('points', this.array().size(s.width, s.height).toString()) + return this.attr( + 'points', + this.toPointArray().size(s.width, s.height).toString(), + ) + } + + toArray() { + return this.toPointArray().toArray() + } + + toPointArray() { + if (this.arr == null) { + this.arr = new PointArray(this.attr('points')) + } + return this.arr } } diff --git a/packages/x6-vector/src/element/shape/text.ts b/packages/x6-vector/src/element/shape/text.ts index ed989911021..9462a877604 100644 --- a/packages/x6-vector/src/element/shape/text.ts +++ b/packages/x6-vector/src/element/shape/text.ts @@ -2,7 +2,7 @@ import { Attrs } from '../../types' import { Global } from '../../global' import { UNumber } from '../../struct/unumber' import { Adopter } from '../adopter' -import { Tspan } from './tspan' +import { TSpan } from './tspan' import { TextBase } from './text-base' @Text.register('Text') @@ -77,7 +77,7 @@ export class Text< if (this.rebuilding) { let blankLineOffset = 0 const leading = this.leading() - this.eachChild((child, index) => { + this.eachChild((child, index) => { const fontSize = Global.window .getComputedStyle(this.node) .getPropertyValue('font-size') @@ -103,8 +103,8 @@ export class Text< } text(): string - text(text: string | ((this: Tspan, tspan: Tspan) => void)): this - text(text?: string | ((this: Tspan, tspan: Tspan) => void)) { + text(text: string | ((this: TSpan, tspan: TSpan) => void)): this + text(text?: string | ((this: TSpan, tspan: TSpan) => void)) { // getter if (text === undefined) { const children = this.node.childNodes @@ -124,7 +124,7 @@ export class Text< if ( index !== firstLine && children[index].nodeType !== 3 && - Adopter.adopt(children[index]).assets.newLined === true + Adopter.adopt(children[index]).assets.newLined === true ) { content += '\n' } diff --git a/packages/x6-vector/src/element/shape/textpath.ts b/packages/x6-vector/src/element/shape/textpath.ts index ae7bfd9832e..76c74ed8d2e 100644 --- a/packages/x6-vector/src/element/shape/textpath.ts +++ b/packages/x6-vector/src/element/shape/textpath.ts @@ -4,11 +4,6 @@ import { Path } from './path' Text.register('TextPath') export class TextPath extends Text { - array() { - const track = this.track() - return track ? track.array() : null - } - plot(): PathArray plot(d: string | Path.Segment[] | PathArray): this plot(d?: string | Path.Segment[] | PathArray) { @@ -26,4 +21,14 @@ export class TextPath extends Text { track() { return this.reference('href') } + + toArray() { + const track = this.track() + return track ? track.toArray() : null + } + + toPathArray() { + const track = this.track() + return track ? track.toPathArray() : null + } } diff --git a/packages/x6-vector/src/element/shape/tspan-ext.ts b/packages/x6-vector/src/element/shape/tspan-ext.ts index b7348d32a9e..1b549453325 100644 --- a/packages/x6-vector/src/element/shape/tspan-ext.ts +++ b/packages/x6-vector/src/element/shape/tspan-ext.ts @@ -1,12 +1,12 @@ import { Attrs } from '../../types' import { TextBase } from './text-base' -import { Tspan } from './tspan' +import { TSpan } from './tspan' export class TextExtension< TSVGTextElement extends SVGTextElement | SVGTSpanElement | SVGTextPathElement > extends TextBase { tspan(text = '', attrs?: Attrs | null) { - const tspan = Tspan.create(text, attrs) + const tspan = TSpan.create(text, attrs) if (!this.building) { this.clear() diff --git a/packages/x6-vector/src/element/shape/tspan.ts b/packages/x6-vector/src/element/shape/tspan.ts index e0b04cf36dc..4c21327cf4e 100644 --- a/packages/x6-vector/src/element/shape/tspan.ts +++ b/packages/x6-vector/src/element/shape/tspan.ts @@ -3,8 +3,8 @@ import { Global } from '../../global' import { TextBase } from './text-base' import { Text } from './text' -@Tspan.register('Tspan') -export class Tspan extends TextBase { +@TSpan.register('Tspan') +export class TSpan extends TextBase { public assets: Record & { leading?: number newLined?: boolean @@ -40,8 +40,8 @@ export class Tspan extends TextBase { } text(): string - text(text: string | ((this: Tspan, tspan: Tspan) => void)): this - text(text?: string | ((this: Tspan, tspan: Tspan) => void)) { + text(text: string | ((this: TSpan, tspan: TSpan) => void)): this + text(text?: string | ((this: TSpan, tspan: TSpan) => void)) { if (text == null) { return this.node.textContent + (this.assets.newLined ? '\n' : '') } @@ -58,12 +58,12 @@ export class Tspan extends TextBase { } } -export namespace Tspan { - export function create(): Tspan - export function create(attrs: Attrs | null): Tspan - export function create(text: string, attrs?: Attrs | null): Tspan +export namespace TSpan { + export function create(): TSpan + export function create(attrs: Attrs | null): TSpan + export function create(text: string, attrs?: Attrs | null): TSpan export function create(text?: string | Attrs | null, attrs?: Attrs | null) { - const tspan = new Tspan() + const tspan = new TSpan() if (text != null) { if (typeof text === 'string') { tspan.text(text) diff --git a/packages/x6-vector/src/struct/point-array.test.ts b/packages/x6-vector/src/struct/point-array.test.ts index 375e8d03880..95b4e0d87fc 100644 --- a/packages/x6-vector/src/struct/point-array.test.ts +++ b/packages/x6-vector/src/struct/point-array.test.ts @@ -173,11 +173,4 @@ describe('PointArray', () => { expect(square.toString()).toEqual(squareString) }) }) - - describe('toLine', () => { - it('should return an object which can be passed to a line as point attributes', () => { - const arr = new PointArray([1, 2, 3, 4]) - expect(arr.toLine()).toEqual({ x1: 1, y1: 2, x2: 3, y2: 4 }) - }) - }) }) diff --git a/packages/x6-vector/src/struct/point-array.ts b/packages/x6-vector/src/struct/point-array.ts index bb79187ffc1..d25d2c0d862 100644 --- a/packages/x6-vector/src/struct/point-array.ts +++ b/packages/x6-vector/src/struct/point-array.ts @@ -76,15 +76,6 @@ export class PointArray extends TArray<[number, number]> { return this } - toLine() { - return { - x1: this[0][0], - y1: this[0][1], - x2: this[1][0], - y2: this[1][1], - } - } - toString() { return this.map((item) => item.join(',')).join(' ') }