我正与HighCharts合作制作条形图。我的值可以从最小0到最高100k(示例)。因此,图形的一条可以非常小而另一条可以非常长。 HighCharts引入了“对数缩放”功能。可以看到 HERE
的示例我的js代码是用这个jsfiddle文件编写的。我想以对数方式显示我的水平轴(x轴)。我已插入键类型,如示例所示,但脚本进入无限循环,必须停止。
执行中的缺陷是什么,或者HighCharts的对数缩放仍然不成熟?
P.S jsfiddle中的注释行导致问题
答案 0 :(得分:7)
由于“官方”方法仍然存在问题,因此您可以通过使用基本10日志操作输入数据并屏蔽输出数据,将输出数据提高10到输出值,从而更加手动地实现日志比例。请在下面的http://jsfiddle.net/7J6sc/代码中查看此操作。
function log10(n) {
return Math.log(n)/Math.log(10);
}
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
defaultSeriesType: 'bar',
marginRight: 200,
marginLeft: 10,
},
title: {
text: 'Negative'
},
xAxis: {
categories: [''],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: '',
align: 'high',
},
labels: {
formatter: function() {
return Math.round(Math.pow(10,this.value));
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -50,
y: 100,
floating: true,
borderWidth: 1,
shadow: true
},
tooltip: {
formatter: function() {
return '' + this.series.name + ': ' + Math.round(Math.pow(10,this.y)) + ' millions';
}
},
plotOptions: {
bar: {
dataLabels: {
enabled: true,
formatter: function() {
return Math.round(Math.pow(10,this.y));
}
}
}
},
credits: {
enabled: false
},
series: [{
"data": [log10(4396)],
"name": "A"},
{
"data": [log10(4940)],
"name": "B"},
{
"data": [log10(4440)],
"name": "C"},
{
"data": [log10(2700)],
"name": "D"},
{
"data": [log10(2400)],
"name": "E"},
{
"data": [log10(6000)],
"name": "F"},
{
"data": [log10(3000)],
"name": "G"},
{
"data": [log10(15000)],
"name": "E"}],
});
答案 1 :(得分:2)
根据Official Documentation,它仍然是实验性的,所以可能就是这样:
“轴的类型。可以是”线性“或”日期时间“之一。在日期时间轴中,数字以毫秒为单位,刻度标记放在适当的值上,如完整小时或天。
从2.1.6开始,添加“对数”作为实验性功能,但尚未完全实现。默认为“线性”。
尝试:“线性”,“日期时间”,定期间隔,“日期时间”,不规则间隔,实验性“对数”轴。“