5

d3.jsで.axispath{fill:none}を実行する方法はありますか?

.call(d3.svg.axis()で.attrと.styleを試しましたが、役に立ちませんでした。ここで何か間違ったことをしているだけです...

軸の作成に使用している完全なコードは次のとおりです。

 // 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)
      .tickFormat("")
      .orient("left"))
      .attr("fill","none") // EDITED WITH FILL NONE
    .append("text") 
      .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");
4

1 に答える 1

9

CSS 設定を d3 要素に適用したい場合、それらに ID またはクラスを割り当て (上記で行っています)、CSS を使用して目的の属性を適用するのが最も簡単であることがわかりました。たとえば、JS を上記のようにしておき、css で次のようにします。

.axis path {

    fill:           none;
}

JS で実行する場合は、次を使用する必要があります。

.style('fill', 'none')

ただし、.call(d3.svg.axis()) 内ではなく、軸を含む svg に適用する必要があります。お役に立てれば。

于 2012-07-30T12:51:14.583 に答える