logo

X6

  • Tutorials
  • API
  • Examples
  • Q&A
  • Change Log
  • XFlow
  • Productsantv logo arrow
  • 2.x
  • Introduction
  • Quickstart
  • Basic
    • Graph
    • Nodes
    • Edges
    • Connection Pile
    • Interaction
    • Events
    • Data Serialization
  • Intermediate
    • Connection Points
    • Tools
    • Group
    • React Nodes
    • Vue Nodes
    • Angular Nodes
    • HTML Nodes
  • Plugin
    • Graphic Transformations
    • Snapline
    • Clipboard
    • Keyboard
    • History
    • Selection Box
    • Scroller
    • Dnd
    • Mini Map
    • Stencil
    • Export
  • Upgrade to Version 2.x
  • Developer Tools

Upgrade to Version 2.x

Previous
Export
Next
Developer Tools

Resource

Ant Design
Galacea Effects
Umi-React Application Framework
Dumi-Component doc generator
ahooks-React Hooks Library

Community

Ant Financial Experience Tech
seeconfSEE Conf-Experience Tech Conference

Help

GitHub
StackOverflow

more productsMore Productions

Ant DesignAnt Design-Enterprise UI design language
yuqueYuque-Knowledge creation and Sharing tool
EggEgg-Enterprise-class Node development framework
kitchenKitchen-Sketch Tool set
GalaceanGalacean-Interactive solution
xtechLiven Experience technology
© Copyright 2025 Ant Group Co., Ltd..备案号：京ICP备15032932号-38

Loading...

Compared to version 1.x, the changes to the external API and configuration are minimal, allowing for an upgrade to version 2.0 at a low cost.

Upgrade Reference

package.json

{
  "@antv/x6": "^2.0.0",
  "@antv/x6-plugin-clipboard": "^2.0.0", // Install this package if using clipboard functionality
  "@antv/x6-plugin-history": "^2.0.0", // Install this package if using undo/redo functionality
  "@antv/x6-plugin-keyboard": "^2.0.0", // Install this package if using keyboard shortcut functionality
  "@antv/x6-plugin-minimap": "^2.0.0", // Install this package if using minimap functionality
  "@antv/x6-plugin-scroller": "^2.0.0", // Install this package if using scrollable canvas functionality
  "@antv/x6-plugin-selection": "^2.0.0", // Install this package if using selection box functionality
  "@antv/x6-plugin-snapline": "^2.0.0", // Install this package if using alignment line functionality
  "@antv/x6-plugin-dnd": "^2.0.0", // Install this package if using drag-and-drop functionality
  "@antv/x6-plugin-stencil": "^2.0.0", // Install this package if using stencil functionality
  "@antv/x6-plugin-transform": "^2.0.0", // Install this package if using shape transformation functionality
  "@antv/x6-plugin-export": "^2.0.0", // Install this package if using image export functionality
  "@antv/x6-react-components": "^2.0.0", // Install this package if using accompanying UI components
  "@antv/x6-react-shape": "^2.0.0", // Install this package if using React rendering functionality
  "@antv/x6-vue-shape": "^2.0.0" // Install this package if using Vue rendering functionality
}

Configuration Changes

Property NameChangeDescription
virtualAddedWhether to enable visual area rendering capability, default value is false.
asyncDefault value changed to trueDefault asynchronous rendering for improved performance.
sortingRemovedSorting is done in the most performance-optimized way; if special sorting is needed, the order of input data must be controlled externally.
frozenRemovedThe new asynchronous rendering mode does not require frozen.
checkViewRemovedBuilt-in visual area rendering capability, enabling virtual configuration.
transformingRemovedDefault uses optimal configuration, no external configuration needed.
knobRemovedNot widely used, removed in version 2.0.
resizingRemovedUse the transform plugin.
rotatingRemovedUse the transform plugin.
selectingRemovedUse the selection plugin.
clipboardRemovedUse the clipboard plugin.
snaplineRemovedUse the snapline plugin.
historyRemovedUse the history plugin.
scrollerRemovedUse the scroller plugin.
keyboardRemovedUse the keyboard plugin.

API Changes

Method NameChangeDescription
graph.getCellRemovedReplaced with getCellById.
graph.resizeGraphRemovedReplaced with resize.
graph.resizeScrollerRemovedReplaced with resize.
graph.getAreaRemovedReplaced with getGraphArea.
graph.resizePageRemovedProvided by the scroller plugin.
graph.scrollToPointRemovedProvided by the scroller plugin.
graph.scrollToContentRemovedProvided by the scroller plugin.
graph.scrollToCellRemovedProvided by the scroller plugin.
graph.transitionToPointRemovedProvided by the scroller plugin.
graph.transitionToRectRemovedProvided by the scroller plugin.
graph.isFrozenRemovedIn the new rendering mode, frozen related methods are not needed.
graph.freezeRemovedIn the new rendering mode, frozen related methods are not needed.
graph.unfreezeRemovedIn the new rendering mode, frozen related methods are not needed.
graph.isAsyncRemovedRemoved async related methods.
graph.setAsyncRemovedRemoved async related methods.
graph.isViewMountedRemovedInfrequently used method, removed in version 2.0.
graph.getMountedViewsRemovedInfrequently used method, removed in version 2.0.
graph.getUnmountedViewsRemovedInfrequently used method, removed in version 2.0.
graph.getClientMatrixRemovedInfrequently used method, removed in version 2.0.
graph.getPageOffsetRemovedInfrequently used method, removed in version 2.0.
graph.removeToolsRemovedInfrequently used method, removed in version 2.0.
graph.hideToolsRemovedInfrequently used method, removed in version 2.0.
graph.showToolsRemovedInfrequently used method, removed in version 2.0.
graph.printPreviewRemovedInfrequently used method, removed in version 2.0.
cell.animateRemovedWill be provided by the animation plugin in the future.
cell.animateTransformRemovedWill be provided by the animation plugin in the future.
edge.sendTokenRemovedWill be provided by the animation plugin in the future.

Using x6-react-shape

For details on using x6-react-shape, please refer to the documentation.

Using x6-vue-shape

For details on using x6-vue-shape, please refer to the documentation.

Using x6-angular-shape

For details on using x6-angular-shape, please refer to the documentation.

Plugin Usage

For details on using plugins, please refer to the documentation.