search

krispo / angular-nvd3

AngularJS directive for NVD3 reusable charting library (based on D3). Easily customize your charts via JSON API.
http://krispo.github.io/angular-nvd3
MIT License
1.29k stars 377 forks source link

When selecting/deselecting legends with multi lines on line chart the lines start showing incorrect colors #691

Open s4saurabh opened 7 years ago

s4saurabh commented 7 years ago

Hi,

I'm having a line chart with multiple lines showing different colors which match the color of the legend when loaded. But when I select/deselect some of the legends the line color start getting duplicated for some of the lines. I was able to replicate this issue with the example of cumulativeLineChart by changing the chart type to lineChart and setting useInteractiveGuideline=false. This issue doesn't seem to occur when using useInteractiveGuideline=true, but if I use that property than the tooltip starts showing way above the graphs as my graph is on 4th row on the page with 3 more charts above.

See plunkr :http://plnkr.co/edit/1AMgW5CpdW0tvmDILlEW?p=preview

image

jdforsythe commented 6 years ago

This issue also happens (sometimes) when you resize a chart, even without deselecting any lines. It appears the color selection is somehow dependent on interactive guidelines. Turning the guideline on fixed the issue. Thanks @s4saurabh for finding the fix! I couldn't figure out why the issue only happen intermittently and only on this chart.