Ok, Above sample giving me issue with my nodeTemplate.
Exception:vendor.js:52930 ERROR Error: Panel.itemTemplate value is not an instance of Panel: Map()#1626
Sample Code: var SSDnodeTemplate =
$(go.Node,
“Auto”,
{
layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized,
dragComputation: avoidNodeOverlap, //Avoid whenever we drag node
isShadowed: true,
shadowBlur: 2,
name:“mainNode”,
//shadowOffset: new go.Point(120, 6), //commented to move node in empty space
alignment: go.Spot.Center,
selectionAdorned: false,
},
new go.Binding("isShadowed", "category", exp => !(exp === 'Procedure' || exp === 'Section'|| exp === 'SECTION')),
new go.Binding("shadowColor", "isSelected",
(sel, shp) => sel ? shp.part.data.nodedetails.color : shp.part.data.nodedetails.shadowcolor).ofObject(),
new go.Binding("ItemsArray", "NodeDetails"),
new go.Binding("minSize", "category", exp => (exp === 'Procedure' || exp === 'Section' || exp === 'SECTION')
? new go.Size(120, 35) : new go.Size(0, 35)).ofObject(),
new go.Binding("fromSpot", "category", exp => (exp === 'Procedure' || exp === 'Section' || exp === 'SECTION')
? go.Spot.LeftSide : go.Spot.BottomSide).ofObject(),
new go.Binding("toSpot", "category", exp => (exp === 'Procedure' || exp === 'Section' || exp === 'SECTION')
? go.Spot.RightSide : go.Spot.TopSide).ofObject(),
$(go.Shape, "RoundedRectangle", {
name: "Icon",
stretch: go.GraphObject.Fill,
alignment: go.Spot.Center,
fromLinkableSelfNode: true,
toLinkableSelfNode: true,
strokeWidth: 0,
},
new go.Binding("fill", "isSelected",
(sel, shp) => sel ? shp.part.data.nodedetails.shadowcolor : shp.part.data.nodedetails.color).ofObject(),
new go.Binding("stroke", "isSelected", h => h ? "#0047AB" : "#5A5A5A").ofObject(), //Use For Select
new go.Binding("strokeWidth", "isSelected", h => h ? 6 : 0).ofObject(),
new go.Binding("stroke", "isHighlighted", h => h ? "#0047AB" : "#5A5A5A").ofObject(), //use For Search
new go.Binding("strokeWidth", "isHighlighted", h => h ? 4.8 : 0).ofObject(),
{
contextMenu: //Call For BRLD From SSD Node
$("ContextMenu",
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue"
},
$(go.TextBlock, "View Business Logic Linkage Diagram"),
{click: GoToURL},
new go.Binding("visible", "isbuttonvisible")
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue"
},
$(go.TextBlock, "CopyText"),
{click: copyText}
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue",
},
$(go.TextBlock, "PseudoCode"),
{click: GotoIntellisysPage},
new go.Binding("visible", "category", setBoolean)
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue",
},
$(go.TextBlock, "Neighborhood"),
{click: GoToNeibourHood},
new go.Binding("visible", "true")
)
) // end Adornment
}
),
$(go.Panel, 'Vertical',
$(go.Panel, "Table",
{
stretch: go.GraphObject.Fill,
defaultRowSeparatorStroke: go.Brush.lighten("grey"),
columnSpan: 2,
margin:new go.Margin(0, 0, 1.5, 0),
},
$(go.RowColumnDefinition, //changes for BugID: INT-574
{
row: 1,
isRow: true,
background: "#fef5d9",
stretch: go.GraphObject.Fill,
},),
$(go.RowColumnDefinition, {row: 0, sizing: go.RowColumnDefinition.None}),
$(go.TextBlock,
{
name: 'myTextBlock',
row: 0,
columnSpan: 2,
margin: 14,
textAlign: "center",
isMultiline: false,
editable: false,
height: 15,
font: "15px sans-serif",
},
new go.Binding("text", "text").makeTwoWay(),
{
contextMenu: //Call For BRLD From SSD Node
$("ContextMenu",
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue"
},
$(go.TextBlock, "View Business Logic Linkage Diagram"),
{click: GoToURL},
new go.Binding("visible", "isbuttonvisible")
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue",
},
$(go.TextBlock, "CopyText"),
{click: copyText},
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue",
"visible": false
},
$(go.TextBlock, "PseudoCode"),
{click: GotoIntellisysPage},
new go.Binding("visible", "category", setBoolean)
),
$("ContextMenuButton",
{
"ButtonBorder.fill": "white",
"_buttonFillOver": "skyblue"
},
$(go.TextBlock, "Neighborhood"),
{click: GoToNeibourHood},
new go.Binding("visible", "true")
)
) // end Adornment
},
),
$(go.TextBlock, {
row: 0,
column: 1,
alignment: go.Spot.BottomRight,
font: "9pt Sans-Serif",
},
new go.Binding("text", "nodedetails", nd => nd.extension)//File Extention
),
$(go.TextBlock, {
row: 0,
column: 0,
margin: 2,
alignment: go.Spot.BottomLeft,
font: "8pt Sans-Serif",
},
new go.Binding("text", "nodedetails", nd => nd.reference).makeTwoWay(),
),
$(go.TextBlock, {
row: 0,
column: 0,
margin: 1,
textAlign: "left",
alignment: go.Spot.TopLeft,
font: "8pt Sans-Serif",
},
new go.Binding("text", "isSelected",
(sel, shp) => shp.part.data.nodedetails.type=="" || shp.part.data.nodedetails.type=="N/a"? shp.part.data.category : shp.part.data.nodedetails.type).ofObject(),
),
$(go.TextBlock, {
row: 0,
column: 1,
margin: 2,
textAlign: "right",
alignment: go.Spot.TopRight,
font: "8pt Sans-Serif",
},
new go.Binding("text", "parentnode").makeTwoWay(),
),
$("PanelExpanderButton", "COLLAPSIBLE",
{
row: 0,
scale: 0.80,
column: 1,
alignment: go.Spot.TopRight,
click: FillBrList,
},
new go.Binding("visible", "isrulepresent", setBooleanvalue).makeTwoWay(),
go.GraphObject.make(go.Shape,
{
name: 'ButtonIcon',
width: 8,
height: 5,
scale: 0.80,
},
new go.Binding('geometryString', 'visible',
(vis) => {
return vis ? 'F M24.642,18.124l-1.768,1.768L16,13.017,9.124,19.892,7.357,18.124,16,9.481Zm0,0' : 'F M24.642,13.874l-1.768-1.768L16,18.981,9.124,12.106,7.357,13.874,16,22.517Zm0,0'
},
// ).ofObject('PROPTEXT')
).ofObject('COLLAPSIBLE')
)
),
),
$(go.Panel, 'Auto',
{name: "COLLAPSIBLE", visible: false,height:NaN, background:"#fef5d9",},
).add(
new go.Shape(
{stroke: "grey"}),
$(go.Panel, "Table",
{
background: "#fef5d9",
stretch: go.GraphObject.Fill, //height:25,
alignment: go.Spot.Left,
//alignment: go.Spot.Bottom,
margin: new go.Margin(0.5, 0, 0, 0),
},
$(go.Shape, "RoundedRectangle",{ //Search
row:0,
column:1,alignment: go.Spot.Left,
//margin:new go.Margin(1, 1, 1, 5),
margin:new go.Margin(1, 1, 1, 10),
width: 20, height: 20, fill: "#ffcc00",
},
// new go.Binding("margin", "",
// obj=>obj.part.data.ruledetails.length>=10?new go.Margin(0, 0, 0, 6):new go.Margin(0, 0, 0, 2)).ofObject(),
),
$(go.Shape, { //Search
row:0,
column:1,
alignment: go.Spot.Left,
//margin:new go.Margin(0, 0, 0, 8),
margin:new go.Margin(0, 0, 0, 13),
fill: "#ffcc00",
geometryString: "F M11.854 11.146l-2.698-2.698A4.25 4.25 0 1 0 8.75 9.25a4.25 4.25 0 0 0 2.698-.801l2.698 2.698a0.5 0.5 0 0 0 0.707-0.707zM5.25 8.75a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7z",
//stroke: "black"
},
// new go.Binding("margin", "",
// obj=>obj.part.data.ruledetails.length>=10?new go.Margin(0, 0, 0, 9):new go.Margin(0, 0, 0, 5)).ofObject(),
),
// $(go.Panel, "Spot",
// {
// row:0,
// column:1,
// margin:1,
// height:30,
// // alignment: go.Spot.BottomCenter
// },
$(go.Shape, { // Transparent shape to handle click event
row: 0,
column: 1,
//height: 24,
height: 25,
fill: "white",
alignment: go.Spot.BottomCenter,
margin: new go.Margin(2, 0.8, 0.5, 0.8),
stroke: "grey"
},
new go.Binding("width", "", setPanelWidth).ofObject(),
),
//Search box
$(go.TextBlock,"",
{
//width:100,
row:0,
column:1,
background: "#FFFFFF",
name: "SearchText",
alignment: go.Spot.BottomCenter,
margin: new go.Margin(8, 0, 1.5, 0),
textAlign: "left",
isMultiline: false,
//height:22.5,
editable: true,
font: "14px sans-serif",
stretch: go.GraphObject.Fill,
},
new go.Binding("textEditor","",BindTextEditor),
new go.Binding("width", "", setTextWidth).ofObject(),
),
$(go.Panel, "TableRow",
{ isPanelMain: true, defaultAlignment: go.Spot.Center },
$(go.TextBlock, "Sr. No.", {row:1, column: 0 }),
$(go.TextBlock, "Business Logic", {row:1, column: 1 }),
$(go.TextBlock, "ModiFied Logic", {row:1, column: 2 }),
),
go.GraphObject.build('ScrollingTable', {
row:2,
column:1,
//columnSpan:3,
//width:300,
name: 'SCROLLER',
alignment: go.Spot.Left,
'TABLE.itemTemplate': new go.Map()
.set("",DetailsTemplate)
.set("Header",
new go.Panel("TableRow", {
defaultStretch: go.Stretch.Horizontal,
background: "lightgray"
})
.add( // add whatever you want as headers for the columns
new go.TextBlock("Name", {
column: 0,
font: "bold 10pt sans-serif",
wrap: go.Wrap.None,
margin: new go.Margin(2, 2, 1, 0)
}),
new go.TextBlock("Value", {
column: 1,
font: "bold 10pt sans-serif",
wrap: go.Wrap.None,
margin: new go.Margin(2, 0, 1, 2)
})
)),
'TABLE.defaultRowSeparatorStroke': 'gray',
'TABLE.defaultRowSeparatorStrokeWidth': 0.5,
'TABLE.defaultSeparatorPadding': new go.Margin(0, 3, 0, 3),
'TABLE.rowSizing': go.Sizing.None,
},)
.bind('TABLE.itemArray', 'ruledetails')
.bind("height", "ruledetails", setPanelHeight)
.bind('TABLE.column', 'left', left => left ? 2 : 0)
),
)
),
);