i have created multi line chart in d3. each line gets specific color according color array, follows:
var colors = ["#357ca5", "#001f3f", "#00c0ef", "#39cccc", "#00a65a", "#605ca8", "#f39c12", "#f56954", "#d81b60", "#d2d6de"]; (var lineindex = 0; lineindex < filteredlines.length; lineindex++) { svg.append("path") .datum(<any>filteredlines[lineindex].data) // routine line stuff.. .style("stroke", colors[lineindex]) below chart, have legends each line, clicking on disables line , shows remaining lines. achieve using above filteredlines collection, in set isvisible property true or false according legend click.
the problem is, once line disabled, above loop runs through remaining lines , renders them correctly; line color gets set according colors[lineindex] , gets different value every time.
what want lines same color every time regardless of it's visible or hidden. how can achieve this? should implement sort of mapping line colors? appreciated. thank you.
i suggest add colors actual line data, rather getting via array. refer color filteredlines[lineindex].color.
you want attach color info each line @ first time.
