!!!###!!!title=角标——VisActor/VGraph 教程文档!!!###!!!

角标工具

自定义节点是图可视化应用研发最大的痛点之一。vGraph 总结了业务中常用的自定义节点组件抽象成可配置的工具方法,帮助大家解决一些不方便实现的视觉效果。

角标多用于展示数据异常或者需要关注的补充信息。vGraph 封装了角标的定义工具,并可以配合自带的 Tooltip 等组件一同使用达到更好的提示体验。可以参考示例角标节点

import { NoteMarkerUtils, Layer } from '@visactor/vgraph';

// container 是标签容器,一般情况下是节点自定义传入的参数 Layer
const container = new Layer({...});

// 生成角标
const markerLayer = MarkerUtils.init(container, markerOption);
字段类型描述
widthnumber[必填] 角标长度
heightnumber[必填] 角标高度
position'left' | 'right'角标相对于节点的位置,目前支持左上和右上方向
radiusnumber自定义角标的圆角
triggerIdstring能与原生和 React 组件 Tooltip 配合使用触发提示