Foblex Flow
Introduction
Overview
Nodes
Custom Nodes
Drag Handle
Node Selection
Resize Handle
Rotate Handle
Grouping
Drag to Group
Connectors
Node as Connector
Connector Inside Node
Connector Outlet
Limiting Connections
Connection Rules
Connectable Side
Updated
Connections
Drag to Connect
Drag to Reassign
Create Node on Connection Drop
Remove Connection on Drop
Assign Node to Connection on Drop
Auto Snap
Connection Types (Straight, Segment, Bezier, Adaptive Curve)
Custom Connection Type
Connection Behaviours
Connection Markers
Connection Content
Updated
Connection Waypoints
New
Connection Gradients
Updated
Connection Connectable Side
New
Extensions
Auto Pan
New
Add Node from Palette
Selection Area
Help in Positioning (Legacy)
Deprecated
Magnetic Lines
New
Magnetic Rects
New
Grid System
Minimap
Zoom
Background
Plugins
Dagre Layout
New
Dagre Auto Layout
New
ELK.js Layout
New
ELK.js Auto Layout
New
Advanced
Large Scene Performance
Connection Redraw Performance
Updated
Cut/Copy/Paste
Undo/Redo
Undo/Redo V2
Drag Start/End Events
Custom Event Triggers
Reference Apps
AI Low-Code Platform
Updated
Schema Designer
Updated
Call Center Flow
Updated
UML Diagram
Updated
Tournament Bracket
Updated
Foblex Flow

Help in Positioning (Deprecated)

Description

This example documents an older approach to positioning helpers in Foblex Flow for Angular. It is kept for reference and backward compatibility, but it is not the recommended starting point for new projects.

For the current and improved UX, use:

Example

[example.html] <<< https://raw.githubusercontent.com/Foblex/f-flow/main/libs/f-examples/extensions/help-in-positioning/example.html [example.ts] <<< https://raw.githubusercontent.com/Foblex/f-flow/main/libs/f-examples/extensions/help-in-positioning/example.ts [example.scss] <<< https://raw.githubusercontent.com/Foblex/f-flow/main/libs/f-examples/extensions/help-in-positioning/example.scss

What this legacy example demonstrates

  • Basic help while dragging for aligning nodes
  • A minimal setup inside <f-flow> using the older implementation

If you are building a modern node editor, prefer Magnetic Lines and Magnetic Rects instead. This legacy page stays noindex on purpose because the newer examples are the correct recommendation for search traffic and new implementations.

Related docs

Edit this page on GitHub