ve.NodeEditor

ve.Component. ve.NodeEditor

Refer to ve.Component for methods or fields inherited from this Component's parent such as .options.attributes or .element.

Creates a drag-and-drop Node Editor using Maptalks as a backend. Nodes are executed from a root node using a parallelised version of Kahn's algorithm, and nodes must form a directed acyclic graph (DAG). Circular references will not be executed if forced.

Compilation for ve.NodeEditor is 3-way and roundtrippable between Nodes <-> Code <-> Blocks through the default visual editor, as NodeEditor extends ve.ScriptManager and its subcomponents. Nodes can be recursively grouped via custom nodes creation and Forse support. Round-tripping is ES6+ compatible.

If you need a loop, call async run() multiple times instead. For Forse as a DSL, see ve.NodeEditor.Forse.

  • Functional binding: veNodeEditor().
Constructor:
  • arg0_value: Object - The JSON object for the Maptalks instance attached to the current NodeEditor, including properties data.
  • arg1_options: Object
    • .bg_ctx: function | Object - Returns the context of a Canvas.
    • .category_types: Object
      • <category_key>: Object
        • .colour: Array<number, number, number>|string - Either a hex/RGB value.
    • .disable_custom_nodes=false: boolean - Whether to disable custom nodes editing.
    • .disable_file_explorer=false: boolean - Whether to disable the leftbar file explorer, used for saving/loading files.
    • .disable_forse=false: boolean - Whether to disable Forse Nodes, which is the default DSL used by Vercengen.
    • .exclude_all=false: boolean - Whether to exclude the default 'All' category at the start.
    • .node_types: Object
      • <node_key>: Object - Current valid types for .input_parameters and .output_type include 'any'/'number[]'/'string[]'/'boolean'/'number'/'script'/'string'.
        • .category="Expression" - The category that any ve.NodeEditorDatatype instances should belong to. Typically should either be 'Filter'/'Expression'.
        • .input_parameters=[]: Array<Object> - The types of input parameters that will be accepted for evaluation.
          • [n]: Object
            • .name: string
            • .type: string
        • .output_type="any": string
      • .name: string
      • .output_type="any": string - What the output (return) type is regarded as being. There can only be a single return type per Node, similar to functions in most programming languages.
      • .special_function: function(argn_arguments:any) ¦ Object
        • Returns:
        • .abort=false: boolean - Whether to abort the current node branch from further execution (conditional branching).
        • .alluvial_width=1: number
        • .display_value: string - The actual display_value to show.
        • .iterations=1; number - The number of iterations to run for sub-nodes.
        • .run: function - The actual expression to execute upon running it in non-preview mode.
        • .value: any - If a filter, it should return an Array<any>.
      • .options: Object
        • .alluvial_scaling=1: number - How much to scale alluvial widths by when displayed compared to their actual number.
        • .id=Class.generateRandomID(ve.NodeEditorDatatype): string - The ID to assign to the present datatype at a class level.
        • .show_alluvial=false: boolean
    • .project_folder: string
    • .save_extension=".ve-ne": string
Instance:
  • .id: string
  • .main: Object
    • .variables: Object - Where values during the run-cycle are stored.
  • .map: maptalks.Map - Not an actual map instance. Used for rendering the node environment in 3D space.
  • .node_layer: maptalks.VectorLayer
  • .v: Object
Methods:

Note. User interactions are privated within ve.NodeEditor.

  • _connect(arg0_node:ve.NodeEditorDatatype, arg1_node:ve.NodeEditorDatatype, arg2_index:number, arg3_options:Object)

  • _disconnect(arg0_node:ve.NodeEditorDatatype, arg1_node:ve.NodeEditorDatatype, arg2_index:number)

  • _select(arg0_node:ve.NodeEditorDatatype, arg1_index:number)

  • clear()

  • drawToolbox()

  • getCanvas() | HTMLCanvasElement

  • getDAGSequence() | Array<Array<ve.NodeEditorDatatype>>

  • getDefaultBaseLayer() | Object

  • loadSettings(arg0_settings:Object)

  • async run(arg0_preview_mode:boolean) | Object

  • createCustomExecutionLogic(arg0_subgraph:Object)

  • deleteCustomNode(arg0_key:string)

Static Fields:
  • .instances: Array<ve.NodeEditor>

Constructor

new ve.NodeEditor()

Source:

Extends

Classes

ve.NodeEditor.Forse

Members

v :Object

Returns the current JSON object from the component.

  • Accessor of: ve.NodeEditor
Source:
Type:

v :Object

Sets the current value of the ve.NodeEditor from available JSON.

  • Accessor of: ve.NodeEditor
Source:
Type:

from_binding

Internal .from_binding setter for handling .options.from_binding. Accepts a string literal that is then parsed to a variable reference.

.to_binding counterparts are manually handled child-side.

Overrides:
Source:

instances :Array.<ve.NodeEditor>

Source:
Type:

limit

Tests the current this.limit by calling this.limit_function(this.v, this). Otherwise resolves to true if no .options.limit is set.

Overrides:
Source:

name

Returns the visual name of the present ve.Component,

Overrides:
Source:

Methods

_connect(arg0_node, arg1_node, arg2_index, arg3_optionsopt)

UI function. Draws a connection between two nodes as a user interaction.

  • Method of: ve.NodeEditor
Source:
This:
  • ve.NodeEditor
Parameters:
Name Type Attributes Description
arg0_node ve.NodeEditorDatatype
arg1_node ve.NodeEditorDatatype
arg2_index number
arg3_options Object <optional>
Name Type Attributes Description
toggle_connection boolean <optional>

_disconnect(arg0_node, arg1_node, arg2_index)

UI function. Disconnects two nodes as a user interaction.

  • Method of: ve.NodeEditor
Source:
This:
  • ve.NodeEditor
Parameters:
Name Type Description
arg0_node ve.NodeEditorDatatype
arg1_node ve.NodeEditorDatatype
arg2_index number

_select(arg0_node, arg1_index)

UI function. Selects a node index.

  • Method of: ve.NodeEditor
Source:
This:
  • ve.NodeEditor
Parameters:
Name Type Description
arg0_node ve.NodeEditorDatatype
arg1_index number

addComponent()

Adds the current component to this.parent_el should it exist.

Overrides:
Source:

bind(arg0_container_el)

Manually binds/mounts the present ve.Component into the visual DOM.

Overrides:
Source:
Parameters:
Name Type Description
arg0_container_el HTMLElement

drawToolbox()

Draws the toolbox UI and displays it in a ve.Window.

  • Method of: ve.NodeEditor
Source:
This:
  • ve.NodeEditor

fireFromBinding()

Pseudo-setter from binding. Fires only upon program-driven changes to .v directly, which means that this has to be monitored manually component-side in set v(). This should always come last in set v().

Overrides:
Source:

fireToBinding()

Pseudo-setter to binding. Fires only upon user-driven changes, which means that this has to be monitored manually component-side.

Overrides:
Source:

openCustomNodeEditor(arg0_edit_key)

Opens custom node editor window. Can optionally edit an existing node.

  • Method of: ve.NodeEditor
Source:
This:
  • ve.NodeEditor
Parameters:
Name Type Description
arg0_edit_key string

Optional. Edits the existing custom node with this key.

remove()

Removes the component/element from the DOM.

Overrides:
Source:

removeComponent()

Removes the current component from this.parent_el should it exist.

Overrides:
Source:

setOwner(arg0_value, arg1_owner_array)

Sets the root parent and ownership tree. Influences this.parent_el, this.owner, this.owners.

Overrides:
Source:
Parameters:
Name Type Description
arg0_value
arg1_owner_array

setValueFromObject(arg0_object, arg1_object)

Destructures Object values and transfers them into the .v instance fields of each Vercengen component.

Overrides:
Source:
Parameters:
Name Type Description
arg0_object Object

The Vercengen object to transfer to.
arg1_object Object

The other object to transfer from.