Rect 矩形
阅读时间约 1 分钟
矩形是一个四边相等的几何形状,具有明确的边界。
适用场景:
用于表示模块、组件或容器。
适合表示层次结构,如组织结构图、文件目录树。
常用于流程图、架构图、UML 图等。
createGraph({autoFit: 'center',data: { nodes: [{ id: 'node1', style: { size: 40, fill: '#7e3feb' } }] },node: { type: 'rect' },plugins: [{ type: 'grid-line', size: 30 }],},{ width: 600, height: 220 },(gui, graph) => {gui.add({ type: 'rect' }, 'type').disable();const options = { 'size[0]': 48, 'size[1]': 24 };const optionFolder = gui.addFolder('rect.style');optionFolder.add(options, 'size[0]', 0, 100, 1);optionFolder.add(options, 'size[1]', 0, 100, 1);optionFolder.onChange(({ object }) => {graph.updateNodeData([{ id: 'node1', style: { size: [object['size[0]'], object['size[1]']] } }]);graph.render();});},);
设置 node.type
为 rect
以使用矩形节点。
如果元素有其特定的属性,我们将在下面列出。对于所有的通用样式属性,见BaseNode