---
title: "Layers and Objects"
canonical: https://www.graphicsmill.com/docs/gmwc/layers-and-objects-api.htm
archived: true
applies_to:
  - product: "Graphics Mill Web Controls"
---

**You’re viewing documentation for an outdated product.** Graphics Mill Web Controls is no longer part of Graphics Mill. For current design editing and rendering tools, see [Design Atoms .NET](https://customerscanvas.com/docs/on-premises/design-atoms-cs/), [Design Atoms JS](https://customerscanvas.com/docs/on-premises/design-atoms-js/), and [Design Editor](https://customerscanvas.com/docs/on-premises/design-editor/).

# Layers and Objects

**Applies to:** Graphics Mill Web Controls · **Archived documentation**
 
**Note** 
You can refer to the web-to-print solution based on AJAX Vector Objects, [Customer's Canvas](https://www.graphicsmill.com/docs/gmwc/customers-canvas.htm.md "Customer's Canvas"). You can consider it as a ready-to-use editor that you may want to embed into your website or as an example demonstrating how AJAX Vector Objects can be used for your needs.
 
As we discussed in the previous topics, [Canvas](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas.htm.md) is a graphic document which serves to create interactive designs. All designs are comprised of two types of entities: layers and objects. Objects are visible graphics primitives, whereas layers are invisible containers for objects. This topic describes layers and objects in more detail and discusses how to manipulate them. It contains for the following paragraphs:
 
- Introduction to Layers and objects
- Working with Layers
- Working with Objects

## Introduction to Layers and objects
  
This paragraph discusses the basic aspects of layers and objects, and contains the following items:
 
- Current Object and Current Layer
- Using History

First, let us have a look at all the different kinds of graphics objects supported in AJAX Vector Objects:
 
- Vector V-objects: line ([LineVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_LineVObject.htm.md)), polyline ([PolylineVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_PolylineVObject.htm.md)), ellipse ([EllipseVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_EllipseVObject.htm.md)), rectangle ([RectangleVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RectangleVObject.htm.md)), and SVG ([SvgVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_SvgVObject.htm.md))
- Raster V-objects: bitmap ([ImageVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ImageVObject.htm.md))
- Text V-objects: simple text ([PlainTextVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_PlainTextVObject.htm.md)) and text area with fixed size ([BoundedTextVObject](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_BoundedTextVObject.htm.md)).

To learn about specific features related to each of these object types, read the Working with Specific Objects article.
 
The following image illustrates an example of the objects/layers hierarchy on Canvas:
 ![Hierarchy of objects location on Canvas](https://www.graphicsmill.com/docs/gmwc/layersAndObjectsAPI1.png) 
As the example shows, a layer can contain any amount of objects, whereas an object is associated with only one layer. Following this logic, you cannot add an object directly to Canvas, this requires a layer to be added to Canvas first, and then the object is supposed to be put on the layer. Canvas introduces the concept of "current object" - in other words, the object that gets the focus and processes all user input. Canvas can have only one current object being manipulated by the user at a time. The layer containing the current object is defined as the current layer. We will discuss how to manipulate the current layer/object below in more detail.
 
Creating an object on Canvas is very easy. As an example, let us draw a rectangle. To perform this we need to generate a layer first and add it to Canvas, then create an instance of **RectangleVObject** and add it to an object collection of the layer:
 
```aspx-cs
var layer = new Layer();
layer.VObjects.Add(new RectangleVObject(75, 45, 90, 60){
    BorderWidth = 0,
    FillColor = System.Drawing.Color.Blue
});
CanvasViewer1.Canvas.Layers.Add(layer);
```
 
```
var canvasViewer = $find("<%= CanvasViewer1.ClientID %>");
var layer = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Layer();
var rectangle = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(75, 45, 90, 60);
rectangle.set_borderWidth(0);
rectangle.set_fillColor("#0000FF");
layer.get_vObjects().add(rectangle);
canvasViewer.get_canvas().get_layers().add(layer);
canvasViewer.get_canvas().redraw(true);
```
 
**Note** 
If you make changes to Canvas via JavaScript, the viewport does not update automatically. Thus, do not forget to redraw Canvas in your code using the [Canvas.redraw()](https://www.graphicsmill.com/docs/gmwc/M_J_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_redraw.htm.md) method.
 
After launching both these snippets you will see the same results:
 ![Adding a rectangle to Canvas](https://www.graphicsmill.com/docs/gmwc/layersAndObjectsAPI2.png) 
As we already know, Canvas requires setting the workspace size, which defines an area where objects are located (if you are not familiar with the workspace concept, read [this paragraph](https://www.graphicsmill.com/docs/gmwc/canvas-and-canvasviewer-control.htm.md)). As the workspace has a coordinate system in points, all object coordinates and sizes are also specified in points. Let us consider where the rectangle from our example is located on the workspace:
 ![Adding a rectangle to Canvas](https://www.graphicsmill.com/docs/gmwc/layersAndObjectsAPI3.png) 
All layers on Canvas are organized as an array where indexes define Z-order: the less the index value is, the higher the layer is located. In practice, this means that objects located on a layer with a higher index overlap objects on a layer with a lower index. Also, objects associated with the same layer have their own Z-order. Changing layer/object indexes you can manage the order of displaying design elements on Canvas.
 
### Current Object and Current Layer
 
As we mentioned before, Canvas supports the concept of current layer/object. We also know that users can manipulate the current object, which gets all the user input. This way, the current object is the currently selected object on Canvas having special control grips for interactive transformations. You can see how our rectangle object looks if we make it current:
 ![Current object on Canvas](https://www.graphicsmill.com/docs/gmwc/layersAndObjectsAPI4.png) 
As objects cannot live without layers, the current object defines the current layer - the layer which the current object belongs to. There are two ways to set or get the current layer - via [CurrentLayerIndex](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_CurrentLayerIndex.htm.md) or [CurrentLayer](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_CurrentLayer.htm.md) properties. Let us look at an example which uses these methods to change the current layer:
 
```csharp
CanvasViewer1.Canvas.CurrentLayerIndex = 2;
var currentLayer = CanvasViewer1.Canvas.CurrentLayer;
currentLayer.Name = "New Current Layer";
```
 
```
var canvas = $find("<%= CanvasViewer1.ClientID %>").get_canvas();
canvas.set_currentLayerIndex(2);
var currentLayer = Canvas.get_currentLayer();
currentLayer.set_name("New Current Layer");
```
 
Now, let us do the same for the current object. We will set the first layer in the layer collection as the current layer and then make the first object in its object collection as the current object. After that, we will change the object name:
 
```csharp
CanvasViewer1.Canvas.CurrentLayerIndex = 0;
CanvasViewer1.Canvas.CurrentVObjectIndex = 0;
var currentObject = CanvasViewer1.Canvas.CurrentVObject;
currentObject.Name = "New Current Object";
```
 
```
var canvas = $find("<%= CanvasViewer1.ClientID %>").get_canvas();
canvas.set_currentLayerIndex(0);
canvas.set_currentVObjectIndex(0);
var currentObject = Canvas.get_currentVObject();
currentObject.set_name("New Current Object");
```
 
**Note** 
After the user clicks on an object, it becomes current and it also automatically sets the corresponding current layer. However, if you operate objects programmatically using an API, you need to specify the current layer before setting the current object.
 
### Using History
 
Almost every graphic editor allows users to undo and redo their actions. In AJAX Vector Objects, you can also enable these features in your application.
 
AJAX Vector Objects provides the [History](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History.htm.md) class that tracks all modifications applied to the Canvas content. To allow **History** to keep the track of all the changes you need to set the [History.Enable](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_Enable.htm.md) property to `true`:
 
```csharp
CanvasViewer1.Canvas.History.Enable = true;
```
 
```
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_history().set_enable(true);
```
 
Now, if you need to undo or redo the last action, just call the [Undo()](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_Undo.htm.md) or [Redo()](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_Redo.htm.md) method:
 
```csharp
protected void Undo_Click(object sender, EventArgs e)
{
    CanvasViewer1.Canvas.History.Undo();
}

protected void Redo_Click(object sender, EventArgs e)
{
    CanvasViewer1.Canvas.History.Redo();
}
```
 
```
function undo_onclick() {
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_history().undo()
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().redraw(true);
}
function redo_onclick() {
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_history().redo()
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().redraw(true);
}
```
 
If you need to limit the number of actions in the undo history, you can use the [MaxUndoStepCount](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_MaxUndoStepCount.htm.md) property which sets the maximum amount of undo steps. The history preserves 10 actions by default. Also, you can clear the history in three different ways:
 
- Deleting the undo history via the [ClearUndo()](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_ClearUndo.htm.md) method.
- Deleting the redo history via the [ClearRedo()](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_ClearRedo.htm.md) method.
- Deleting the entire history via the [Clear()](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History_Clear.htm.md) method.
 
## Working with Layers
  
This paragraph explains how to work with layers and contains the following items:
 
- Locking Layers
- Common Operations

All layers are stored in [LayerCollection](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_LayerCollection.htm.md) which is accessed via [Layers](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_Layers.htm.md). There are two ways to find a layer - by [Name](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_Name.htm.md) or [Index](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_Index.htm.md) in the collection. The following snippet illustrates how to retrieve layers by **Index**:
 
```csharp
CanvasViewer1.Canvas.Layers.Add(new Layer());
var layer = CanvasViewer1.Canvas.Layers[0];
```
 
```
var canvas = $find("<%= CanvasViewer1.ClientID %>").get_canvas();

canvas.get_layers().add(new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Layer());
var layer = Canvas.get_layers().get_item(0);
```
 
Using the **Index** property is very convenient when Canvas contains a small number of layers. However, if you create a complex design with many layers, keeping track of all the indexes becomes difficult. In this case, you can use the **Name** property. On the server side you can use either the [GetByName(String)](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_LayerCollection_GetByName_1_bb3a7a4f.htm.md) method returning a layer by name, or [GetLayersByName(String)](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_LayerCollection_GetLayersByName_1_bb3a7a4f.htm.md) retrieving an array of layers that contain specific string names. Let us see how to perform the previous task, only this time using the **Name** property:
 
```csharp
layer.Name = "Name";
var layerByName = CanvasViewer1.Canvas.Layers.GetByName("Name");
```
 
Use the [getLayersByName()](https://www.graphicsmill.com/docs/gmwc/M_J_Aurigma_GraphicsMill_AjaxControls_VectorObjects_LayerCollection_getLayersByName.htm.md) property on the client side to retrieve a list of layers with a specific string in the name:
 
```
layer.set_name("Name");
var layerByName = Canvas.get_layers().getLayersByName("Name")[0];
```
 
### Locking Layers
 
When you create a graphic template for further user customizations, you may need to forbid a user from changing objects on the template. With AJAX Vector Objects you can lock the objects via the [Locked](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_Locked.htm.md) property:
 
```csharp
CanvasViewer1.Canvas.CurrentLayer.Locked = true;
```
 
```
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_currentLayer().set_locked(true);
```
 
Moreover, you can restrict an area on the template where a user can manipulate objects. To perform this you need to set a rectangle region on the layer using the [Region](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_Region.htm.md) property:
 
```csharp
CanvasViewer1.Canvas.CurrentLayer.Region = new System.Drawing.RectangleF(0, 0, 100, 100);
```
 
```
var canvasViewer = $find("<%= CanvasViewer1.ClientID %>");
canvasViewer.get_canvas().get_currentLayer().set_region(
    new System.Drawing.RectangleF(0, 0, 100, 100));
```
 
During the design process, you may need to hide some layers, which can be done using the [Visible](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_Visible.htm.md) property:
 
```csharp
CanvasViewer1.Canvas.CurrentLayer.Visible = false;
```
 
```
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_currentLayer().set_visible(false);
```
 
### Common Operations
 
Now, let us consider some more examples of common operations.
 
- Getting the number of existing layers:
 
```csharp
    int i = CanvasViewer1.Canvas.Layers.Count();
    ```
 
```
    var i = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_count();
    ```
- Adding a layer to the end of the **Canvas.Layers** collection, that is, the layer that will be the highest one on Canvas:
 
```csharp
    CanvasViewer1.Canvas.Layers.Add(new Layer());
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().add(
        new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Layer());
    ```
- Inserting a layer to the specified position in the **Canvas.Layers** collection:
 
```csharp
    var layer = new Layer();
    CanvasViewer1.Canvas.Layers.Insert(2, layer);
    ```
 
```
    var layer = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Layer();
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().insert(2, layer);
    ```
- Deleting a layer from the **Canvas.Layers** collection by a specified index:
 
```csharp
    CanvasViewer1.Canvas.Layers.RemoveAt(2);
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().removeAt(2);
    ```
- Changing Z-order. As the Z-order equals the index in the **Canvas.Layers** collection, all you need is to move the layer in the collection:
 
```csharp
    CanvasViewer1.Canvas.Layers.Move(2, 0);
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().move(2, 0);
    ```
 
## Working with Objects
  
This paragraph explains how to work with objects and contains the following items:
 
- Object Transformation
- Object Permissions
- Common Operations

Objects are graphic elements on Canvas associated with a particular layer and stored in the [Layer.VObjects](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_VObjects.htm.md) collection. Objects have the same properties as layers, namely:
 
- [Visible](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Visible.htm.md) hides or shows an object on Canvas.
- [Locked](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Locked.htm.md) forbids a user from transforming the object.
- [Index](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Index.htm.md) allows you to access an object by index in the **Layer.VObjects** collection.
- [Name](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Name.htm.md) associates an object with a specific name and helps to retrieve the object by that name from the **Layer.VObjects** collection.

AJAX Vector Objects provides the ability to assign additional data to an object via the [Tag](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Tag.htm.md) property. **Tag** accepts a [Dictionary↗](http://msdn.microsoft.com/ru-ru/library/xfhwa508%28v=vs.110%29.aspx) that contains a collection of key-value pairs of any type:
 
```csharp
CanvasViewer1.Canvas.CurrentLayer.VObjects.Add(new RectangleVObject(10, 10, 10, 10){
    FillColor = System.Drawing.Color.Red,
    Name = "Rectangle Name",
    Tag = new Dictionary<string, string>(){
        {"Name", "Rectangle Name"},
        {"Color", "Red"}}
});
```
 
```
var rectangle = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(10, 10, 10, 10);
rectangle.set_fillColor("#FF0000");
rectangle.set_name("Rectangle Name");
rectangle.set_tag({ "Name": "Rectangle Name", "Color": "Red" });
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_currentLayer().get_vObjects().add(rectangle);
```
 
### Object Transformation
 
All transformations made to the object are stored in the [Transform](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject_Transform.htm.md) property. They are always applied to the original object state. This means that if you transform an object programmatically, you need to keep in mind that if, for example, you rotate the object by 45 degrees, and then you need to rotate it by 45 degrees more, you should set the angle in the [Transform](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform.htm.md) instance to 90 degrees.
 
**Transform** includes the most popular object operations: resizing, rotating, and translating.
 
For resizing, there is the [Transform.Scale(Double, Double)](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_Scale_2_63df07c1.htm.md) method which accepts width and height multipliers as arguments. If these multipliers are equal, the object is resized proportionally. The following snippets demonstrate how to upscale a rectangle to twice the original size:
 
```csharp
var resize = new Transform();
resize.Scale(2.0, 2.0);
CanvasViewer1.Canvas.CurrentVObject.Transform = resize;
```
 
The client API provides the [Transform.ScaleX](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_ScaleX.htm.md) and [Transform.ScaleY](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_ScaleY.htm.md) properties that represent the width and height multipliers, respectively. Let us look at how to scale an object disproportionately on the client side:
 
```
var resize = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Transform();
resize.set_scaleX(3.0);
resize.set_scaleY(2.0);
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_currentVObject().set_transform(resize);
```
 
The [Transform.Translate(Double, Double)](https://www.graphicsmill.com/docs/gmwc/M_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_Translate_2_63df07c1.htm.md) method allows you to move an object if you use the server API. It accepts two parameters specifying a distance to translate the object along the workspace:
 
```csharp
var translate = new Transform();
translate.Translate(CanvasViewer1.WorkspaceWidth / 4, CanvasViewer1.WorkspaceHeight / 4);
CanvasViewer1.Canvas.CurrentVObject.Transform = translate;
```
 
On the client side, you can translate an object specifying the [Transform.TranslateX](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_TranslateX.htm.md) and [Transform.TranslateY](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_TranslateY.htm.md) properties:
 
```
var canvasViewer = $find("<%= CanvasViewer1.ClientID %>");
var translate = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Transform();
translate.set_translateX(CanvasViewer.get_workspaceWidth() / 4);
translate.set_translateY(CanvasViewer.get_workspaceHeight() / 4);
canvasViewer.get_canvas().get_currentVObject().set_transform(translate);
```
 
To rotate an object, use the [Transform.Angle](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Transform_Angle.htm.md) property, which defines an angle in degrees and applies the transform to the object:
 
```csharp
var rotate = new Transform(){Angle = 45.0};
CanvasViewer1.Canvas.CurrentVObject.Transform = rotate;
```
 
```
var rotate = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.Transform();
rotate.set_angle(45.0);
canvasViewer.get_canvas().get_currentVObject().set_transform(rotate);
```
 
### Object Permissions
 
AJAX Vector Objects provides the ability to define what a user can do with a particular object. If you need to forbid a user from performing specific actions to the object, use the [Permission](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Permission.htm.md) class that exposes the following members:
 
|  Member Name |  Description |
| --- | --- |
 |  [AllowArbitraryResize](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowArbitraryResize.htm.md) |  Determines whether users can resize an object arbitrarily. |
 |  [AllowDelete](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_IPermission_AllowDelete.htm.md) |  Determines whether the object can be deleted using **Del** key. |
 |  [AllowMoveHorizontal](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowMoveHorizontal.htm.md) |  Determines whether the object can be moved horizontally. |
 |  [AllowMoveVertical](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowMoveVertical.htm.md) |  Determines whether the object can be moved vertically. |
 |  [AllowFreeMove](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowFreeMove.htm.md) |  Only returns a value indicating whether the object can be moved both horizontally and vertically. This property turns to false if at least one of **AllowMoveHorizontal**/**AllowMoveVertical** is false. |
 |  [AllowProportionalResize](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowProportionalResize.htm.md) |  Determines whether users can resize the object proportionally. |
 |  [AllowRotate](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_ITransformPermission_AllowRotate.htm.md) |  Determines whether users can rotate the object. |
 |  [NoPrint](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_IPermission_NoPrint.htm.md) |  If true, AJAX Vector Objects will skip the object while rendering print-ready output. |
 |  [NoShow](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_IPermission_NoShow.htm.md) |  Determines whether the object is displayed on Canvas. |
 
Let us look at an example of working with permissions. The following snippets demonstrate how to forbid a user from rotating and resizing an object:
 
```csharp
var rectangle = new RectangleVObject(75, 45, 90, 60);
rectangle.Permissions.AllowRotate = false;
rectangle.Permissions.AllowProportionalResize = false;
rectangle.Permissions.AllowArbitraryResize = false;
CanvasViewer1.Canvas.CurrentLayer.VObjects.Add(rectangle);
```
 
```
var rectangle = new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(75, 45, 90, 60);
rectangle.get_permissions().set_allowRotate(false);
rectangle.get_permissions().set_allowProportionalResize(false);
rectangle.get_permissions().set_allowArbitraryResize(false);
$find("<%= CanvasViewer1.ClientID %>").get_canvas().get_currentLayer().get_vObjects().add(Rectangle);
```
 
### Common Operations
 
- Getting the number of existing objects in a layer:
 
```csharp
    int i = CanvasViewer1.Canvas.Layers[0].VObjects.Count();
    ```
 
```
    var i = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().get_count();
    ```
- Adding an object to the end of the **Layer.VObjects** collection, meaning the object will be the highest one in the layer:
 
```csharp
    CanvasViewer1.Canvas.Layers[0].VObjects.Add(new RectangleVObject(0, 0, 100, 100));
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().add(
        new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(0, 0, 100, 100));
    ```
- Inserting an object to the specified position in the **Layer.VObjects** collection:
 
```csharp
    CanvasViewer1.Canvas.Layers[0].VObjects.Insert(1, new RectangleVObject(0, 0, 50, 50));
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().insert(1,
        new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(0, 0, 50, 50));
    ```
- Getting an object by its index:
 
```csharp
    CanvasViewer1.Canvas.Layers[0].VObjects.Add(new RectangleVObject(0, 0, 50, 50));
    var getObject = CanvasViewer1.Canvas.Layers[0].VObjects[0];
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().add(
        new Aurigma.GraphicsMill.AjaxControls.VectorObjects.RectangleVObject(0, 0, 50, 50));
    var getObject = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().get_item(0);
    ```
- Getting an object by its name:
 
```csharp
    rectangle.Name = "Rectangle";
    var getObjectByName = CanvasViewer1.Canvas.Layers.GetVObjectsByName("Rectangle");
    ```
 
```
    rectangle.set_name("Rectangle");
    var getObjectByName = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().getVObjectsByName("Rectangle")[0];
    ```
- Deleting an object from the **Layer.VObjects** collection by a specified index:
 
```csharp
    CanvasViewer1.Canvas.Layers[0].VObjects.RemoveAt(2);
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().removeAt(2);
    ```
- Changing the object's Z-order. As the Z-order is an index of the object, all you need to do is just move the object in the **Layer.VObjects** collection:
 
```csharp
    CanvasViewer1.Canvas.Layers[0].VObjects.Move(2, 0);
    ```
 
```
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().move(2, 0);
    ```
- Cloning an object:
 
```csharp
    var cloneObject = CanvasViewer1.Canvas.Layers[0].VObjects[0].Clone();
    ```
 
```
    var cloneObject = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().get_item(0).clone();
    ```
- Transferring an object from its current layer to another one:
 
```csharp
    var objectTransferring = CanvasViewer1.Canvas.Layers[1].VObjects[0];
    CanvasViewer1.Canvas.Layers[1].VObjects.RemoveAt(0);
    CanvasViewer1.Canvas.Layers[0].VObjects.Add(objectTransferring);
    ```
 
```
    var objectTransferring = $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(1).get_vObjects().get_item(0);
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(1).get_vObjects().removeAt(0);
    $find("<%= CanvasViewer1.ClientID %>").get_canvas().get_layers().get_item(0).get_vObjects().add(objectTransferring);
    ```
 
## See Also
  
### Reference
 
- [Canvas Class](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas.htm.md)
- [Layers Property](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_Layers.htm.md)
- [VObject Class](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_VObject.htm.md)
- [Layer.VObjects Property](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Layer_VObjects.htm.md)
- [CurrentLayer Property](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_CurrentLayer.htm.md)
- [Permission Class](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Permission.htm.md)
- [CurrentVObject Property](https://www.graphicsmill.com/docs/gmwc/P_Aurigma_GraphicsMill_AjaxControls_VectorObjects_Canvas_CurrentVObject.htm.md)
- [History Class](https://www.graphicsmill.com/docs/gmwc/T_Aurigma_GraphicsMill_AjaxControls_VectorObjects_RedoUndo_History.htm.md)

### Manual
 
- [Understanding Ajax Vector Objects Architecture](https://www.graphicsmill.com/docs/gmwc/understanding-ajax-vector-objects-architecture.htm.md)
- [Introduction to Ajax Vector Objects API](https://www.graphicsmill.com/docs/gmwc/introduction-to-ajax-vector-objects-api.htm.md)
- [Canvas and CanvasViewer Control](https://www.graphicsmill.com/docs/gmwc/canvas-and-canvasviewer-control.htm.md)

### Other
 
- [HTML5 **&lt;canvas&gt;** ↗](http://www.w3.org/TR/2dcontext/)
- [Dictionary↗](http://msdn.microsoft.com/ru-ru/library/xfhwa508%28v=vs.110%29.aspx)