Question

我有一个d3代码

 svg = d3.select("svg")

var myScale = d3.scale.linear()
    .domain([0,100])
    .range([0,400]);


var ticks = [0,50,60,100];

  var myAxis = d3.svg.axis()
.scale(myScale)
.tickValues(ticks);

  svg.append("g")
    .attr("class", "axis")
    .call(myAxis)
    .attr("transform","translate(100,100)");

http://tributary.io/inlet/5207532

我希望刻度标签为a，b，c，d而不是0,50,60,100

Answer 1

svg = d3.select("svg")

var myScale = d3.scale.linear()
        .domain([0,100])
        .range([0,400]);


var ticks = [0,50,60,100];
var tickLabels = ['a','b','c','d']

var myAxis = d3.svg.axis()
  .scale(myScale)
  .tickValues(ticks)
.tickFormat(function(d,i){ return tickLabels[i] });

svg.append("g")
        .attr("class", "axis")
        .call(myAxis)
        .attr("transform","translate(100,100)");

使用.tickFormat

使用D3将刻度值更改为文本

1 个答案: