CADViewer Technical Documentation, Installation Guide and Reference Samples Library

Script Libraries

In the front-end code, in addtion to the CADViewer core Java Script libraries, CADViewer uses a set of auxillary libraries and stylesheets. The setup depends on how CADViewer is installed, either with 1: npm installer or through 2: javascript library download.

1: npm install

When using the npm install of CADViewer, all dependency javascript libraries are installed in the node_modules structure.

Use the following import command to add CADViewer.

import * as cadviewer from "cadviewer";

Then for all further initializations of CADViewer, the following general variables are used:

	// Location of installation folders
    var ServerBackEndUrl = location.origin+"/cadviewer/";
    var ServerUrl = location.origin+"/cadviewer/";
    var ServerLocation = "";

The ServerUrl is the location of the Front-end, the ServerBackEndUrl is the location of the back-end, and the ServerLocation is typically set to "" in release, but can be set to a location during debug. Please see separate documentation on pulling a ServerLocation from scripts.

2: JavaScript install

CADViewer uses a set of standard standard JavaScript libraries and stylesheets, including jQuery, Bootstrap and jQuery Qtip to enable a number of functionality including dynamic interaction with room polygons. These must be added to the declaration section.

The standard declaration is:

	<script src="../app/js/jquery-2.2.3.js" type="text/javascript"></script>
	<script src="../app/js/jquery.qtip.min.js" type="text/javascript"></script>
	<link href="../app/css/jquery.qtip.min.css" media="screen" rel="stylesheet" type="text/css" />

	<script src="../app/js/popper.js" type="text/javascript"></script>

	<script src="../app/js/bootstrap.min.js" type="text/javascript"></script>
	<link href="../app/css/bootstrap.min.css" media="screen" rel="stylesheet" type="text/css" />

	<script src="../app/js/jquery-ui-1.11.4.min.js" type="text/javascript"></script>
	<link href="../app/css/jquery-ui-1.11.4.min.css" media="screen" rel="stylesheet" type="text/css" />

	
    <script src="../app/cv/cv-pro/cadviewer.min.js" type="text/javascript" ></script>
	<script src="../app/cv/cv-custom_commands/CADViewer_custom_commands.js" type="text/javascript" ></script>

	<script src="../app/cv/cvlicense.js" type="text/javascript" ></script>
	<link href="../app/css/cvjs_7.css" media="screen" rel="stylesheet" type="text/css" />
	 

	<script src="../app/js/bootstrap-multiselect.js" type="text/javascript" ></script>
	<link href="../app/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" />


	<script src="../app/js/library_js_svg_path.js" type="text/javascript"></script>			
	<script src="../app/js/snap.svg-min.js" type="text/javascript" ></script>

	<script src="../app/js/cvjs_api_styles_2_0_26.js" type="text/javascript" ></script>
	<script src="../app/js/rgbcolor.js"type="text/javascript" ></script>
	<script src="../app/js/StackBlur.js"type="text/javascript" ></script>
	<script src="../app/js/canvg.js" type="text/javascript"  ></script>
	<script src="../app/js/list.js" type="text/javascript"></script>
	<script src="../app/js/jscolor.js" type="text/javascript" ></script>
	
	<script src="../app/js/jstree/jstree.min.js"></script>
	<script src="../app/js/xml2json.min.js"></script>
	<script src="../app/js/d3.v3.min.js"></script>  
	<script src="../app/js/qrcode.min.js" type="text/javascript"></script> 

Then for all further initializations of CADViewer, the following general variables are used:

	// Location of installation folders
    var ServerBackEndUrl = location.origin+"/cadviewer/";
    var ServerUrl = location.origin+"/cadviewer/";
    var ServerLocation = "";

The ServerUrl is the location of the Front-end, the ServerBackEndUrl is the location of the back-end, and the ServerLocation is typically set to "" in release, but can be set to a location during debug. Please see separate documentation on pulling a ServerLocation from scripts.

Last updated on 15 Dec 2021
Published on 22 Mar 2020