Canvas click-handlers
CADViewer provides the ability to add click-handlers to graphical objects in display CAD file. These objects are defined by the Entity Handle in the originating AutoCAD or MicroStation file being displayed by CADViewer. The Entity Handles are parsed by adding the following conversion control parameter -hlall , see more in the section Conversion Control Parameters and AutoXchange 2023 parameter interface.
cadviewer.cvjs_conversion_addAXconversionParameter("HLALL", "");
In the general callback cvjs_OnLoadEnd() the API command cvjs_processHandleObjects will process handles on load. Note that two other optional API controlling methods are available; for block processing cvjs_handleObjectsParceBlocks() and text element only processing cvjs_handleObjectsParceTextOnly().
function cvjs_OnLoadEnd(){
// Use process handles, if -hlall has been set in conversion to expose AutoCAD DWG Handles
var processHandles = true;
if (processHandles){
cadviewer.cvjs_handleObjectsParceBlocks(false);
cadviewer.cvjs_handleObjectsParceTextOnly(true);
cadviewer.cvjs_processHandleObjects();
}
}
CADViewer implements the following Canvas Script callback methods:
- cvjs_dblclick() - see code snippet below
- cvjs_mouseout() - see code snippet below
- cvjs_mousedown() - see code snippet below
- cvjs_click() - see code snippet below
- cvjs_mouseover() - see code snippet below
- cvjs_mouseleave() - see code snippet below
- cvjs_mousenter() - see code snippet below
NOTE: cvjs_click() is called, even when clicking on an empty canvas, but it sets the return id parameter to “none”.
Entity Control methods
There are two API methods that are used to control the Highlight of Handle Objects.
On mouseenter use cvjs_mouseenter_handleObjectStyles("#F00", 10.0, 1.0, true, id, handle); which controls the style, color, and weight of the graphical highlight.
On mouseout use cvjs_mouseout_handleObjectStyles(id, handle);, which resets the highlight state of the Handle Object.
Clickhanders template code sample
// ENABLE ALL API EVENT HANDLES FOR AUTOCAD Handles
var selected_handles = [];
var handle_selector = false;
var current_selected_handle = "";
function cvjs_dblclick(id, handle, entity){
console.log("dblclick "+id+" "+handle);
window.alert("We have double clicked entity with AutoCAD Handle: "+handle+"\r\nThe svg id is: "+id);
}
function cvjs_mouseout(id, handle, entity){
// console.log("mouseout "+id+" "+handle);
if (current_selected_handle == handle){
// do nothing
}
else{
cvjs_mouseout_handleObjectStyles(id, handle);
}
}
var mouseover = false;
var mouseclick = false;
var customclickcontrol = false;
function cvjs_mousedown(id, handle, entity){
console.log("mousedown "+id);
if (customclickcontrol){
if (!mouseclick)
mouseclick = true;
}
}
function cvjs_click(id, handle, entity, path, xpos, ypos){
console.log("click "+id+" "+handle+" xpos="+xpos+" ypos="+ypos);
if (id == "152_") return;
if (xpos == undefined || ypos == undefined) return;
if (customclickcontrol){
if (mouseclick)
mouseclick = false;
}
// if we click on an object, then we add to the handle list
if (handle_selector){
selected_handles.push({id,handle});
current_selected_handle = handle;
}
var loadSpaceImage_Location = "data:image/svg+xml;base64, PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmlld0JveD0iLTExMDAgLTIwMCAyMjAwIDIyMDAiCiAgIGhlaWdodD0iMjIwMCIKICAgd2lkdGg9IjIyMDAiCiAgIHhtbDpzcGFjZT0icHJlc2VydmUiCiAgIGlkPSJzdmcyIgogICB2ZXJzaW9uPSIxLjEiPjxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTgiPjxyZGY6UkRGPjxjYzpXb3JrCiAgICAgICAgIHJkZjphYm91dD0iIj48ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD48ZGM6dHlwZQogICAgICAgICAgIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxkZWZzCiAgICAgaWQ9ImRlZnM2IiAvPjxnCiAgICAgaWQ9ImcxMCI+PGcKICAgICAgIGlkPSJnMTIiPjxwYXRoCiAgICAgICAgIGlkPSJwYXRoNzIiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNlMTFhMjI7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiCiAgICAgICAgIGQ9Im0gNjQ5LjE0LDAgYyAtNDMyLjc4LC05Mi4xOSAtODY1LjQ5LC05Mi4xOSAtMTI5OC4yOCwwIC0xMjIuMTIsMjYuMDEgLTIxNy4yOCwxMjEuMTcgLTI0My4zLDI0My4zIC05Mi4xOCw0MzIuNzggLTkyLjE4LDg2NS40OSAwLDEyOTguMjggMjYuMDIsMTIyLjEyIDEyMS4xOCwyMTcuMjggMjQzLjMsMjQzLjI5IDQzMi43OSw5Mi4xOSA4NjUuNSw5Mi4xOSAxMjk4LjI4LDAgMTIyLjEzLC0yNi4wMSAyMTcuMjksLTEyMS4xNyAyNDMuMywtMjQzLjI5IDkyLjE5LC00MzIuNzkgOTIuMTksLTg2NS41IDAsLTEyOTguMjggLTI2LjAxLC0xMjIuMTMgLTEyMS4xNywtMjE3LjI5IC0yNDMuMywtMjQzLjMiIC8+PHBhdGgKICAgICAgICAgaWQ9InBhdGg3NCIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIKICAgICAgICAgZD0ibSAwLDE0MDcuMzQgYyAtMTguODgsMCAtMzQuMjUsLTE1LjM2IC0zNC4yNSwtMzQuMjUgdiAtNzI0LjggYyAwLC0yMC40MSAtMTAuNTksLTM5LjM2IC0yNy45OCwtNTAuMDUgLTM1LjY4LC0yMS45NSAtNTYuOTksLTU5LjkgLTU2Ljk5LC0xMDEuNDkgMCwtNjUuNzMgNTMuNDksLTExOS4yMiAxMTkuMjIsLTExOS4yMiA2NS43NCwwIDExOS4yMiw1My40OSAxMTkuMjIsMTE5LjIyIDAsNDEuNTkgLTIxLjMxLDc5LjU0IC01Ni45OSwxMDEuNDkgLTE3LjM4LDEwLjY5IC0yNy45NywyOS42NCAtMjcuOTcsNTAuMDUgdiA3MjQuOCBjIDAsMTguODkgLTE1LjM3LDM0LjI1IC0zNC4yNiwzNC4yNSB6IG0gMCwtMTE0Ny4zNCBjIC0xMzAuNTQsMCAtMjM2Ljc0LDEwNi4yMSAtMjM2Ljc0LDIzNi43NSAwLDcxLjE1IDMxLjIyLDEzNi44NSA4NC45NiwxODEuNTMgdiA2OTQuODEgYyAwLDgzLjcgNjguMDksMTUxLjc4IDE1MS43OCwxNTEuNzggODMuNjksMCAxNTEuNzgsLTY4LjA4IDE1MS43OCwtMTUxLjc4IHYgLTY5NC44MSBjIDUzLjc0LC00NC42OCA4NC45NywtMTEwLjM4IDg0Ljk3LC0xODEuNTMgMCwtMTMwLjU0IC0xMDYuMjEsLTIzNi43NSAtMjM2Ljc1LC0yMzYuNzUiIC8+PHBhdGgKICAgICAgICAgaWQ9InBhdGg3NiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIKICAgICAgICAgZD0ibSAzODguMTAsMTQ1Ni42NSBjIC0yNi41MSwwIC00OC4wOCwtMjEuNTcgLTQ4LjA4LC00OC4wOCAwLC0yNi41MSAyMS41NywtNDguMDggNDguMDgsLTQ4LjA4IDI2LjUxLDAgNDguMDgsMjEuNTcgNDguMDgsNDguMDggMCwyNi41MSAtMjEuNTcsNDguMDggLTQ4LjA4LDQ4LjA4IHogbSAwLC0yMTMuNjkgYyAtOTEuMzIsMCAtMTY1LjYxLDc0LjI5IC0xNjUuNjEsMTY1LjYxIDAsOTEuMzIgNzQuMjksMTY1LjYxIDE2NS42MSwxNjUuNjEgOTEuMzIsMCAxNjUuNjEsLTc0LjI5IDE2NS42MSwtMTY1LjYxIDAsLTkxLjMyIC03NC4yOSwtMTY1LjYxIC0xNjUuNjEsLTE2NS42MSIgLz4KPC9nPjwvZz48L3N2Zz4="
var baseobject = "http://localhost:3000/content/customInsertSpaceObjectMenu/images/sensor_c.svg"
var id = "myID_"+ Math.floor(Math.random() * 10000);
var type = "sensor";
var layer = "mylayer";
// cvjs_setImageSpaceObjectParameters(baseobject, id, type, layer);
cvjs_setImageSpaceObjectParameters(loadSpaceImage_Location, id, type, layer);
cvjs_setGlobalSpaceImageObjectScaleFactor(2.0);
cvjs_addFixedSizeImageSpaceObjectXY("floorPlan", xpos, ypos)
}
function cvjs_mouseover(id, handle, entity){
// console.log("mouseover "+id+" "+handle+" "+jQuery("#"+id).css("color"));
if (customclickcontrol){
if (!mouseover){
mouseover = true;
if (!mouseclick) cvjs_changeSpaceFixedLocation(id);
}
}
//cvjs_mouseover_handleObjectPopUp(id, handle);
}
function cvjs_mouseleave(id, handle, entity){
// console.log("mouseleave "+id+" "+handle+" "+jQuery("#"+id).css("color"));
if (customclickcontrol){
mouseover = false;
console.log("mouseleave variable mouseclick: "+mouseclick);
if (!mouseclick)
cvjs_hideOnlyPop();
}
}
function cvjs_mouseenter(id, handle, entity){
// cvjs_mouseenter_handleObjectStyles("#ffcccb", 5.0, 0.7, true, id, handle);
cvjs_mouseenter_handleObjectStyles("#F00", 10.0, 1.0, true, id, handle);
}
// END OF MOUSE OPERATION