WeaveArrowNode

Overview

The WeaveArrowNode class represents a basic arrow shape within the Weave.js canvas.

Built on top of Konva’s Arrow class shape under the hood, the WeaveArrowNode offers a simple yet powerful primitive that supports full interaction, styling, and real-time synchronization.

Arrow are ideal for:

Point to important stuff on whiteboards.
Connect flows of ideas.

The class extends the WeaveNode class

Type

This node nodeType property value is arrow.

Import

import { WeaveArrowNode } from "@inditextech/weave-sdk";

Instantiation

new WeaveArrowNode(params?: WeaveArrowNodeParams);

TypeScript types

type WeaveNodeTransformerProperties = Konva.TransformerConfig;

type WeaveArrowProperties = {
  transform: WeaveNodeTransformerProperties;
};

type WeaveArrowNodeParams = {
  config: Partial<WeaveArrowProperties>;
};

Parameters

For WeaveArrowNodeParams:

Prop	Type	Default
`config`	`Partial<WeaveArrowProperties>`	-

For WeaveArrowProperties:

Prop	Type	Default
`transform?`	`object`	`check default values`

Default values

const WEAVE_TRANSFORMER_ANCHORS = {
  ["TOP_LEFT"]: "top-left",
  ["TOP_CENTER"]: "top-center",
  ["TOP_RIGHT"]: "top-right",
  ["MIDDLE_RIGHT"]: "middle-right",
  ["MIDDLE_LEFT"]: "middle-left",
  ["BOTTOM_LEFT"]: "bottom-left",
  ["BOTTOM_CENTER"]: "bottom-center",
  ["BOTTOM_RIGHT"]: "bottom-right",
};

const WEAVE_DEFAULT_ENABLED_ANCHORS: string[] = Object.values(
  WEAVE_TRANSFORMER_ANCHORS
);

const WEAVE_DEFAULT_TRANSFORM_PROPERTIES: WeaveNodeTransformerProperties = {
  rotateEnabled: true,
  resizeEnabled: true,
  enabledAnchors: WEAVE_DEFAULT_ENABLED_ANCHORS,
  borderStrokeWidth: 3,
  padding: 0,
};