知识图谱可视化

API

createForceActions()

此方法生成实例为图谱展示的数据管理实例，必不可少；

actions.addData(GraphData, isReplace = false)

往当前图谱中添加数据，数据格式固定；isReplace 为 true 的时候会替换当前所有数据

deleteNodeByIds([ids], deleteAloneNodes = false)

根据节点 ids 删除节点以及关联的边，如果deleteAloneNodes === true，会连带删除孤立点，这里有两个逻辑（1.有主节点，会删除所有不和主节点关联的节点 2.没有主节点，删除所有孤立节点）

deleteEdgeByIds([ids], deleteAloneNodes = false)

根据边 ids 删除边，如果deleteAloneNodes === true，会连带删除孤立点，这里有两个逻辑（1.有主节点，会删除所有不和主节点关联的节点 2.没有主节点，删除所有孤立节点）

actions.prev()

撤销，当actions.prevStack.length !== 0的时候可以调用

actions.next()

重做，当actions.nextStack.length !== 0的时候可以调用

actions.fixedNode(node)

钉住节点（钉住后图布局将不会对钉住的节点布局，钉住后点的的属性fixed===true）；如果已经钉住的再次调用将会解除锁定

actions.fixedNodes(nodes)

钉住所有节点

actions.unFixedNodes(nodes)

解除钉住节点

actions.setAllMode(mode='default')

设置所有点和边的模式，可选的有[default,highlight,unHighlight]

actions.highlightNode(node)

设置点高亮（同时和它连接的点和边变成default，其他的点和边变成unHighlight）

actions.highlightEdge(edge)

设置边高亮（同时和它连接的点变成default）

actions.exportImage(fileName)

当前图谱保存为图片，格式支持 jpeg|png|svg

actions.adaption(minScale=undefined)

自适应当前视图大小；minScale为最小缩放量

actions.zoomTo(scale)

缩放为原图的 scale 倍

actions.reLayout()

重新布局

actions.focus(node)

聚焦到某个节点

actions.focusById(nodeId)

聚焦到某个节点

actions.packNode(node)

收缩某节点的叶子节点

Layout

内置了以下布局

{
    force: '力导布局',
    tree: '树形布局',
    grid: '网格布局'
}

如果需要实现自定义布局，需要继承BasicLayout类实现

数据说明

Node

{
    id: String,
    type: String,
    label: String,
    nodeSize: 60,
    ...other
}

Edge

{
    id: String,
    target: String,
    source: String,
    type: String,
    label: String,
    ...other
}

GraphData

{
    nodes: Node[],
    edges: Edge[]
}