@antv/x6
Version:
JavaScript diagramming library that uses SVG and HTML for rendering.
104 lines (103 loc) • 4.49 kB
TypeScript
/// <reference types="jquery" />
import { Vector } from '../../util';
import { Point } from '../../geometry';
import { View } from '../../view';
export declare class PathDrawer extends View {
readonly options: PathDrawer.Options;
protected action: PathDrawer.Action;
protected pathElement: SVGPathElement;
protected pathTemplate: SVGPathElement;
protected controlElement: SVGPathElement;
protected startPointElement: SVGElement;
protected timeStamp: number | null;
protected readonly MOVEMENT_DETECTION_THRESHOLD = 150;
protected get vel(): Vector;
constructor(options: Partial<PathDrawer.Options> & {
target: SVGSVGElement;
});
protected render(): this;
protected onRemove(): void;
protected startListening(): void;
protected stopListening(): void;
clear(): void;
createPath(x: number, y: number): void;
closePath(): void;
finishPath(name: string): void;
numberOfVisibleSegments(): number;
addMoveSegment(x: number, y: number): void;
addLineSegment(x: number, y: number): void;
addCurveSegment(x: number, y: number, x1: number, y1: number, x2?: number, y2?: number): void;
adjustLastSegment(x: number | null, y: number | null, x1?: number | null, y1?: number | null, x2?: number, y2?: number): void;
snapLastSegmentCoordinates(x: number, y: number, snapRadius: number): Point;
removeLastSegment(): void;
findControlPoint(x: number, y: number): Point;
replaceLastSegmentWithCurve(): void;
adjustControlPath(x1: number, y1: number, x2: number, y2: number): void;
removeControlPath(): void;
protected getPathSeg(path: SVGPathElement, index: number): SVGPathSegCurvetoCubicAbs;
protected onMouseDown(evt: JQuery.MouseDownEvent): void;
protected onMouseMove(evt: JQuery.MouseMoveEvent): void;
protected onPointerUp(evt: JQuery.MouseUpEvent): void;
protected onStartPointMouseDown(evt: JQuery.MouseDownEvent): void;
protected onDoubleClick(evt: JQuery.DoubleClickEvent): void;
protected onContextMenu(evt: JQuery.ContextMenuEvent): void;
protected isLeftMouseDown(e: JQuery.TriggeredEvent): boolean;
protected isSamePositionEvent(e: JQuery.ContextMenuEvent | JQuery.MouseDownEvent | JQuery.MouseUpEvent): boolean;
}
export declare namespace PathDrawer {
export interface Options {
/**
* The drawing area. Any paths drawn by the user are appended to this
* <svg> element. They are not removed when the PathDrawer is removed.
*/
target: SVGSVGElement;
/**
* An object with CSS attributes of the new path.
*/
pathAttributes: {
[name: string]: string | null | number;
};
/**
* The SVG markup of control point overlay elements.
*/
startPointMarkup: string;
/**
* If set to a number greater than zero, the endpoint of the current
* segment snaps to the x- and y-values of previously drawn segment
* endpoints. The number determines the distance for snapping.
*/
snapRadius: number;
}
export type Action = 'awaiting-input' | 'path-created' | 'awaiting-line-end' | 'adjusting-line-end' | 'adjusting-curve-end' | 'awaiting-curve-control-1' | 'awaiting-curve-control-2' | 'adjusting-curve-control-1' | 'adjusting-curve-control-2';
interface CommonEventArgs {
path: SVGPathElement;
}
export interface EventArgs {
clear?: null;
'path:create': CommonEventArgs;
'path:close': CommonEventArgs;
'path:stop': CommonEventArgs;
'path:finish': CommonEventArgs;
'path:abort': CommonEventArgs;
'path:segment:add': CommonEventArgs;
'path:move-segment:add': CommonEventArgs;
'path:line-segment:add': CommonEventArgs;
'path:curve-segment:add': CommonEventArgs;
'path:edit': CommonEventArgs;
'path:last-segment:adjust': CommonEventArgs;
'path:last-segment:remove': CommonEventArgs;
'path:last-segment:replace-with-curve': CommonEventArgs;
'path:interact': CommonEventArgs;
'path:control:adjust': CommonEventArgs;
'path:control:remove': CommonEventArgs;
}
export const defaultOptions: Partial<Options>;
export const documentEvents: {
mousemove: string;
touchmove: string;
mouseup: string;
touchend: string;
touchcancel: string;
};
export {};
}