Rect in in d3js svg исчезает после перехода на другую страницу в AngularJS

Question

У меня очень странное поведение в моем приложении angularjs.

1) Я использую d3js, чтобы сделать приятный Bar Chart

graphG.append("rect") 
     .attr("id", function (d, i) { 
     return "bar_" + i; 
     }) 
     .attr("x", 0) 
     .attr("y", 0) 
     .attr("height", barHeight - 1) 
     .attr("width", function (d, i) { 
     return rectWidth(d, i); 
     }) 
     .attr("fill", rectColor); 

2) После обновления данных Eсть происходит переход

 barG.select("#bar_" + i) 
     .transition() 
     .duration(duration) 
     .attr("fill", rectColor(d)) 
     .attr("width", rectWidth(d, i)); 

До сих пор ширина перехода отлично работает. Цветовые переходы с градиентом не работают, но это еще один вопрос. Он меняет цвет, но без плавного перехода.

Если я перенаправлять на другую страницу и вернуться в прямоугольник не будет оказано больше. Прямо в доме. Изменен атрибут ширины. Нет бара.

После F5 перезагрузки все, что прекрасно снова.

И более странно себя вести: это происходит в Chrome, он отлично работает в Firefox.

У кого-нибудь есть идеи?

Answer 1

Я нашел проблему:

ошибка была, что градиент ID (возврат функции rectColor) была одинаковой в обеих директив. Похоже, в Chrome есть кеширование.

Переименование идентификатора градиента в одной директиве устраняет проблему.