Svelte Flow

学习参考示例
GitHub 中文支持我们
  • API 参考
  • <SvelteFlow />
  • <SvelteFlowProvider />
  • 组件
    • <Background />
    • <BaseEdge />
    • <ControlButton />
    • <Controls />
    • <EdgeLabelRenderer />
    • <EdgeLabel />
    • <Handle />
    • <MiniMap />
    • <NodeResizer />
    • <NodeResizeControl />
    • <NodeToolbar />
    • <Panel />
  • 钩子
    • useConnection()
    • useEdges()
    • useHandleConnections()
    • useInternalNode()
    • useNodes()
    • useNodesData()
    • useNodesInitialized()
    • useSvelteFlow()
    • useStore()
    • useUpdateNodeInternals()
  • 类型
    • BackgroundVariant
    • ColorMode
    • Connection
    • ConnectionLineType
    • CoordinateExtent
    • DefaultEdgeOptions
    • Edge
    • EdgeMarker
    • EdgeProps
    • FitViewOptions
    • InternalNode
    • KeyDefinition
    • MarkerType
    • Node
    • NodeProps
    • NodeOrigin
    • PanelPosition
    • Position
    • SvelteFlowStore
    • Viewport
    • XYPosition
    • addEdge()
    • getBezierPath()
    • getConnectedEdges()
    • getIncomers()
    • getNodesBounds()
    • getOutgoers()
    • getSimpleBezierPath()
    • getSmoothStepPath()
    • getStraightPath()
    • getViewportForBounds()
    • isEdge()
    • isNode()

本页内容

  • 字段
  • 备注
有问题?给我们反馈 →编辑此页面这里有什么新内容?
参考类型
Viewport

Viewport

在内部,Svelte Flow 保持一个独立于页面其余部分的坐标系。该 Viewport 类型告诉您您的流程当前在该系统中的哪个位置以及它的缩放程度。

export type Viewport = {
  x: number;
  y: number;
  zoom: number;
};

字段

名称类型
#x
number
#y
number
#zoom
number

备注

  • A Transform 具有与视窗相同的属性,但它们代表不同的东西。确保您不要把它们弄混,否则事情将变得很奇怪!
类型

xyflow 团队的一个项目

自 2019 年以来,我们一直在构建和维护用于基于节点的 UI 的开源软件。

文档

快速入门指南API 参考示例展示支持我们

社交

DiscordGithubX / TwitterBluesky

xyflow

博客开源关于联系
职业 招聘中

法律

MIT 许可证行为准则

info@xyflow.com — 版权所有 ©2024 webkid GmbH. 保留所有权利 — 网站设计由 Facu Montanaro