根据multiBarChart doc,应该可以在multiBarChart上设置yScale,因为yScale应该是继承方法。
我想把它缩放到对数刻度。我使用了lineChart.yScale(d3.scale.log())
,但是对于multiBarChart,调用multiBarChart.yScale(d3.scale.log())
,会产生yScale is not a function
。
有没有其他方法来记录缩放multiBarChart的y轴?
由于
答案 0 :(得分:0)
我解决了以下方法,它由shouldLogScale
var:
nv.addGraph(() => {
this.chart = nv.models.multiBarChart()
...
.y(d => {
const y = parseFloat(d.y);
return this.shouldLogScale ? Math.log10(y <= 0 ? 1 : y) : y;
});
if(this.shouldLogScale) {
this.logScale();
} else {
this.chart.yAxis.tickFormat(d3.format(`,.${this.precision}f`));
}
...
});
初始化图表时:我修改y
值,强制y
(chart.forceY
)开始和结束值(将它们映射到log10 range),类似地我设置chart.yAxis.tickValues
。最后,我将刻度线(chart.yAxis.tickValues
)映射到它们的原始值。只需确保遵守日志功能的domain。
logScale
方法:
private logScale() {
this.chart.forceY([1, 180]
.map(v => Math.log10(v)));
this.chart.yAxis.tickValues([1, 3, 5, 10, 20, 50, 100, 180]
.map(v => Math.log10(v)));
this.chart.yAxis.tickFormat(d => Math.pow(10, d).toFixed(this.precision));
}
也许我可以使用y域和范围值的映射来避免在logScale
方法中使用log和pow函数。