Skip to main content

SmartStepEdge

SmartStepEdge uses orthogonal-only jump-point pathfinding and draws straight segments, the smart equivalent of React Flow's StepEdge.

import { SmartStepEdge } from "@tisoap/react-flow-smart-edge";

const edgeTypes = { smartStep: SmartStepEdge };

Tuned example​

Lower gridRatio for finer routing:

import { createSmartEdge } from "@tisoap/react-flow-smart-edge";

const edgeTypes = {
  smartStep: createSmartEdge("step", { gridRatio: 5 }),
};

Hops​

Step edges can draw circuit-style bridge arcs where they cross each other. See hops.