Unfortunately after going through a day looking for an answer on this issue, I'm not able to find it anywhere. Would appreciate if someone could help me out here:
I would like to obtain the point value of what the user clicks. So, for example in the image below, when the user click as shown, I want to get the value being 'ra_user3'. I'm currently getting ra_user1 which is not correct. I'm getting the correct clickedDate though.
`// LINE QaqcRA_CHART qaqc
var QaqcRA_user_color = '["#2E6A2C","#CF55D3","#2C5426"]';
var QaqcRA_user_label = '["ra_user1","ra_user2","ra_user3"]';
var line = new Morris.Line({
element: 'QaqcRA_charts',
resize: true,
data: '[{"ra_updated_on":"18 May 2020","ra_user1":"7","ra_user2":"9","ra_user3":"6"},{"ra_updated_on":"19 May 2020","ra_user1":"3","ra_user2":"6","ra_user3":"4"},{"ra_updated_on":"20 May 2020","ra_user1":"0","ra_user2":"15","ra_user3":"9"},{"ra_updated_on":"21 May 2020","ra_user1":"8","ra_user2":"7","ra_user3":"8"},{"ra_updated_on":"22 May 2020","ra_user1":"8","ra_user2":"9","ra_user3":"7"}]',
parseTime: false,
xkey: 'ra_updated_on',
xLabels: 'Inspection Date',
xLabelAngle: 45,
hideHover: 'false',
ykeys: QaqcRA_user_label,
labels: QaqcRA_user_label,
lineColors: QaqcRA_user_color,
hoverCallback: function(index, options, content, row) {
var a = evt.target;
var target_result = JSON.stringify(a);
console.log("target_result: " + target_result); // target_result: {"raphael":true,"raphaelid":139}
var clickedDate = $(".morris-hover-row-label").html().trim();
var clickedPoint = $(".morris-hover-point").html().trim();
var comp = clickedPoint.split(":");
var clickedUser = comp[0];
Unfortunately after going through a day looking for an answer on this issue, I'm not able to find it anywhere. Would appreciate if someone could help me out here:
I would like to obtain the point value of what the user clicks. So, for example in the image below, when the user click as shown, I want to get the value being 'ra_user3'. I'm currently getting ra_user1 which is not correct. I'm getting the correct clickedDate though.
`// LINE QaqcRA_CHART qaqc var QaqcRA_user_color = '["#2E6A2C","#CF55D3","#2C5426"]'; var QaqcRA_user_label = '["ra_user1","ra_user2","ra_user3"]';
var line = new Morris.Line({ element: 'QaqcRA_charts', resize: true, data: '[{"ra_updated_on":"18 May 2020","ra_user1":"7","ra_user2":"9","ra_user3":"6"},{"ra_updated_on":"19 May 2020","ra_user1":"3","ra_user2":"6","ra_user3":"4"},{"ra_updated_on":"20 May 2020","ra_user1":"0","ra_user2":"15","ra_user3":"9"},{"ra_updated_on":"21 May 2020","ra_user1":"8","ra_user2":"7","ra_user3":"8"},{"ra_updated_on":"22 May 2020","ra_user1":"8","ra_user2":"9","ra_user3":"7"}]', parseTime: false, xkey: 'ra_updated_on', xLabels: 'Inspection Date', xLabelAngle: 45, hideHover: 'false', ykeys: QaqcRA_user_label, labels: QaqcRA_user_label, lineColors: QaqcRA_user_color, hoverCallback: function(index, options, content, row) {
} });
$("#QaqcRA_charts svg").on('click', function(evt) {
var a = evt.target; var target_result = JSON.stringify(a); console.log("target_result: " + target_result); // target_result: {"raphael":true,"raphaelid":139}
var clickedDate = $(".morris-hover-row-label").html().trim(); var clickedPoint = $(".morris-hover-point").html().trim(); var comp = clickedPoint.split(":"); var clickedUser = comp[0];
console.log("clickedDate: " + clickedDate); // clickedDate: 20 May 2020 console.log("clickedUser: " + clickedUser); // clickedUser: ra_user1
});`