Javascript 如何在组合堆叠条形图上设置pointDot选项
我正在尝试实现一个既有堆叠条形图又有多个折线图的图表。我一辈子都不知道如何隐藏折线图上的点。我尝试过在Chart.defaults、数据集和选项中设置它,但没有成功。我认为这与这样一个事实有关:为了制作组合条形图/折线图,您将图表定义为类型bar,这使得pointDot参数没有任何意义。有什么想法吗Javascript 如何在组合堆叠条形图上设置pointDot选项,javascript,charts,bar-chart,chart.js,Javascript,Charts,Bar Chart,Chart.js,我正在尝试实现一个既有堆叠条形图又有多个折线图的图表。我一辈子都不知道如何隐藏折线图上的点。我尝试过在Chart.defaults、数据集和选项中设置它,但没有成功。我认为这与这样一个事实有关:为了制作组合条形图/折线图,您将图表定义为类型bar,这使得pointDot参数没有任何意义。有什么想法吗 var ytdData = { labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct',
var ytdData = {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
datasets: [
{
type: 'bar',
label: 'Sales',
backgroundColor: 'green',
data: sales,
borderColor: 'white'
},
{
type: 'bar',
label: 'Additional URL',
backgroundColor: 'red',
data: addtlUrl,
borderColor: 'white'
},
{
type: 'bar',
label: 'Recurring Services',
backgroundColor: 'orange',
data: addtlSvcs,
borderColor: 'white'
},
{
type: 'bar',
label: 'Install Base',
backgroundColor: 'blue',
data: installBase,
borderColor: 'white'
},
{
type: 'bar',
label: 'Double Comp',
backgroundColor: 'purple',
data: doubleComp,
borderColor: 'white'
},
{
type: 'line',
label: 'Quota',
fill: false,
data: baseQuota,
borderColor: '#C1C1C1',
strokeColor: "rgba(151,187,205,0)",
pointColor: "rgba(0,0,0,0)"
},
{
type: 'line',
label: 'Minimum MRR',
fill: false,
borderDash: [5, 5],
data: [42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000]
}
]
};
Chart.defaults.line.pointDot = false;
var stackedChart = new Chart($("#ytdChart").get(0).getContext("2d"), {
type: 'bar',
data: ytdData,
options: {
legend: {
position: 'bottom'
},
tooltips: {
mode: 'label'
},
responsive: true,
scales: {
xAxes: [{
stacked: true,
ticks: {
beginAtZero: true
}
}],
yAxes: [{
stacked: false,
ticks: {
suggestedMax: 5,
beginAtZero: true,
callback: function(value) {
return Number(value).toFixed(0);
}
}
}]
}
}
});
只需将线数据集的
pointRadius
设置为0
,如下所示
{
type: 'line',
pointRadius: 0,
...
Fiddle-顺便说一下,这是在使用Chart.js-2.0.0