esri example "Edit features in 3D with the Editor widget" - how to insert the Expand and Snap elements into a custom widget

MichaelLev — Tue, 08 Jun 2021 15:43:32 GMT

I'm developing custom widgets for WAB (Develper Edtion) 2.20, Launchpad Theme, on 3D Scenes (ArcGIS API for javascript 4.20). I am still a newbie.

My question: How to put, by code, the snapping elements (the info and the Expand that contains the configuration) from ESRI code example Edit features in 3D with the Editor widget into lower right corner of my widget? The elements are created by code, so they must be put there by code.

To be more specific: All I need is to adapt next code (from ESRI example) to insert the 2 components into lower right in the widget:

view.ui.add([{
component: configurationExpand,
position: "bottom-right",
index: 0
}, {
component: "info",
position: "bottom-right",
index: 1
}]);

// If the snapping configuration is toggled open, hide the info window
configurationExpand.watch("expanded", (value) => {
if (value) {
document.getElementById("info").classList.add("esri-hidden");
} else {
document.getElementById("info").classList.remove("esri-hidden");
}
});

Help wil be greatly appreciated.

Re: esri example "Edit features in 3D with the Editor widget" - how to insert the Expand and Snap elements into a custom widget

MichaelLev — Wed, 09 Jun 2021 08:58:55 GMT

I succeeded, by putting the Expand and th einfo label in the widget HTML, thus:

<div>
<span class="div-left" id="edit3dexpand" data-dojo-attach-point="edit3dexpand"></span>
<span class="div-left" id="info">${nls.titleConfigureSnapping}</span>
</div>

and in the javascript&colon;

const configurationExpand = new Expand({

... (other constructor lines remain the same)

container: that.edit3dNode.querySelector("#edit3dexpand")

});

and in the css:

.jimu-widget-edit3d .div-left { float: left; }

.jimu-widget-edit3d .div-right { float: right; }

topic Re: esri example "Edit features in 3D with the Editor widget" - how to insert the Expand and Snap elements into a custom widget in Web AppBuilder Custom Widgets Questions

esri example "Edit features in 3D with the Editor widget" - how to insert the Expand and Snap elements into a custom widget

Re: esri example "Edit features in 3D with the Editor widget" - how to insert the Expand and Snap elements into a custom widget