我有一個序號scale
,其中有不同值的某些標籤。我想爲該比例顯示一個軸,其中軸標籤與刻度標籤不同。我有這樣的代碼:給出與標尺名稱不同的d3序數軸標籤
var width = 1000
var height = 600
var margins = {
left: 100, // 40
right: 25,
bottom: 50,
top: 0
}
var y = d3.scale.ordinal().domain(["This", "That", "Other"]).rangePoints([margins.top, height-margins.bottom], 1);
var svg = d3.select("#plot").append("svg").attr("width",width).attr("height",height)
var yAxis = d3.svg.axis()
.scale(y)
.orient("left")
.tickValues(["This is long", "That is long", "Other is long"])
svg.append("g")
.attr("class", "axis")
.attr("transform", "translate(" + margins.left + ",0)")
.classed("yaxis", true)
.call(yAxis);
這用來工作,但顯然出現了在D3中,導致它不再工作在過去幾個月的一些變化。 (This other question也表示我應該能夠以這種方式使用tickValues
。)滴答標籤不出現。我得到的JavaScript控制檯的錯誤說:
Unexpected value translate(0,NaN) parsing transform attribute. @ http://d3js.org/d3.v3.js:596
通過代碼跟蹤,看來D3試圖調用每個刻度值規模;即它叫y("This is long")
,這導致NaN,因爲「這很長」並不是規模。我不知道它爲什麼這樣做。
Here is a fiddle顯示問題。如果註釋掉.tickValues
一行,則軸標籤正確顯示。沒有註釋該行,標籤不起作用。
在d3中設置序號軸的刻度標籤的方法是什麼?
要明確一點,對於mapper來說,左邊是你的原始值,右邊是你想要的值。 – JLewkovich