my requirement is dynamically set height & width property for Rectangle shape area. currently i am trying to set height & width from dropdown selected item value.
var gradBorderIndicatorTopLeft =
$$(go.Node, “Spot”, new go.Binding(“zOrder”), { zOrder: 0 },
$$(go.Shape, "Rectangle",
{
width: systemWidth,
height: systemHeight,
margin: 0,
background: "white",
// borderColor:"black",
fill: null
//,row: 0,
//column:1
}
,
new go.Binding("width", "Swidth")
,new go.Binding(“height”, “Sheight”)
));
dropdown selection change coding:
//Load the default system Resolution
if (Utility.isNullOrEmpty($("#ddlResolution")[0].options.innerText))
{
var tempValues = ["1024×576", "1152×648", "1280×720", "1280×800", "1280×1024", "768×1024", "1024×768", "1360×768", "480×800", "360×640", "1680×1050", "360×640", "1920×1200", "1440×900", "1366×768", "1600×900", "1920×1080", "2560×1440", "Custom"];
var option = '';
for (var i = 0; i < tempValues.length; i++) {
option += '<option value="' + tempValues[i] + '">' + tempValues[i] + '</option>';
}
$("#ddlResolution").append(option);
}
on change:
$('#ddlResolution').on('change', function (e)
{
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
if (!Utility.isNullOrEmpty(valueSelected))
{
if (valueSelected === "Custom")
{
$('#divResolution').removeClass("hidden");
// $("#LayoutOptions").removeClass("layoutheight");
// $("#LayoutOptions").addClass("customlayoutheight");
// var tem = summerNoteHeight - 44;
//$(".note-editor").height(tem + "px");
}
else
{
$('#divResolution').addClass("hidden");
//$("#LayoutOptions").removeClass("customlayoutheight");
//$('#LayoutOptions').addClass("layoutheight");
//$(".note-editor").height(summerNoteHeight + 44 + "px");
var tempValue = valueSelected.split('×');
systemWidth = parseInt(tempValue[0]);
systemHeight = parseInt(tempValue[1]);
if (!Utility.isNullOrEmpty(gradBorderIndicatorTopLeft) && !Utility.isNullOrEmpty(wiDiagram))
{
// wiDiagram.each(function (evt) {
wiDiagram.startTransaction('modified zOrder1');
wiDiagram.model.setDataProperty(gradBorderIndicatorTopLeft.part, "Swidth", systemWidth);
//wiDiagram.model.setDataProperty(gradBorderIndicatorTopLeft.part.data, "Sheight", systemHeight);
wiDiagram.commitTransaction('modified zOrder1');
//}
//)
}
}
}
});
I need to set rectangle height and width based on drop down selected value. currently rectangle height & width is not changed based dropdown value
please advise me on this