我正在绘制一张显示服务器流量的图表。我希望在y轴上显示单位为KB、MB等。您有什么意见,如何通过d3轴比例尺来实现这一点。
我正在绘制一张显示服务器流量的图表。我希望在y轴上显示单位为KB、MB等。您有什么意见,如何通过d3轴比例尺来实现这一点。
d3.tickFormat
函数 来实现:演示。var bytesToString = function (bytes) {
// One way to write it, not the prettiest way to write it.
var fmt = d3.format('.0f');
if (bytes < 1024) {
return fmt(bytes) + 'B';
} else if (bytes < 1024 * 1024) {
return fmt(bytes / 1024) + 'kB';
} else if (bytes < 1024 * 1024 * 1024) {
return fmt(bytes / 1024 / 1024) + 'MB';
} else {
return fmt(bytes / 1024 / 1024 / 1024) + 'GB';
}
}
var xScale = d3.scale.log()
.domain([1, Math.pow(2, 40)])
.range([0, 480]);
var xAxis = d3.svg.axis()
.scale(xScale)
.orient('left')
.tickFormat(bytesToString)
.tickValues(d3.range(11).map(
function (x) { return Math.pow(2, 4 * x); }
));
你还需要使用自己的数值来替换tickValues
,以使内容更加贴近实际情况。