Skip to content
本页目录

jtopo

Table of contents

Classes

Interfaces

Type Aliases

Variables

Functions

Type Aliases

AnimationFrameData

AnimationFrameData: number | (number | PointLike)[]


AnimationOption

AnimationOption: Object

Type declaration

NameType
delay?number
direction?"normal" | "reverse" | "alternate" | "alternate-reverse" | "normal"
duration?number
effect?EasingNames
fromAnimationFrameData
name?string
onEnd?Function
times?number
toAnimationFrameData
updateFunction

CircleLayoutOpt

CircleLayoutOpt: Object

Type declaration

NameTypeDescription
angleScale?number每层角度缩小系数, 默认1,总的角度保持不变
cx?number-
cy?number-
endAngle?number-
radius?number-
radiusScale?number每层半径缩小系数, 默认0.5
startAngle?number-
update?Function-

ConnectPosition

ConnectPosition: "lt" | "ct" | "rt" | "lm" | "center" | "rm" | "lb" | "cb" | "rb" | "nearest"

连接点


DirectionType

DirectionType: "up" | "down" | "left" | "right"


DrawContentDesc

DrawContentDesc: Object

Type declaration

NameType
hasBackgroundColorboolean
hasBackgroundImageboolean
hasBorderboolean
hasImageboolean
hasShapeboolean
onlyImageboolean
onlyTextboolean
shapeSize{ height: number ; width: number }
shapeSize.heightnumber
shapeSize.widthnumber

EasingNames

EasingNames: "easeLinear" | "easeInQuad" | "easeOutQuad" | "easeInOutQuad" | "easeInSine" | "easeOutSine" | "easeInOutSine" | "easeInExpo" | "easeInOutExpo" | "easeInCirc" | "easeOutCirc" | "easeInOutCirc" | "easeInCubic" | "easeOutCubic" | "easeInOutCubic" | "easeInQuart" | "easeOutQuart" | "easeInOutQuart" | "easeInQuint" | "easeOutQuint" | "easeInOutQuint" | "easeInElastic" | "easeOutElastic" | "easeInOutElastic" | "easeInBack" | "easeOutBack" | "easeInOutBack" | "easeInBounce" | "easeOutBounce" | "easeInOutBounce"


EndpointOffset

EndpointOffset: number | PointLike


ExpandScaleOpt

ExpandScaleOpt: Object

Type declaration

NameTypeDescription
beginHeight?number开始高度,默认0
beginWidth?number开始宽度,默认0
position?RectPosition展开时的不动‘点’位置,以该点为固定

FlashOpt

FlashOpt: Object

闪烁特效参数

Type declaration

NameTypeDescription
duration?number持续时间
times?number闪烁次数

FlowOpt

FlowOpt: Object

线条(虚线)流动特效参数

Type declaration

NameTypeDescription
direction?"clockwise" | "anticlockwise"方向:clockwise(顺时针) | anticlockwise (逆时针)
lineDash?number[]虚线样式, 如: [3, 2]

LayoutAnimationOption

LayoutAnimationOption: Object

Type declaration

NameType
delay?number
direction?"normal" | "reverse" | "alternate" | "alternate-reverse" | "normal"
duration?number
effect?EasingNames
name?string
onEnd?Function
times?number

LinkDirection

LinkDirection: "horizontal" | "vertical"


LinkTarget

LinkTarget: Endpoint | DisplayObject | PointLike | Function


MouseEventType

MouseEventType: "mousedown" | "mouseup" | "mousemove" | "mouseenter" | "mouseout" | "mousewheel" | "click" | "dblclick"

鼠标事件


NearestInfo

NearestInfo: Object

Type declaration

NameType
anchorNamestring
distancenumber
objectany

PickType

PickType: "shape" | "rect"

鼠标拾取方式(节点内容:shape,还是整个节点矩形区域: rect)


PointLike

PointLike: Point | { x: number ; y: number }

Point对象或者拥有x、y的对象


Pojo

Pojo: Object

Index signature

▪ [key: string]: any


RatioDirection

RatioDirection: DirectionType


RectPosition

RectPosition: "lt" | "ct" | "rt" | "lm" | "center" | "rm" | "lb" | "cb" | "rb"

矩形方位


RipplingOpt

RipplingOpt: Object

‘涟漪’特效参数

Type declaration

NameTypeDescription
color?string颜色
count?number圈圈的数量
lineWidth?number圆圈的粗细
radius?number最大半径

SerializedDisplayObject

SerializedDisplayObject: Object

Index signature

▪ [key: string]: any

Type declaration

NameType
begin?{}
beginArrow?{}
classNamestring
end?{}
endArrow?{}
idnumber
image?number
isLayer?boolean
isLink?boolean
isNode?boolean
label?number
name?string
parent?number
shape?any
style?number

SerializedJson

SerializedJson: Object

序列化后的json格式

Type declaration

NameTypeDescription
CustomStyleObject-
DisplayObjectsSerializedDisplayObject[]-
Resourcesany[]-
Rootsany[]-
Shapesany[]-
Stylesany[]-
infostring用户自定义的额外信息
script?any脚本代码
versionstringjtopo版本

Shape_Names

Shape_Names: "diamond"


StageConfig

StageConfig: Object

Type declaration

NameTypeDescription
dropAllowedboolean是否启用drop,默认开启

StageModeType

StageModeType: "normal" | "drag" | "edit" | "view" | "select"

Stage模式


StyleOpt

StyleOpt: Object

Type declaration

NameTypeDescription
background?string设置背景,如: "white url('./assets/img/grid.png') repeat",
backgroundColor?any-
backgroundImage?string背景图片, 如:"ulr('aaaaaa.aa.png')"
backgroundPosition?string-
backgroundRepeat?any-
backgroundSize?string-
border?string边框, 如: solid 1px gray
borderColor?string边框颜色, 如: "gray", "rgb(1,0,0)", "#FF0000"
borderRadius?number边框圆角, 如: 5
borderStyle?null | "solid" | "dashed" | "dotted"边框样式
borderWidth?number边框宽度
color?string文字颜色
fillStyle?string | CanvasGradient | CanvasPattern填充样式
filter?string滤镜效果, 例如: 高斯模糊:'blur(5px)' 灰度: 'grayscale(100%)' 用于将图像转换为灰度的滤镜 褐色: 'sepia(100%)' 用于将图像转换为深褐色的滤镜。 锐化: 'contrast(150%) brightness(120%)' 这种滤镜效果可以增强图像的锐度和清晰度,使其看起来更加清晰、鲜明。 颜色矫正: 'saturate(200%) hue-rotate(180deg)' 这种滤镜效果可以调整图像的色彩和色调,使其看起来更加自然、真实。 反色:'invert(100%)' 这种滤镜效果可以将图像中的颜色反转,从而创建出截然不同的视觉效果。 透明度:'opacity(50%)' 这种滤镜效果可以改变图像的透明度,使其看起来更加半透明或不透明。 饱和度:'saturate(200%)' 这种滤镜效果可以改变图像的饱和度,使其看起来更加鲜艳或柔和。 对比度:'contrast(200%)' 这种滤镜效果可以增加或减少图像的对比度,从而改变其亮度和明暗程度。 色调: 'hue-rotate(90deg)' 用于对图像应用滤镜以设置图像的色调旋转.
font?string文字
fontFamily?string-
fontSize?number-
fontWeight?string-
globalAlpha?number整体透明度
globalCompositeOperation?GlobalCompositeOperation绘制模式
imageSmoothingEnabled?boolean于设置图片是否平滑,也就是是否抗锯齿 true 表示图片平滑(默认值),false 表示图片不平滑 实际应用中有时候设置为false效果反而更好,如果遇到图片模糊的情况,可以尝试修改此属性对比
lineCap?CanvasLineCaplineCap
lineDash?Iterable<number>虚线,例如[3,2]
lineDashOffset?number虚线偏移量
lineHeight?any-
lineJoin?CanvasLineJoinlineJoin
lineSpacing?number文字行间距(不是很精确)
lineWidth?number线宽度
miterLimit?number-
padding?number-
shadowBlur?number阴影
shadowColor?string阴影颜色
shadowOffsetX?number阴影X方向的长度
shadowOffsetY?number阴影y方向的长度
strokeStyle?string | CanvasGradient | CanvasPattern线条样式, 对于Node而言就是边框线条
textAlign?CanvasTextAlign字体左右对齐方式
textBaseline?CanvasTextBaseline字体基线
textOffsetX?number-
textOffsetY?number-
textPosition?string文字位置

