d3.js axis labels – color not changing

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
      .attr("class", "axis")
      .attr("transform", function(d) { return "rotate(" + angle(d) * 180 / Math.PI + ")"; })
      .scale(radius.copy().range([-5, -outerRadius]))
        function (d) {
          if (window.innerWidth < 455){
            return -(window.innerHeight * .33);
            return -(window.innerHeight * .33);
      .attr("dy", ".71em")
      .attr("text-anchor", "middle")
      .text(function(d, i) { return capitalMeta[i]; })
      .style("color","#DE3378");   <--------------- adding color attribute here...

– 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";
                    return "fill","black";

You need to use the stroke attribute (for the outline) or fill (for the fill colour). See e.g. this tutorial.

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .
Read More:   Javascript get XPath of a node

Similar Posts