Hi may i know how to create a pop out screen for each of my equipment control in 3D format
You can use general javascript create a html dialog or use the library in SaaS Composer.
If you use ht library
In open scene:
dialog = new ht.widget.Dialog();
Select an object, choose “control” in the properties on the right, check “interactive,” and then add a click event to the object.
dialog.setConfig({
title: "Prompt",
titleAlign: "left",
closable: true,
draggable: true,
contentPadding: 20,
content: `<div id="dialogArea" style="width:500px;height:500px;"></div>`,
buttons: [{
label: "Cancel"
}, {
label: "Yes"
}],
buttonsAlign: "right",
action: function (item, e) {
var alertDialog = new ht.widget.Dialog({
title: "Alert",
contentPadding: 20,
content: "<p>You clicked '" + item.label + "'</p>",
buttons: [{
label: "OK"
}],
action: function () {
alertDialog.hide();
}
});
alertDialog.show();
dialog.hide();
}
});
dialog.show();
if (window.location.href.indexOf('sceneAndDisplay.html') !== -1) {
var obj = {
fileName: 'displays/builtIn/wastewater treatment/wastewater treatment.json',
gvType: 'displays'
}
if (typeof commonViewUtil != 'undefined') {
var exist = false;
for (var i = 0; i < commonViewUtil.currentFiles.length; i++) {
if (commonViewUtil.currentFiles[i]['fileName'] == obj['fileName']) {
document.getElementById('dialogArea').innerHTML = "";
commonViewUtil.currentFiles[i]['graphView'].addToDOM(document.getElementById('dialogArea'));
exist = true;
}
}
if (!exist) {
commonViewUtil.appendDisplayToDOM(obj, { 'parentViewId': 'dialogArea' })
}
}
} else {
document.getElementById('dialogArea').innerHTML = "<span>Not in Layer page</span>";
}
You can download the example in
pop up dialog