TextAlign

TextAlign: "start" | "end" | "left" | "right" | "center"

文本对齐


TextBaseline

TextBaseline: "top" | "bottom" | "middle" | "alphabetic" | "hanging"

文本基线


ToJsonOption

ToJsonOption: Object

Type declaration

NameTypeDescription
imageToBase64?boolean是否将图片以base64的形式内联到json
info?any完全自定义的描述信息, 例如: title: "XXX画面", author:"作者..", date: "2024-02-04", ...
script?string脚本代码(字符串)

UnexpandScaleOpt

UnexpandScaleOpt: Object

节点逐渐收起来的效果参数

Type declaration

NameTypeDescription
minHeight?number收起后的最小高度,默认为0
minWidth?number收起后的最小宽度,默认为0
position?RectPosition收起时的不动‘点’位置,以该点为固定

Vec2

Vec2: [number, number]

Variables

Config

Const Config: Object

Type declaration

NameTypeDescription
DefaultDarkNamestring-
DefaultLightNamestring-
PointClosestEpsilonnumber合并相似点的最小误差
flattenboolean-

Cursor

Const Cursor: Object

Type declaration

NameType
autostring
crosshairstring
e_resizestring
handstring
movestring
n_resizestring
s_resizestring
w_resizestring

Debug

Debug: Object

Type declaration

NameType
debugInfoany
debugMode() => void
isDebugboolean
paintAABBboolean
showFPSboolean

DefaultZIndexs

Const DefaultZIndexs: Object

Type declaration

NameType
EditorNewLinknumber
FullWindowDomnumber
HandlerLayerCanvasnumber
IntersectPointnumber
Linknumber
LinkCtrlBoxnumber
Nodenumber
NodeCtrlBoxnumber

Direction

Const Direction: Object

Position常量

Type declaration

NameType
horizontalstring
verticalstring

EventNames

Const EventNames: Object

Type declaration

NameType
fullWindowstring
groupdragstring
groupdragendstring
modeChangestring
resizestring
selectObjectstring
zoomstring
zoomAfterstring

PI2

Const PI2: number

2 * Math.PI


Position

Const Position: Object

Position常量

Type declaration

NameType
beginstring
cbstring
centerstring
ctstring
ctrlPointstring
ctrlPoint1string
ctrlPoint2string
downstring
endstring
fold1string
fold2string
lbstring
leftstring
lmstring
ltstring
midstring
mid1string
mid2string
neareststring
rbstring
rightstring
rmstring
rtstring
upstring

ResourceLoader

Const ResourceLoader: ResourceSystem


Runtime

Const Runtime: Object

jtopo脚本运行时对象

Type declaration

NameType
execute(script: string, layer: Layer) => void

StageMode

Const StageMode: Object

StageMode 常量

Type declaration

NameType
dragstring
editstring
normalstring
selectstring
viewstring

Theme

Const Theme: any

主题


VERSION

Const VERSION: "#version#"


jtopo

Const jtopo: any

jtopo自身的引用

Functions

getClass

getClass(name): any

Deprecated

Parameters

NameType
namestring

Returns

any


randomColor

randomColor(): string

随机生成颜色(不是完全随机,有jtopo的主题方案) 返回示例: '#c5aa99'

Returns

string

十六进制颜色字符串


regClass

regClass(name, clazz, serializers): void

注册自定义的类(自定义的类需要序列化时)

Deprecated

已过时,推荐使用组合+脚本的形式自定义类

Parameters

NameType
nameany
clazzany
serializersstring[]

Returns

void