有没有办法在Billboard.js中以对数刻度显示Y轴?

时间:2019-07-01 17:13:58

标签: billboard.js

我正在尝试以对数刻度显示数据,以确保当存在较大的值时可以看到较小的值。在Billboard.js中有办法做到这一点吗?如果您可以根据数据自动在线性和对数刻度之间切换,那将是很好的。谢谢。

1 个答案:

答案 0 :(得分:0)

没有对数刻度的选项,但是您可以按原样可视化。
查看以下示例。

var chart = bb.generate({
	data: {
		columns: [
			["data1", 1, 10, 20, 30, 40]
		]
	},
	clipPath: false,
	axis: {
		y: {
			min: 1,
			tick: {
				values: [1, 10, 20, 30, 40, 50],
				format: function(x) {
					var value = x > 1 ? Math.pow(10, x/10) : x;

					return Number(value.toFixed(2));
				}
			},
			padding: {
				bottom: 0
			}
		}
	}
});
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/billboard.js/dist/billboard.css" />
  <script src="https://cdn.jsdelivr.net/npm/billboard.js/dist/billboard.pkgd.min.js"></script>
  <title>billboar.js - log scale</title>
</head>
<body>
  <div id="chart"></div>
</body>
</html>