logo

X6

  • 文档
  • API
  • 图表示例
  • 常见问题
  • 更新日志
  • XFlow
  • 所有产品antv logo arrow
  • 2.x
  • 画布
    • 画布
    • 网格
    • 背景
    • 画布平移
    • 画布缩放
    • 视口变换
    • 坐标系
  • 元素
    • 元素
    • 节点
    • 边
    • 标签
    • 箭头
    • 元素属性
    • 交互
  • MVC
    • 模型
    • 视图
  • 扩展
    • 节点工具
    • 边上工具
    • 路由
    • 连接器
    • 节点的锚点
    • 边的锚点
    • 连接点
    • 连接桩布局
    • 连接桩标签布局
    • 属性
    • 高亮器
    • 滤镜

画布

下一篇
网格

Resources

Ant Design
Galacea Effects
Umi-React 应用开发框架
Dumi-组件/文档研发工具
ahooks-React Hooks 库

社区

体验科技专栏
seeconfSEE Conf-蚂蚁体验科技大会

帮助

GitHub
StackOverflow

more products更多产品

Ant DesignAnt Design-企业级 UI 设计语言
yuque语雀-知识创作与分享工具
EggEgg-企业级 Node 开发框架
kitchenKitchen-Sketch 工具集
GalaceanGalacean-互动图形解决方案
xtech蚂蚁体验科技
© Copyright 2025 Ant Group Co., Ltd..备案号:京ICP备15032932号-38

Loading...

配置

new Graph(options: Options)
选项类型必选描述默认值
containerHTMLElement✓画布的容器。
widthnumber画布宽度,默认使用容器宽度。-
heightnumber画布高度,默认使用容器高度。-
scaling{ min?: number, max?: number }画布的最小最大缩放级别。{ min: 0.01, max: 16 }
autoResizeboolean | Element | Document是否监听容器大小改变,并自动更新画布大小。false
panningboolean | PanningManager.Options画布是否可以拖拽平移,默认禁用。false
mousewheelboolean | MouseWheel.Options鼠标滚轮缩放,默认禁用。false
gridboolean | number | GridManager.Options网格,默认使用 10px 的网格,但不绘制网格背景。false
backgroundfalse | BackgroundManager.Options背景,默认不绘制背景。false
translatingTranslating.Options限制节点移动。{ restrict: false }
embeddingboolean | Embedding.Options嵌套节点,默认禁用。false
connectingConnecting.Options连线选项。{ snap: false, ... }
highlightingHighlighting.Options高亮选项。{...}
interactingInteracting.Options定制节点和边的交互行为。{ edgeLabelMovable: false }
magnetThresholdnumber | onleave鼠标移动多少次后才触发连线,或者设置为 onleave 时表示鼠标移出元素时才触发连线。0
moveThresholdnumber触发 mousemove 事件之前,允许鼠标移动的次数。0
clickThresholdnumber当鼠标移动次数超过指定的数字时,将不触发鼠标点击事件。0
preventDefaultContextMenuboolean是否禁用浏览器默认右键菜单。true
preventDefaultBlankActionboolean在画布空白位置响应鼠标事件时,是否禁用鼠标默认行为。true
asyncboolean是否异步渲染true
virtualboolean是否只渲染可视区域内容false
onPortRendered(args: OnPortRenderedArgs) => void当某个连接桩渲染完成时触发的回调。-
onEdgeLabelRendered(args: OnEdgeLabelRenderedArgs) => void当边的文本标签渲染完成时触发的回调。-
createCellView(cell: Cell) => CellView | null | undefined是自定义元素的视图。-