Hi,
We’re using GoJS to render the SVG, but we’re getting white space during the rendering. Please see the screenshot below.
Please check the node template code
$(go.Node, 'Spot', { rotatable: true, selectionObjectName: "PIC"},
{
contextMenu:
$('ContextMenu',
$('ContextMenuButton',
$(go.TextBlock, 'Group'),
{ click: function(e, obj) { e.diagram.commandHandler.groupSelection(); } },
new go.Binding('visible', '', function(o) {
return o.diagram.selection.count > 1;
}).ofObject()),
$('ContextMenuButton',
$(go.TextBlock, 'SubSheet'),
{
click: function (e, obj)
{
console.log(this.showDialog);
console.log(e);
console.log(obj);
}
},
new go.Binding('visible', '', function (o) {
return o.diagram.selection.count == 1;
}).ofObject())
)
},
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
$(go.Panel, 'Auto',
{
doubleClick: function (e, obj)
{
}
},
$(go.Shape, 'RoundedRectangle', {
width: 40,
height: 40, stroke: null,
fromLinkable: true, fromLinkableSelfNode: false, fromLinkableDuplicates: false,
toLinkable: true, toLinkableSelfNode: false, toLinkableDuplicates: false
},
new go.Binding('fill', 'color', (c, panel) => {
return c;
})
),
$(go.TextBlock, {
margin: 0, editable: true },
new go.Binding('text').makeTwoWay()),
$(go.Picture,
{
//desiredSize: new go.Size(50, 50),
alignment: go.Spot.Center,
width: 75,
height: 75,
//},
},
new go.Binding("source"),
{
click: function (e, obj)
{
}
})
),
// Ports
makePort('t', go.Spot.TopCenter,false,true),
makePort('l', go.Spot.Left, true, true),
makePort('r', go.Spot.Right, true, true),
makePort('b', go.Spot.BottomCenter, true, false),
{ // handle mouse enter/leave events to show/hide the ports
mouseEnter: (e, node) => showSmallPorts(node, true),
mouseLeave: (e, node) => showSmallPorts(node, false)
}
);
Please check the SVG image template
