创建d3.js轴而不编号

时间:2012-07-27 16:02:13

标签: javascript svg d3.js customization

有没有办法在没有任何编号的情况下创建d3.js轴? Tickmarks还可以,但根本没有数字。目前我正在使用下面的代码创建我的d3.js轴。提前谢谢。

 // 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([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");

1 个答案:

答案 0 :(得分:46)

隐藏刻度标签的最简单方法是通过CSS:

.axis text { display: none; }

或者,您可以使用空字符串作为刻度格式:

axis.tickFormat("");

或者,您可以使用后选择在创建轴后删除文本元素:

selection.call(axis).selectAll("text").remove();

当然,我更喜欢CSS,因为它是最具说服力的。示例: