Vecta

Vecta

The main Vecta namespace.

Classes

Connect
Control
Document
Guide
Layer
Length
Menu
Page
Plugin
Selection
Shape
Stencil
Symbol

Namespaces

.selection

Properties

.activeDocVecta.Document

When a drawing is opened in a Vecta application, the drawing essentially becomes the active document.

To modify the current drawing, use the exposed methods and properties for Vecta.activeDoc.

NameTypeDescription
activeDocVecta.Document

The current active document.

Examples:
//Get the active document and return the id
var id = Vecta.activeDoc.id();

//Change the title for the current drawing
Vecta.activeDoc.title('My new title');
See also:

.activeLayerVecta.Layer

Each page can have multiple layers, but only a single layer can be the current active layer, where all shapes (except those that already have a layer) will be placed on the current active layer.

To obtain a reference to the active layer, use Vecta.activeLayer.

Once a reference has been obtained, you can use the exposed Vecta.Layer methods to modify the layer.

NameTypeDescription
activeLayerVecta.Layer

The current active layer.

Examples:
//Get the current active layer's name
var layer_name = Vecta.activeLayer.name();
See also:

.activePageVecta.Page

While each Vecta.Document can have one or more pages, only a single page can be active at any single time.

To get a reference to the current active page, use Vecta.activePage.

Once a reference has been obtained, you can use the Vecta.Page methods to modify the current active page.

NameTypeDescription
activePageVecta.Page

The current active page.

Examples:
//Get the number of shapes on the active page
var count = Vecta.activePage.shapeCount();
See also:

Methods

.createStencil([name], [callback])

Creates a new stencil. By default, the user is the owner, except for stencils created in a team drawing where the team will be the owner.

NameTypeAttributesDefaultDescription
namestringoptionalUntitled Stencil

Name of the new stencil.

callbackfunctionoptional

Optional callback function to execute upon completion of create stencil.

Examples:
//create a new stencil named "Untitled Stencil"
Vecta.createStencil();
See also:

.hideMessage()

Hides the message shown by Vecta.showMessage.

If message is not shown, there will be no effect.

Examples:
Vecta.hideMessage(); //Hide the message
See also:

.loadStencil(id, [options], [callback])

Loads a stencil with the given ID.

NameTypeAttributesDescription
idstring

The ID of the stencil to load.

optionsobjectoptional

Optional parameters to determine how the stencil should be loaded.

NameTypeAttributesDefaultDescription
expandnumberoptionaltrue

To expand or collapse the stencil. True to expand, false to collapse.

namenumberoptional1

To show or hide symbol name. True to show, false to hide.

callbackfunctionoptional

Optional callback function to execute upon completion of loading stencil.

Examples:
//load the stencil with id === xxx onto the editor
Vecta.loadStencil('xxx');
See also:

.off(events, [selector]) Returns: Vecta

Function to turn off event listeners.

NameTypeAttributesDescription
eventsstring

One or more events to turn off.

selectorstringoptional

A selector which should match the one when attaching event handlers.

Examples:
Vecta.off('selectionModified.Vecta', function() {});

.on(events, handler) Returns: Vecta

Function to listen to events.

NameTypeDescription
eventsstring

One or more events to listen to.

handlerfunction

The event handler.

Examples:
Vecta.on('selectionModified.Vecta', function() {});

.once(events, handler) Returns: Vecta

Function to listen to events once only, after which the event listener will be removed.

NameTypeDescription
eventsstring

One or more events to listen to.

handlerfunction

The event handler.

Examples:
Vecta.once('selectionModified.Vecta', function() {});

.showMessage(mssg, [loading])

Show centered message in the application, suitable to indicate operations being performed.

NameTypeAttributesDefaultDescription
mssgstring

The message to be shown

loadingbooleanoptionalfalse

Show loading animation

Examples:
//Show message with loading animation
Vecta.showMessage('Message', true);
See also:

Events

selectionModified.Vecta

Indicates that the selection has changed through user interface.

Examples:
//Attach listener to selection modified and log the number of shapes
Vecta.on('selectionModified.Vecta', function () {
    console.log(Vecta.selection.length());
});

shapesAdded.Vecta

Fired when shapes has been added to the drawing.

shapesDeleted.Vecta

Fired when shapes has been deleted on the drawing.

shapesMoved.Vecta

Fired when shapes has been moved on the drawing.

textChanged.Vecta

Fired when text on a shape has been modified.