# vdWeb Library tips

## How can I make the library go faster?

VdWeb Library is especially designed to offer the best optical result, superb functionality and fast render speed by default. However depending on the drawing and what you need out of the library, you may be able to give a a significant speed boost.

- First, make sure that you are using the fastest render mode possible. Shade is faster than Render, Wire is faster than Shade and Wire2D is the fastest of all. If you are displaying drawings without any solid entities, make sure to not use Render or Shade modes. To change render mode write the following. var vdcanvas = vdmanager.vdrawObject('display');//'display' is the canvas id activelayout = vdcanvas.GetActiveLayout(); activelayout.RenderMode = vdConst.RENDERMODE_WIRE_2d;

- Make sure to change the DefaultTimeOut property using the vdcanvas.SetDefaultTimeOutMilliseconds(int) function. What this property defines is the time the library will wait after a user has panned to internally call redraw. If during this time the user makes a pan the time will be reset. This is very useful when having large drawings that we don't want to redraw for every small movement during the Pan action. Even though this property does not directly affect the render time, it may give the impression that the control is unresponsive. Default time 1200 milliseconds. By lowering it, the control will redraw faster after a pan action. If set to 0, the drawing will be redrawn for every move of the mouse (or finger) while panning.

- If no entity detection functionality is needed, disable the Selection with the following command. vdcanvas.SetEnableSelection(false); That way you won't be able to get any entities from your drawing using the mouse location, but render will be faster. You can always enable Selecting by calling the same function with true.

- In case you need to be able to select SOME of the entities in the document, make sure to place everything else in Locked layers when exporting the document. That way, you will gain precious render milliseconds or even seconds.

- Edit the material image interpolation image. If you have a lot of image entities or solid surfaces with applied materials you can set the Interpolation mode to "nearest". Your materials may not look so smooth but render speed will go up. var vdcanvas = vdmanager.vdrawObject('canvas'); vdcanvas.SetImageInterpolationMode(vdConst.InterpolationMode_Nearest);

- Lower the CurveResolution to the lowest possible value not affecting the visual result of your curves. Default value is 200 and it should be ok. Values can span from 1 to 20.000, higher values offer smoother curves but take a toll on render time, so make sure to balance this value appropriately. vdgeo.CURVERESOLUTION = 100;

- Use multiple canvases in your application. Whether your application has one or more display areas you can divide your project into different canvases. This way you'll add a bit of complexity to your project but you'll gain greatly in speed and response time of your application. Check the colorpicker of this sample project for an example of how to do this. Source code can be found here.

- Last but not least the canvas size. It may sound obvious, but doubling both dimensions of the canvas object results in four times the pixels to be calculated. So define your drawing area wisely.

## How can I iterate through the objects contained in the Blocks, Layers, Images, HatchPatterns, LineTypes, TestStyles collections?

You can get all of the above collections from within the document, using the GetDictItem() function contained in the vdcanvas object. var vdcanvas = vdmanager.vdrawObject('canvas'); var blocks = vdcanvas.GetDocument().Blocks; for (var d = 0; d < blocks.Items.length; d++) { var entity = vdcanvas.GetDictItem(blocks, blocks.Items[d]); ... }

## How can I get an entity of the document by its handle or position within the entities collection?

Both ways can be achieved using the GetEntityItem() function contained in the vdcanvas object.

- If you already have the entity's handle as string things are easy. var vdcanvas = vdmanager.vdrawObject('display'); var handle ="h_XX"; element = vdcanvas.GetEntityItem(handle);

- If you have the position within the Entities collection then you also have the entity's handle. The Entities collection within a Layout only contains the entities handles, not the actual objects. var vdcanvas = vdmanager.vdrawObject('display'); var pos ="15"; var entities = vdcanvas.GetActiveLayout().Entities; element = vdcanvas.GetEntityItem(entities.Items[pos]);

## I need to get the library's version.

There are two version numbers you'll possibly need. The vdWeb library version and the .vds file version.

- To get the library version number use the vdversion global property.

- You'll find the vdraw version the document was exported with, using the document's version property. var vdcanvas = vdmanager.vdrawObject('display'); var version = vdcanvas.GetDocument().version; Make sure to open a document before using the above commands, or the document will be null.

## Is there a way to set my render output to grayscale?

Of course there is, just use the SetGrayScale() method of vdcanvas. vdcanvas.SetGrayScale(true);

## I want to lock a Layer but I can't find the locked property, how do I do it?

Every vectordraw object in the web library use the same properties as in the .Net framework. This means that a vdLayer's Lock property will be set as such within the web library too. However for size economy of the VDS formats, the properties set to their default values are not included in the file. This results in a few objects lacking some properties when watched using a javascript debugger. Javascript is quite flexible though, so you can set the property to this object (using the correct name found in the .Net framework) and it will work as intended.

In our case setting all layers to locked can be achieved like so: var vdcanvas = vdmanager.vdrawObject('display'); var vddoc = vdcanvas.GetDocument(); var layers = vddoc.layers; if (vddoc == null) return; for (var i = 0; i < vddoc.Layers.Items.length; i++) { vdcanvas.GetDictItem(vddoc.Layers, vddoc.Layers.Items[i]).Lock = true; }

## How can I draw a couple of entities fast, without redrawing the whole document?

This can easily be done using the ActionDrawEntities() function located in the vdraw object of the web library. To see how to use this function go to this article.

## VDS files are a bit large by default, is there a way to make them smaller?

In short, yes!

What someone needs to do in order to minify the size of the (default) vds file is to use a lightweight font. Fonts with complex curves that may look pretty, are stored as distinct shapes inside the file. This is neccesary in order for them to be drawn on canvas. It can be understandable that different fonts have different size. It lies upon the user to select a light but sufficiently stylish font in order to achieve a smaller file size with an acceptable visual result. If visual style is not an issue, the standard txt.shx font, offers one of the smallest sizes.