0.0.88 • Published 6 months ago
coco-mxgraph-editor v0.0.88
mxgraph editor
基于 mxgraph,vue3,typescript 的 editor 组件
<template>
<MyDraw :nodes="[]" />
</template>
<script setup lang="ts">
import { MyDraw } from "coco-mxgraph-editor"
import "coco-mxgraph-editor/dist/style.css"
</script>
props
nodes
SidebarNode[]
出现在侧边栏的节点
interface SidebarNode {
name: string
nodes?: SidebarNodeConfig[]
children?: SidebarNode[]
}
interface SidebarNodeConfig {
name: string
style: string
type: ItemType
width: number
height: number
value?: string
info?: Record<string, any>
}
hideSidebar
隐藏侧边栏
boolean
toolbar
自定义 toolbar
string[]
//默认值
// ['undo', 'redo', 'zoomIn', 'zoomOut', 'delete']
handleAddVertex?
添加 vertex 节点触发
(
cell: mxCell,
x: number,
y: number,
target: mxCell
) => void
handleDeleteCell?
删除节点触发
(cell: mxCell) => void
handleAddEdge?
添加 edge 节点触发
(cell: mxCell) => void
handleMoveCell?
移动节点触发
(cell: mxCell) => void
cellRightClick?
自定义侧边栏
(cells: mxCell[], menu: mxPopupMenuHandler) => void
beforeDeleteCell?
删除节点前触发,返回false
不会触发删除
(cell: mxCell) => boolean
beforeAddCell?
添加节点前触发,返回false
不会添加节点
(cell: mxCell) => boolean
连接规则
mx.mxConnectionHandler.prototype.connect = function (
source: mxCell,
target: mxCell,
evt: MouseEvent,
dropTarget: mxCell
) {
this.originConnect.apply(this, arguments as any)
}
outlineMap
鸟瞰图
boolean
0.0.84
10 months ago
0.0.86
10 months ago
0.0.87
8 months ago
0.0.88
6 months ago
0.0.81
12 months ago
0.0.82
12 months ago
0.0.83
11 months ago
0.0.77
1 year ago
0.0.78
1 year ago
0.0.79
1 year ago
0.0.73
1 year ago
0.0.74
1 year ago
0.0.75
1 year ago
0.0.76
1 year ago
0.0.71
1 year ago
0.0.72
1 year ago
0.0.8
1 year ago
0.0.7
1 year ago
0.0.6
1 year ago
0.0.58
1 year ago
0.0.56
1 year ago
0.0.55
1 year ago
0.0.53
1 year ago
0.0.52
1 year ago
0.0.51
1 year ago
0.0.5
1 year ago
0.0.4
1 year ago
0.0.3
1 year ago
0.0.2
1 year ago
0.0.1
1 year ago
0.0.0
1 year ago