2012-07-27 13 views
17

Gibt es eine Möglichkeit, eine d3.js Achse ohne irgendeine Nummerierung zu erstellen? Tickmarks sind in Ordnung, aber nur keine Zahlen. Momentan erstelle ich meine d3.js-Achse mit dem folgenden Code. Danke im Voraus.create d3.js Achsen ohne Nummerierung

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

Antwort

42

Der einfachste Weg, tick-Etiketten zu verstecken ist via CSS:

.axis text { display: none; } 

Alternativ Sie die leere Zeichenfolge als tick-Format verwenden:

axis.tickFormat(""); 

Oder verwenden Sie könnten

selection.call(axis).selectAll("text").remove(); 
: post-Auswahl, um die Textelemente nach dem Erstellen der Achse zu entfernen, 0

Natürlich bevorzuge ich CSS, da es das deklarativste ist. Beispiel hier:

+2

wie immer, ein großes Motto von mbostock! – Apollo

+1

Gibt es eine Möglichkeit, CSS in ein d3.js-Element einzubetten? Ich benutze canvg und es strippt alle meine CSS, die inline in HTML ist ... – Apollo

+0

http://stackoverflow.com/questions/11694038/setting-css-of-axis-in-d3-js – Apollo