CADViewer Technical Documentation, Installation Guide and Reference Samples Library

Space Image Objects - Insert and Manipulate SVG Icons

Try out this CADViewer Sample, in which you can place out interactive SVG icons onto the CAD canvas and control them through the API.

About This Sample

This CADViewer sample illustrates the CADViewer Space Icon Object Interface. For a detailed description of the commands used, see the Space Icons User Manual.

Simply select a Icon, click Insert Space Image, and place the Icon into the Canvas.

The API settings of Space Name, Space ID and SVG image are display for each selection and the ID of spaces are automatically incremented when Insert Space Image is clicked.

The following API methods are relevant for this Space Icons sample, click on the method to open the API documentation.

Required method in HTML code:

URL parameters

The URL parameter call is (the Url and exact file-paths will change depending on the implementation platform):

https://onlinedemo.cadviewer.com/cadviewer_6_1_0/html/CADViewer_space_image_objects_620.html

CADViewer Operation

Place an Object On Canvas

First select an Icon object. Then place it on the canvas. In the HTML Sample there are programmed placeholders, that automatically set the Space Objects specifics, such as ID, type and source file to display.

Furthermore there are implemented template slider control to set the size of the object at insertion into the CAD Canvas.

Canvas Object Controls

After the icons has been placed on the canvas, use the controls:

Icon Controls

To resize and delete objects.

When a project is completed, use the Save Icon to save an SVG including source drawing with all Interactive Space Icons on top.

Source Code

The Source Code for CADViewer_space_image objects_620.html is:

Please visit our comprehensive Online CADViewer Demos section for other File Demos with CADViewer 4.1 and AutoXchange 2020

Last updated on 7 Sep 2020
Published on 7 Sep 2020