How to dynamically change the sketched polygon-3d building extrusion with a slider?
I have added a Slider widget to the following example inside the sketch panel. (https://developers.arcgis.com/javascript/latest/sample-code/sandbox/?sample=sketch-3d)
So it looks like this, however, I wish that the Slider would change the initial extrusion height based on the value set by the user.
I am unable to find how to access the currently selected feature in the graphicsLayer.
I am currently only able to create a duplicate based on the first feature in the graphicsLayer and set its extrusion the event.value that would result in hundreds of graphics and I am unable to remove the previous feature, which is not optimal.
Slider and the extrusion setting looks like this, with solutions that did not work commented out. Perhaps I have to call an update on the graphic?
// Update the building layer extrusion
extrudeSlider.on(["thumb-change", "thumb-drag"], extrudeSizeChanged);
function extrudeSizeChanged(event) {
// Constructing a new graphic
let geom = graphicsLayer.graphics.getItemAt(0).geometry;
let symStyle = {
type: "polygon-3d",
symbolLayers: [
{
type: "extrude",
size: event.value,
material: {
color: white,
},
edges: {
type: "solid",
size: "3px",
color: blue,
},
},
],
};
let p = new Graphic({
geometry: geom,
symbol: symStyle,
});
graphicsLayer.add(p);
// This did not work
//extrudedPolygon.symbolLayers[0].size = event.value; // Update extrude size
//sketchViewModel.polygonSymbol = extrudedPolygon; // Apply updated symbol to SketchViewModel
// This did not work either
/* sketchViewModel.polygonSymbol.symbolLayers.find(
(symbolLayer) => symbolLayer.type === "extrude"
).size = event.value; */
}