Line Chart - Set data to the existing current point label in Line-chart


Line Chart - Set data to the existing current point label in Line-chart



So I have a line-chart diagram that consists of four lines with data, on the xAxes I have a set of dates that is from the current date up to 180 days back that I've set dynamically with JavaScript.
What I really have to do is take the certain data from the database which I'm doing with the symfony and set it to the
Line-chart lines so far everything is easy.



So the problem is that this data I should take together with
the dates of which are created from the database and set it them to the relevant dates in the Line-chart.So my question is
how to set the current data to the relevant dates in line-chart.P.S I can't set the date from database as lables directly becuase not all
of this period of 180 days has created data in database and for that I should set the dates dinamicaly with javascript and check if on current date on Line-cahrt has created data from database or not and if it have to set it?



So this is the code from the controller which return the current data:


// get all sent letters from current reseller
$sql = "select count(Distinct d.id) as letter from document d left join printjob pj on pj.id = d.printjob_id join partner on partner.id = d.partner_id where pj.sent_at is not null and d.error_at is null and d.deleted_at is null and pj.error_at is null and d.customer_id = :customer_id and d.partner_id = :partner_id and pj.sent_at BETWEEN DATE_SUB(DATE(NOW()), INTERVAL 180 DAY) AND DATE(NOW()) GROUP BY pj.sent_at";
$stmt = $em->getConnection()->prepare($sql);
$stmt->bindValue("customer_id", $this->getUser()->getCustomer()->getId());
$stmt->bindValue("partner_id", $this->getUser()->getPartner()->getId());
$stmt->execute();
$result = $stmt->fetchAll();
$status['sentLetterByReseller'] = $result[0]['letter'];

// get all sent letters from current sub-reseller
$sql = "select count(Distinct d.id) as letter from document d left join printjob pj on pj.id = d.printjob_id join partner on partner.parent_partner_id = d.partner_id where pj.sent_at is not null and d.error_at is null and d.deleted_at is null and pj.error_at is null and d.customer_id = :customer_id and d.partner_id = :partner_id and pj.sent_at BETWEEN DATE_SUB(DATE(NOW()), INTERVAL 180 DAY) AND DATE(NOW()) GROUP BY pj.sent_at";
$stmt = $em->getConnection()->prepare($sql);
$stmt->bindValue('customer_id', $this->getUser()->getCustomer()->getId());
$stmt->bindValue("partner_id", $this->getUser()->getPartner()->getId());
$stmt->execute();
$result = $stmt->fetchAll();
$status['sentLetterBySubReseller'] = $result[0]['letter'];

// get all sent pages from current reseller
$sql = "select sum(COALESCE(numpages,0)) as pages from document d left join printjob pj on pj.id = d.printjob_id join partner on partner.id = d.partner_id where pj.sent_at is not null and d.error_at is null and d.deleted_at is null and pj.error_at is null and d.customer_id = :customer_id and d.partner_id = :partner_id and pj.sent_at BETWEEN DATE_SUB(DATE(NOW()), INTERVAL 180 DAY) AND DATE(NOW()) GROUP BY pj.sent_at";
$stmt = $em->getConnection()->prepare($sql);
$stmt->bindValue('customer_id', $this->getUser()->getCustomer()->getId());
$stmt->bindValue("partner_id", $this->getUser()->getPartner()->getId());
$stmt->execute();
$result = $stmt->fetchAll();
$status['sentPagesByReseller'] = $result[0]['pages'];

// get all sent pages from sub-reseller
$sql = "select sum(COALESCE(numpages,0)) as pages from document d left join printjob pj on pj.id = d.printjob_id join partner on partner.parent_partner_id = d.partner_id where pj.sent_at is not null and d.error_at is null and d.deleted_at is null and pj.error_at is null and d.customer_id = :customer_id and d.partner_id = :partner_id and pj.sent_at BETWEEN DATE_SUB(DATE(NOW()), INTERVAL 180 DAY) AND DATE(NOW()) GROUP BY date(pj.sent_at)";
$stmt = $em->getConnection()->prepare($sql);
$stmt->bindValue('customer_id', $this->getUser()->getCustomer()->getId());
$stmt->bindValue("partner_id", $this->getUser()->getPartner()->getId());
$stmt->execute();
$result = $stmt->fetchAll();
$status['sentPagesBySubReseller'] = $result[0]['pages'];



This is the code from line-chart:


let start = moment();
let end = moment().subtract(180 , 'd');
let arrLableDates = ;
let lastDay = moment().toISOString().slice(0,10);

let tmp = end.clone().day(1);

if( tmp.isAfter(start, 'd') ){
arrLableDates.push(tmp.format('YYYY-MM-DD'));
}
while( tmp.isBefore(start) ){
tmp.add(1, 'days');
arrLableDates.push(tmp.format('YYYY-MM-DD'));
}

arrLableDates.push(lastDay);

// LIne chart production volume diagram
var ctx = document.getElementById("Production-volume-chart");
ctx.height = 350;
var chart = new Chart(ctx, {
type: 'line',
responsive: true,
data:
{
labels: arrLableDates,
datasets: [{
label: "Sent letters by reseller",
backgroundColor: 'rgb(255, 99, 132)',
data: status.sentLetterByReseller ,
fill: false
}
,{
data: status.sentLetterBySubReseller,
label: "sent letters by sub-reseller",
borderColor: "#8e5ea2",
fill: false
}, {
data: status.sentPagesByReseller,
label: "Sent pages by reseller",
borderColor: "#e8c3b9",
fill: false
}, {
data: [enter image description here][1]status.sentPagesBySubReseller,
label: "Sent pages by sub-reseller",
borderColor: "#c45850",
fill: false
}
]
},

// Configuration options go here
options: {
elements: { point: { radius: 0 } },
maintainAspectRatio: false,
scales: {
xAxes: [{
ticks: {
// minRotation: 90,
autoSkip: true,
maxTicksLimit: 15,
beginAtZero:true
}
}],
yAxes: [{
ticks: {
beginAtZero:true
}
}],
}
}
});



This is an example of how the chart should looks like



Line-chart



I will be glad if someone has a suggestion how to solve this problem.



Best regards Georgi!









By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

List of Kim Possible characters

Audio Livestreaming with Python & Flask

NSwag: Generate C# Client from multiple Versions of an API