d3.js axis labels - color not changing
axis-labels, d3.js, javascript
Solution
You need to use the `stroke` attribute (for the outline) or `fill` (for the fill colour). See e.g. this tutorial.
Problem
I'm creating my axis with the following text, however the color of the labels is not changing properly; the color the text remains black. Does anybody know why? ``` // create Axis svg.selectAll(".axis") .data(d3.range(angle.domain()[1])) .enter().append("g") .attr("class", "axis") .attr("transform", function(d) { return "rotate(" + angle(d) * 180 / Math.PI + ")"; }) .call(d3.svg.axis() .scale(radius.copy().range([-5, -outerRadius])) .ticks(5) .orient("left")) .append("text") .attr("y", function (d) { if (window.innerWidth < 455){ return -(window.innerHeight * .33); } else{ return -(window.innerHeight * .33); } }) .attr("dy", ".71em") .attr("text-anchor", "middle") .text(function(d, i) { return capitalMeta[i]; }) .attr("style","font-size:12px;") .style("color","#DE3378"); <--------------- adding color attribute here... ``` EDIT - trying to color different axis labels different colors with the following code, however this is not working properly... ``` .style(function() { for (var i = 0; i < unhealthyArray.length; i++) { if ($.inArray(unhealthyArray[i], capitalMeta) != -1) return "fill","red"; else return "fill","black"; } }); ```