d3.js 轴标签 - 颜色不变答案

【问题标题】：d3.js axis labels - color not changingd3.js 轴标签 - 颜色不变
【发布时间】：2012-08-16 22:24:07
【问题描述】：

我正在使用以下文本创建我的轴，但是标签的颜色没有正确改变；文本的颜色保持黑色。有人知道为什么吗？

  // 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...

编辑 - 尝试使用以下代码为不同的轴标记不同的颜色，但这不能正常工作...

  .style(function() {
      for (var i = 0; i < unhealthyArray.length; i++) {
              if ($.inArray(unhealthyArray[i], capitalMeta) != -1)
                    return "fill","red";
              else
                    return "fill","black";
      }
  });

【问题讨论】：

标签： javascript d3.js axis-labels

【解决方案1】：

您需要使用stroke 属性（用于轮廓）或fill（用于填充颜色）。参见例如this tutorial.

【讨论】：

谢谢，这成功了！但是，我想知道如何更改轴上只有 1 个标签的颜色？例如，假设我在这个图表中有 3 个轴（它是一个 d3.js 径向图表），我只希望其中一个标签是颜色 #DE3378。这可能吗？？谢谢！
最简单的方法可能是为这些标签分配不同的 CSS 类。