SVG disappears after routing with angular route

[alex0598]

The current setup is a fixed side navigation with an ngx trend chart. The main components are routed. If the route changes the svg disappears for some time till (maybe change detection runs).

If we look into the html code i found this line of code: <path fill="none" class="ng-tns-c514-14 ng-trigger ng-trigger-pathAnimaiton" stroke="url('http://localhost:4200/plant-diagnosis/overview/cabinet/21#ngx-trend-vertical-gradient-7906924350227782')"

What i observed is that the svg comes visible again after this url changes to the right routing url which is after the data set is updated from the api (change detection). Why is there a url used ?

The comp:

<ngx-trend autoDraw="true" autoDrawDuration="1000" autoDrawEasing="ease-out" smooth="true" [height]="60" [data]="systemCycleTimeData" [gradient]="['#2196F3']" radius="0.1" strokeWidth="2.7" strokeLinecap="round" > </ngx-trend>

[alex0598]

I have changed [gradient]="['#2196F3']" to stroke="#2196F3". Now it works as expected. But maybe you can look at the issue when gradient is used.