Using jQuery

using jquery is also supported when working with the 3d viewer api for legacy reasons small differences exist in the way you interact with the 3d viewer when using jquery installation 1\ add jquery to your project include jquery in your html file using a script tag 2\ add the 3d viewer to your project include the 3d viewer in your html file using a script tag, this will add the global bimsync object to the window object 3\ provide a container for the 3d viewer create a div element for attaching a 3d viewer instance to 4\ initialize the 3d viewer api set a callback function and then invoke the load method, the 3d viewer is ready once callback invoked bimsync setonloadcallback(onviewer3dload); bimsync load(); 5\ create a 3d viewer instance initialize the 3d viewer by invoking the viewer method on the jquery object for the div where you want to attach the 3d viewer const viewer3doptions = { textrendermode "dom", }; $("#viewer 3d") viewer(viewer3doptions); 6\ interact with the 3d viewer call methods on the 3d viewer instance to interact with the 3d viewer $("#viewer 3d") viewer("loadmodelsfromtoken", tokenurl) then(() => { const objects = $("#viewer 3d") viewer("getobjects"); if (objects length > 0) { $("#viewer 3d") viewer("select", objects\[0] id); } }); getting started usage options the options for the 3d viewer are the same when using jquery methods in general, the methods are the same when using jquery but the way you call them is different $("#viewer 3d") viewer("methodname", arg1, arg2, ) some methods are also available under their deprecated names method deprecated names capturescreenshot screenshot getboundingbox boundingbox , boundingbox getclippingplanes clippingplanes , clippingplanes getmodels modelinfo getobjectcolors color getobjects objectinfo , objectinfo getrendersettings rendersettings getviewpoint viewpoint loadmodelsfromtoken loadurl , loadurl resetobjectcolors resetcolors , resetcolors setclippingplanes clippingplanes , clippingplanes setobjectcolors color setplanewidgetviewport clippingplanewidgetviewport , planewidgetviewport setpointbudget pointbudget setrendersettings rendersettings settransform transformmodel , transformmodel settransitionsettings transitionsettings setviewpoint viewpoint unloadmodel unloadmodel it also possible to use most methods as both a getter or a setter use a method as a getter by passing a callback as the last argument getclippingplanes also available under the deprecated method names clippingplanes and clippingplanes function onclippingplanes(clippingplanes) { console log("clippingplanes ", clippingplanes); } $("#viewer 3d") viewer("clippingplanes", null, onclippingplanes); getobjectcolors also available under the deprecated method name color function onobjectcolors(objectcolors) { console log("objectcolors ", objectcolors); } const objectids = \["object 1", "object 2"]; $("#viewer 3d") viewer("color", null, objectids, onobjectcolors); getrendersettings also available under the deprecated method name rendersettings function onrendersettings(rendersettings) { console log("rendersettings ", rendersettings); } $("#viewer 3d") viewer("rendersettings", null, onrendersettings); getviewpoint also available under the deprecated method name viewpoint function onviewpoint(viewpoint) { console log("viewpoint ", viewpoint); } $("#viewer 3d") viewer("viewpoint", null, onviewpoint); events callbacks for 3d viewer events may have different signatures when using jquery each event documentation page details any differences