1 回答

TA貢獻1884條經(jīng)驗 獲得超4個贊
您看到的問題是 Symlog 音階的一個持續(xù)存在的問題:https://github.com/d3/d3-scale/issues/162
您可以在這個簡單的演示中看到它:
const svg = d3.select("svg");
const scale = d3.scaleSymlog()
.domain([0, 100000])
.range([140, 10]);
const axis = d3.axisLeft(scale).ticks(4)(svg.append("g").attr("transform", "translate(50,0)"));
<script src="https://d3js.org/d3.v5.min.js"></script>
<svg></svg>
以下是可能的解決方案:
更改 D3 源代碼,如 GitHub 鏈接中所述;
為自己設(shè)置一個足夠刻度值的數(shù)組,您將傳遞給
axis.tickValues
;使用 Log 刻度,其中域從 1 開始而不是從零開始。
最后一個選項似乎是一個黑客,但它是迄今為止最簡單的,并且鑒于您的最高價值如此之大,從視覺上講,它不會對dataviz產(chǎn)生任何影響。在這里:
const svg = d3.select("svg");
const scale = d3.scaleLog()
.domain([1, 100000])
.range([140, 10]);
const axis = d3.axisLeft(scale).ticks(4).tickFormat(d => d3.format("")(d))(svg.append("g").attr("transform", "translate(50,0)"));
<script src="https://d3js.org/d3.v5.min.js"></script>
<svg></svg>
添加回答
舉報