ngAfterViewInit
seems too early to me, according to what little I know of the life-cycle in Angular. That happens after the components have been initialized, not after the DOM has been laid out.
indeed.
The only lifecycle event that works is
public ngAfterViewChecked(): void {
this.myPaletteComponent.palette.layoutDiagram(true);
}
in this case the arrows are positioned correctly in the palette. That is not a solution though. This event is called all the time, so it would be rather inefficient to do this.
I’m going to download the angular-basic sample again and add a palette to it and see if I can reproduce the problem to find out if it comes from gojs or my own app.
I suppose you could do it just once…
ok, but it sounds like a hack.
So… I have reproduced the problem in go-js-angular-basic. I will add the code that I added to the sample. Do you think it could be a bug or am I doing something wrong below ?
in initPalette function :
palette.linkTemplate = $(go.Link,
{ // because the GridLayout.alignment is Location and the nodes have locationSpot == Spot.Center,
// to line up the Link in the same manner we have to pretend the Link has the same location spot
locationSpot: go.Spot.Center,
selectionAdornmentTemplate:
$(go.Adornment, 'Link',
{ locationSpot: go.Spot.Center },
$(go.Shape,
{ isPanelMain: true, fill: null, stroke: 'deepskyblue', strokeWidth: 0 }, new go.Binding('strokeDashArray', 'dash')),
$(go.Shape, // the arrowhead
{ toArrow: 'Standard', stroke: null })
)
},
{
routing: go.Link.AvoidsNodes,
curve: go.Link.JumpOver,
corner: 5,
toShortLength: 4
},
new go.Binding('points'),
$(go.Shape, // the link path shape
{ isPanelMain: true }, new go.Binding('strokeDashArray', 'dash')),
$(go.Shape, // the arrowhead
{ toArrow: 'Standard', stroke: null })
),
and the data:
public paletteLinkData: Array<go.ObjectData> = [
{
points: new go.List(/*go.Point*/).addAll([new go.Point(0, 0), new go.Point(30, 0), new go.Point(30, 40), new go.Point(60, 40)]),
strokeWidth: 4, dash: [6, 3]
},
{ points: new go.List(/*go.Point*/).addAll([new go.Point(20, 20), new go.Point(60, 20), new go.Point(60, 40), new go.Point(60, 50)]) },
];
We’ll look into it.
Hello, can you try the latest version of gojs-angular
(1.0.13) and let me know if that solves your problem?
yes ! that fixed it :) Thanks you.