Drawing shape changes

@rahimhaji wrote:

Dear Mr.Walters,

Greetings! reference to my previous post:

iam attaching picthre before (grid.visible=true) and after (grid.visible=false).

after.PNG931×609 37.5 KB

before.PNG778×580 43.7 KB

my code looks like:

var selectedNodeValue;
 var centerObjX = centerObjY = 0;
 var centerObj;
 var leftMainNodeInc = 0;
 var lightText = "whitesmoke";
 // initialize the main Diagram
 var $$ = go.GraphObject.make; // for conciseness in defining templates
 var diagram = new go.Diagram("myDiagramDiv");
diagram.grid.visible = true;
 diagram.allowZoom = false;

function showMessage(aValues) {
 console.log(aValues);
 }
-------
diagram.nodeTemplateMap.add("LeftRectangle",
$$(go.Node, "Spot", nodeStyle(),
{
selectionAdornmentTemplate: // adornment when a group is selected
$$(go.Adornment, "Auto",
$$(go.Placeholder),
$$("Button",
{
alignment: go.Spot.RightCenter,
click: addLeftSubNodeAndLink // this function is defined below
},
$$(go.Shape, "PlusLine", { name: "right", width: 6, height: 6 })
)
)
},
new go.Binding("movable", "movable"),
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding("uid", "uid"),
$$(go.Panel, "Vertical",
$$(go.Panel, "Auto",
$$(go.Shape, "Rectangle",
{
minSize: new go.Size(200, 90),
fill: new $$(go.Brush, "Linear", { 0.0: "White", 1.0: "#00B0F0" }),
stroke: null
},
new go.Binding("fill")),
$$(go.TextBlock, "Rectangle", { width: 90, overflow: go.TextBlock.OverflowEllipsis, maxLines: 4, wrap: go.TextBlock.WrapDesiredSize, margin: 5, isMultiline: true, textAlign: "center", editable: false },
{ font: "bold 11pt Helvetica, Arial, sans-serif", stroke: "#000000", editable: false, width: 150, height: 60, background: "white", textAlign: "center", verticalAlignment: go.Spot.Center },
new go.Binding("text"))
),
$$(go.Panel,"Table",
{ column: 0 }
),
   $$(go.Panel, "Auto",
     $$(go.Shape, "Rectangle", { fill: "white" },
       new go.Binding("maxSize", "tableMaxSize")),
   $$(go.Panel, "Table",
     { defaultRowSeparatorStroke: "gray" },
     $$(go.RowColumnDefinition, { column: 0, width: 200 }),
     //$$(go.RowColumnDefinition, {row:0},new go.Binding("height","row0height")),
     $$(go.Panel, "Auto", { row: 0, column: 0, alignment: go.Spot.Center },
       $$(go.TextBlock, { margin: 5 }, new go.Binding("text", "statusTxt"))
     ),
     $$(go.Panel, "Auto", { row: 1, column: 0, alignment: go.Spot.Center },
       $$(go.TextBlock, { margin: 5 }, new go.Binding("text", "preProb"))
     ),
     $$(go.Panel, "Auto", { row: 2, column: 0, alignment: go.Spot.Center },
       $$(go.TextBlock, { margin: 5 }, new go.Binding("text", "preSev"))
     ),
     $$(go.Panel, "Auto", { row: 3, column: 0, alignment: go.Spot.Center },
       $$(go.TextBlock, { margin: 5,background:"yellow",stroke:"green" }, new go.Binding("text", "riskClass"))
     )
   ))
   ),

// three named ports, one on each side except the top, all output only:   
makePort("R", go.Spot.Right, false, false),

{
 click: function (e, obj) {
   selectedNode(e, obj)
 }
},
{ doubleClick: function (e, obj) {  OpenPopup(e,obj) } }
));

Posts: 3

Participants: 1

Read full topic