in the above image i will not able to show the datalabels on my dots where tooltips are shown instead of tooltips i want only values shown there and my code is in this i will not get any idea for how to show datalabels on my line chart dots.this is my script by which i make the line chart accordingly to the database values.
$('canvas.LineChart').each(function(cnvindx, cnvobj) {
var proc_id = $(cnvobj).data('proc_id');
var dcharry = [];
var labelChartArr = [];
var ctxs = cnvobj;
var dataChart = {
datasets: [],
labels: []
};
var optionsChart = {
title: {
display: true,
text: "Offered Call's Hourly",
position: 'top'
},
legend: {
display: true,
position:'top',
align:'start',
},
tooltips: {
enabled: false
},
plugins: {
datalabels: {
anchor: 'end',
align: 'end',
labels: {
value: {
color: 'blue'
}
}
}
}
};
var myLineChart = new Chart(ctxs, {
type: 'line',
data: dataChart,
options: optionsChart
});
myLineChart.data.datasets[0] = { };
myLineChart.data.labels = [];
myLineChart.update();
if(msg.myLineChart != undefined) {
myLineChart.data.datasets[0].data = [];
myLineChart.data.datasets[0].label = ["Offered Call's"];
myLineChart.data.datasets[0].fill = [false];
myLineChart.data.datasets[0].borderColor = [Offered_Call_COLOR];
myLineChart.data.datasets[0].backgroundColor = [];
$.each(msg.multiplebarchart, function(indx, hourData) {
//setting line data
myLineChart.data.datasets[0].data.push(hourData['Offered_Call']);
//setting X axis label
myLineChart.data.labels.push(hourData['HOUR1']);
//setting background color
myLineChart.data.datasets[0].backgroundColor.push(Offered_Call_COLOR);
});
myLineChart.update();
myLineChart.render({
duration: 500,
lazy: false,
});
}
});