基于 mxgraph,vue3,typescript 的 editor 组件
npm install coco-mxgraph-editor基于 mxgraph,vue3,typescript 的 editor 组件
``ts`
SidebarNode[]
出现在侧边栏的节点
`ts
interface SidebarNode {
name: string
nodes?: SidebarNodeConfig[]
children?: SidebarNode[]
}
interface SidebarNodeConfig {
name: string
style: string
type: ItemType
width: number
height: number
value?: string
info?: Record
}
`
隐藏侧边栏
`ts`
boolean
自定义 toolbar
`ts`
string[]
//默认值
// ['undo', 'redo', 'zoomIn', 'zoomOut', 'delete']
添加 vertex 节点触发
`ts`
(
cell: mxCell,
x: number,
y: number,
target: mxCell
) => void
删除节点触发
`ts`
(cell: mxCell) => void
添加 edge 节点触发
`ts`
(cell: mxCell) => void
移动节点触发
`ts`
(cell: mxCell) => void
自定义侧边栏
`ts`
(cells: mxCell[], menu: mxPopupMenuHandler) => void
删除节点前触发,返回false不会触发删除
`ts`
(cell: mxCell) => boolean$3
添加节点前触发,返回false不会添加节点
`ts`
(cell: mxCell) => boolean`连接规则
ts`
mx.mxConnectionHandler.prototype.connect = function (
source: mxCell,
target: mxCell,
evt: MouseEvent,
dropTarget: mxCell
) {
this.originConnect.apply(this, arguments as any)
}
ts
boolean
``