Удалить запятую, чтобы разделить группы тысяч меток оси в D3

Question

Я взял эту функцию перерисовки от http://bl.ocks.org/stepheneb/1182434, и я бы хотел ее адаптировать.

Как удалить разделитель запятой для групп тысяч? в коде console.log (self.x.ticks (10) .map (self.x.tickFormat (2, ".1"))) работает и дает числа в этом формате: ["0", "1000", " «2000», ..], чего я хочу. Когда я помещаю его в .data(), как в коде, я получаю [«0», «1000», «2000», ..]. Я использую зум, поэтому я не могу жестко закодировать метки.

Основная часть кода должна быть:

fx = self.x.tickFormat(10), 
    //fx = self.x.tickFormat(d3.format("f2")), //does not work 
    fy = self.y.tickFormat(10); 

    // Regenerate x-ticks… 
    var gx = self.vis.selectAll("g.x") 
      .data(self.x.ticks(10).map(self.x.tickFormat(2, ".1")), String) 
      .attr("transform", tx); 

    console.log(self.x.ticks(10).map(self.x.tickFormat(2, ".1"))) 


    gx.select("text") 
      .text(fx); 

Вся функция перерисовки:

SimpSimpleGraph.prototype.redraw = function() { 
var self = this; 
return function() { 
    var tx = function(d) { 
     return "translate(" + self.x(d) + ",0)"; 
    }, 
    ty = function(d) { 
     return "translate(0," + self.y(d) + ")"; 
    }, 
    stroke = function(d) { 
     return d ? "#ccc" : "#666"; 
    }, 
    fx = self.x.tickFormat(10), 
    //fx = self.x.tickFormat(d3.format("f2")), //does not work 
    fy = self.y.tickFormat(10); 

    // Regenerate x-ticks… 
    var gx = self.vis.selectAll("g.x") 
      .data(self.x.ticks(10).map(self.x.tickFormat(2, ".1")), String) 
      .attr("transform", tx); 

    console.log(self.x.ticks(10).map(self.x.tickFormat(2, ".1"))) 


    gx.select("text") 
      .text(fx); 

    var gxe = gx.enter().insert("g", "a") 
      .attr("class", "x") 
      .attr("transform", tx); 

    gxe.append("line") 
      .attr("stroke", stroke) 
      .attr("y1", 0) 
      .attr("y2", self.height); 

    gxe.append("text") 
      .attr("class", "axis label") 
      .attr("y", self.height) 
      .attr("dy", "1em") 
      .attr("text-anchor", "middle") 
      .text(fx) 
      .style("cursor", "ew-resize") 
      .on("mouseover", function(d) { d3.select(this).style("font-weight", "bold");}) 
      .on("mouseout", function(d) { d3.select(this).style("font-weight", "normal");}) 
      .on("mousedown.drag", self.xaxis_drag()) 
      .on("touchstart.drag", self.xaxis_drag()); 

    gx.exit().remove(); 

    // Regenerate y-ticks… 
    var gy = self.vis.selectAll("g.y") 
      .data(self.y.ticks(10), String) 
      .attr("transform", ty); 

    gy.select("text") 
      .text(fy); 

    var gye = gy.enter().insert("g", "a") 
      .attr("class", "y") 
      .attr("transform", ty) 
      .attr("background-fill", "#FFEEB6"); 

    gye.append("line") 
      .attr("stroke", stroke) 
      .attr("x1", 0) 
      .attr("x2", self.width); 

    gye.append("text") 
      .attr("class", "axis label") 
      .attr("x", -3) 
      .attr("dy", ".35em") 
      .attr("text-anchor", "end") 
      .text(fy) 
      .style("cursor", "ns-resize") 
      .on("mouseover", function(d) { d3.select(this).style("font-weight", "bold");}) 
      .on("mouseout", function(d) { d3.select(this).style("font-weight", "normal");}) 
      .on("mousedown.drag", self.yaxis_drag()) 
      .on("touchstart.drag", self.yaxis_drag()); 

    gy.exit().remove(); 
    //This zoom is call after the plot has loaded 
    self.plot.call(d3.behavior.zoom().x(self.x).y(self.y).on("zoom", self.redraw())); 

    self.update(); 
    }  
} 

Answer 1

Насколько изменяя способ d3 выходов числа, я не имею ни малейшего понятия. Но вы можете изменить эти значения после использования прототипа строки .replace.

Пример

var someString = 'The catcher in the rye'; 
someString.replace('catcher','captcha'); //"The captcha in the rye" 

А вот как применить это в массив. http://jsfiddle.net/sq2johrv/1/