feature: Added legend in pie chart

pull/8/head
Sami Mokaddem 2017-11-17 16:12:56 +01:00
parent afef7ed420
commit 85aee0dd9a
2 changed files with 44 additions and 1 deletions

View File

@ -2,8 +2,24 @@ var punchcardWidget;
var pieOrgWidget; var pieOrgWidget;
var pieApiWidget; var pieApiWidget;
var overtimeWidget; var overtimeWidget;
var div_day; var div_day;
function legendFormatter(label, series) {
// removing unwanted "
var label = label.replace(/\\"/g, "").replace(/\"/g, "");
// limiting size
if (label.length >= 50){
labelLimited = label.substring(0, 50) + '[...]';
} else {
labelLimited = label;
}
return '<div '
+ 'style="font-size:8pt;text-align:inherit;padding:2px;">'
+ '<a class="tagElem" style="background-color: white; color: black;"> ' + labelLimited
+ '</a>';
+ '</div>';
}
function highlight_punchDay() { function highlight_punchDay() {
if (!(div_day === undefined)) { if (!(div_day === undefined)) {
div_day.removeClass('highlightDay'); div_day.removeClass('highlightDay');
@ -55,6 +71,18 @@ function updateDatePieOrg() {
innerRadius: 0.5, innerRadius: 0.5,
show: true show: true
} }
},
grid: {
hoverable: true
}
});
$('#pieOrg').bind("plothover", function (event, pos, item) {
if (item) {
$("#tooltip").html(legendFormatter(item.series.label))
.css({top: pos.pageY+5, left: pos.pageX+5})
.fadeIn(200);
} else {
$("#tooltip").hide();
} }
}); });
} }
@ -163,4 +191,9 @@ $(document).ready(function () {
updateDatePieApi(); updateDatePieApi();
updateDateOvertime(); updateDateOvertime();
$("<div id='tooltip'></div>").css({
position: "absolute",
display: "none",
}).appendTo("body");
}); });

View File

@ -48,6 +48,16 @@
box-shadow: black 0px 0px 2px; box-shadow: black 0px 0px 2px;
} }
.tagElem {
display: inline-block;
padding: 2px 4px;
font-size: 12px;
font-weight: bold;
line-height: 14px;
border-radius: 3px;
box-shadow: 3px 3px 3px #888888;
}
.panel { .panel {
margin-bottom: 10px; margin-bottom: 10px;
} }