Question

是否可以创建d3.js轴并且没有刻度线和没有编号方案？基本上，我可以让轴不可见吗？我正在使用下面的代码创建我的轴：

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([0,0]))
      .ticks(1)
      .orient("left"))
    .append("text")
    .style("color", "white") 
      .attr("y", 
        function (d) {
          if (window.innerWidth < 455){
            console.log("innerWidth less than 455: ",window.innerWidth);
            return -(0);
          }
          else{
            console.log("innerWidth greater than 455: ",window.innerWidth);
            return -(0);
          }
        })
      .attr("dy", "0em");

Answer 1

如果您不希望您的轴可见，请不要绘制它们（基本上注释掉此代码）。

如果您真的只想将它们变为白色，可以使用以下类：

.axis line, .axis text, .axis path {
   color: white;
}

这将是操纵它们以使其“开启”和“关闭”的最简单方法。此外，如果您需要弄清楚如何设置d3图表的样式，您可以像使用CSS一样浏览SVG并使用CSS进行样式设置。

例如，这里是axis中刻度线的SVG。

<line class="tick" y2="6" x2="0"></line>

您可以看到我定位了元素（line），但您也可以定位（.tick）。

d3.js轴 - 使其有0个刻度并且没有标记

1 个答案: