go.js version 1.4.20
I’m attempting to combine two types of behavior for a panel/tooltip and not having much luck.
I would like to combine the placement behavior of Buttons that show on Hover, where I attach a ‘tooltip’ adornment to the side of the graphObject shape the mouseHover event is firing on (roundedRectangle)
with the ‘scaling’ behavior of a tooltip where it does not scale with the diagram to make the tooltips look consistent and to make them readable even in very large diagrams.
Current tooltip code:
template =
GO(go.Node, "Spot",
new go.Binding("location", "", getLocation),
{
props...
},
// the main content:
GO(go.Panel, "Vertical", {
mouseHover: taskHover
},
GO(go.Shape, "RoundedRectangle",
{
props...
},
bindings...
)
),
GO(go.TextBlock,
bindings...
),
portgetters...
);
}
function subflowHover(e, obj) {
var node = obj.part;
subflowTooltip.adornedObject = node;
node.addAdornment("subflowHover", subflowTooltip);
}
var subflowTooltip =
GO(go.Adornment, "Spot",
{
background: "transparent",
mouseLeave: function(e, obj) {
var ad = obj.part;
ad.adornedPart.removeAdornment("subflowHover");
}
},
GO(go.Placeholder,
{
background:"transparent",
}
),
GO(go.Panel, "Auto",
{
background:"transparent",
alignment: new go.Spot(1,0.5,0,-1*STATUS_ICON_SIZE/2),
alignmentFocus: go.Spot.LeftCenter
},
GO(go.Shape, "RoundedRectangle", {fill: "white"}),
GO(go.Panel, "Vertical",
{
background:"transparent"
},
GO(go.TextBlock, {margin:5},
new go.Binding("text", "modelObject", function(modelObject) {
return modelObject.getTooltipTitle();
})
)
)
)
);
I can get both behaviors independently, but I cannot make them both work together. I was expecting the placeholder on the tooltip to actually attach itself to the node, but it follows the mouse cursor for some reason.
