chart.js中的自定义工具提示

时间:2016-07-26 19:01:04

标签: html5 tooltip chart.js

在下面的代码中我需要工具提示如下概率:40受众:5000 即在工具提示中我需要带有xAxes值的xAxes labelstring和带yAxes值的yAxes labelstring。如何实现这一点请帮助

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
type: 'line',
data: {
    datasets: [{
        label: 'Audience',
        data: [{x:12,y:9000}, {x:30, y:6000}, {x:40, y:5000},{x:52,y:4000},{x:70,y:3000},{x:92,y:2000}],
        backgroundColor: 'rgba(255, 99, 132, 0.2)',

        borderColor: 'rgba(255, 159, 64, 1)',
        borderWidth: 1
    }]
},
options: {
 tooltips:
{
callbacks: 
{
label: function(tooltipItem, data) {return  data.datasets[tooltipItem.datasetIndex].label+':'+ tooltipItem.yLabel;
}
}
},
    scales: {
    xAxes: [{
    type: 'linear',position: 'bottom',
        scaleLabel:{labelString:"Probability",display:true},
            ticks: {
                 beginAtZero:true,
                max:100
            }
        }],
        yAxes: [{
        scaleLabel:{labelString:"Audience",display:true},
            ticks: {
                min: 1000
            }
        }]
    }
}
});  

1 个答案:

答案 0 :(得分:0)

只需替换你的"回调"阻止这一个:

        callbacks: 
        {
            title: function() {
                return '';
            },
            beforeLabel: function(tooltipItem, data) {
                return 'Probability: ' + tooltipItem.xLabel + '%';
            },
            label: function(tooltipItem, data) {
                return data.datasets[tooltipItem.datasetIndex].label+': '+ tooltipItem.yLabel;
            }

        }
相关问题