-2
我已经创建了一个水平棒图与对数x轴:为Chart.js中的浮动水平条形图定义y起点?
var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
type: 'horizontalBar',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [1000000000, 100000000, 10000000, 1000000, 100000, 1000],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
xAxes: [{
type: 'logarithmic',
position: 'bottom',
ticks: {
userCallback: function(tick) {
var remain = tick/(Math.pow(10, Math.floor(Chart.helpers.log10(tick))));
if (remain === 1 || remain === 5) {
var test = tick.toString();
if(test >= 1000 && test < 1000000){
return tick/1000 + "kHz";
}else if(test >= 1000000 && test < 1000000000){
return tick/1000000 + "MHz";
}else if(test >= 1000000000){
return tick/1000000000 + "GHz";
}else {
return tick.toString() + "Hz";
}
}
return '';
},
},
scaleLabel: {
labelString: 'Frequency',
display: true,
}
}]
}
}
});
但我不能似乎能够定义的起始点,所有的柱状图起源位于y-0。
我想知道是否有可能使用Charts.js,如果是这样,如何,因为我似乎无法在他们的文档或他们的git中找到任何关于它的东西,谷歌搜索没有也有帮助。
Here is what I have right now.
Here is what I would like to have.
我似乎无法为您找到可能的解决方案,因为条形图所需的数据只是数组。如果这可以允许一个起点值,那么也许,但似乎并非如此。多轴条形图可能对您有所帮助。 –
我发现了一个似乎更容易的解决方法,但感谢您的建议,多轴也可以工作。 – Aardi
我确实看到了堆叠图表选项,但我不确定您可以为每个小节添加不同的颜色。这就是为什么我建议多轴选项。 –