Line

The Line component is used to draw paths, directions, workflows, connections, or illustrative outlines within a scene. It is widely applied in scenarios such as process flow visualization, pipeline routing explanation, spatial guidance, and logical relationship annotation.

Lines support multi-segment polylines, customizable styles, and directional arrows, making them one of the core components in the iCraft editor that combines both expressiveness and connectivity.

---

How to Draw a Line?

Create a Line

• Click the Line icon in the system asset library, or drag the icon directly onto the canvas.

• If there are already elements on the canvas:

  • Click an existing element, then click the Line icon in the floating toolbar on the right. This allows you to quickly create a line starting from that element and connect it to another element. When the connected elements move, the line will automatically remain attached.

  • Alternatively, click on an empty area of the canvas to create control anchor points and freely draw a line. Press ENTER to finish drawing.

---

Edit a Line

• Drag Nodes After selecting a line, you can drag the control anchor points along the path to adjust its direction.

• Add Nodes With the line selected, click anywhere along the path to insert a new control anchor point.

• Delete Nodes Select a control anchor point and press Delete to remove it.

• Create Line Branches Select a control anchor point and click the 「Arrow」 icon in the floating toolbar on the right to create a new branch line starting from that point.

• Insert Text Select a control anchor point and click the 「Text」 icon in the floating toolbar to add a text annotation at that point.

---

Special Parameters of the Line

Shape

Routing Mode Determines how line segments connect to each other. Select from the dropdown menu. iCraft provides four common routing styles:

• Normal Routing – Straight lines at any angle; suitable for scenes requiring high flexibility.

• Orthogonal Routing – 90° horizontal/vertical lines; suitable for clearly structured diagrams emphasizing engineering standards.

• 45° Routing – Balances engineering style and visual aesthetics; commonly used in workflow or system diagrams.

• Curved Routing – Ideal for flexible connections, complex paths, or irregular routes.

---

Style

• Color Sets the display color of the line using the color picker. Default color: #000000

• Line Width Controls the thickness of the line. Default value: 0.05 Adjustable range: 0.01 – 0.2

• Dashed Line Toggle switch. Controls whether the line is displayed as a dashed line. Default: Off (solid line)

• Dash Scale Effective only when Dashed Line is enabled. Controls the density of the dashed pattern. Smaller values produce longer dashes and wider spacing. Default value: 1 Adjustable range: 0.1 ~ 10

---

Arrow

• Visible Toggle switch. Determines whether an arrow is displayed at the end of the line. Default: Enabled

• Two-Way Toggle switch. Determines whether arrows appear at both ends of the line. Default: Disabled

• Size Defines the size of the arrow. Default value: 0.05 Adjustable range: 0.01 ~ 0.2

• Position Controls the offset ratio of the arrow along the end of the line. Default value: 1 (at the end of the line) Adjustable range: 0 ~ 1