@rinminase/ng-charts
Version:
Reactive, responsive, beautiful charts for Angular based on ng2-charts
72 lines • 10.8 kB
JavaScript
export function monkeyPatchChartJsTooltip() {
if (typeof Chart === "undefined") {
console.log("Chart not defined");
return;
}
Chart.Tooltip.prototype.drawBody = drawBody;
const helpers = Chart.helpers;
function getAlignedX(vm, align) {
return align === "center"
? vm.x + vm.width / 2
: align === "right"
? vm.x + vm.width - vm.xPadding
: vm.x + vm.xPadding;
}
function drawBody(pt, vm, ctx) {
let bodyFontSize = vm.bodyFontSize;
let bodySpacing = vm.bodySpacing;
let bodyAlign = vm._bodyAlign;
let body = vm.body;
let drawColorBoxes = vm.displayColors;
let labelColors = vm.labelColors;
let xLinePadding = 0;
let colorX = drawColorBoxes ? getAlignedX(vm, "left") : 0;
let textColor;
ctx.textAlign = bodyAlign;
ctx.textBaseline = "top";
ctx.font = helpers.fontString(bodyFontSize, vm._bodyFontStyle, vm._bodyFontFamily);
pt.x = getAlignedX(vm, bodyAlign);
// Before Body
let fillLineOfText = function (line) {
ctx.fillText(line, pt.x + xLinePadding, pt.y);
pt.y += bodyFontSize + bodySpacing;
};
// Before body lines
ctx.fillStyle = vm.bodyFontColor;
helpers.each(vm.beforeBody, fillLineOfText);
xLinePadding =
drawColorBoxes && bodyAlign !== "right"
? bodyAlign === "center"
? bodyFontSize / 2 + 1
: bodyFontSize + 2
: 0;
// Draw body lines now
helpers.each(body, function (bodyItem, i) {
textColor = vm.labelTextColors[i];
ctx.fillStyle = textColor;
helpers.each(bodyItem.before, fillLineOfText);
// Draw Legend-like boxes if needed
if (drawColorBoxes) {
// Fill a white rect so that colours merge nicely if the opacity is < 1
ctx.fillStyle = vm.legendColorBackground;
ctx.fillRect(colorX, pt.y, bodyFontSize, bodyFontSize);
// Border
ctx.lineWidth = 1;
ctx.strokeStyle = labelColors[i].borderColor;
ctx.strokeRect(colorX, pt.y, bodyFontSize, bodyFontSize);
// Inner square
ctx.fillStyle = labelColors[i].backgroundColor;
ctx.fillRect(colorX + 1, pt.y + 1, bodyFontSize - 2, bodyFontSize - 2);
ctx.fillStyle = textColor;
}
helpers.each(bodyItem.lines, fillLineOfText);
helpers.each(bodyItem.after, fillLineOfText);
});
// Reset back to 0 for after body
xLinePadding = 0;
// After body lines
helpers.each(vm.afterBody, fillLineOfText);
pt.y -= bodySpacing; // Remove last body spacing
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9ua2V5LXBhdGNoLWNoYXJ0LWpzLXRvb2x0aXAuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL21vbmtleS1wYXRjaC1jaGFydC1qcy10b29sdGlwLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFBLE1BQU0sVUFBVSx5QkFBeUI7SUFDdkMsSUFBSSxPQUFPLEtBQUssS0FBSyxXQUFXLEVBQUU7UUFDaEMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxtQkFBbUIsQ0FBQyxDQUFDO1FBQ2pDLE9BQU87S0FDUjtJQUNELEtBQUssQ0FBQyxPQUFPLENBQUMsU0FBUyxDQUFDLFFBQVEsR0FBRyxRQUFRLENBQUM7SUFDNUMsTUFBTSxPQUFPLEdBQUcsS0FBSyxDQUFDLE9BQU8sQ0FBQztJQUU5QixTQUFTLFdBQVcsQ0FBQyxFQUFFLEVBQUUsS0FBSztRQUM1QixPQUFPLEtBQUssS0FBSyxRQUFRO1lBQ3ZCLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxLQUFLLEdBQUcsQ0FBQztZQUNyQixDQUFDLENBQUMsS0FBSyxLQUFLLE9BQU87Z0JBQ25CLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDLFFBQVE7Z0JBQy9CLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxRQUFRLENBQUM7SUFDekIsQ0FBQztJQUVELFNBQVMsUUFBUSxDQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsR0FBRztRQUMzQixJQUFJLFlBQVksR0FBRyxFQUFFLENBQUMsWUFBWSxDQUFDO1FBQ25DLElBQUksV0FBVyxHQUFHLEVBQUUsQ0FBQyxXQUFXLENBQUM7UUFDakMsSUFBSSxTQUFTLEdBQUcsRUFBRSxDQUFDLFVBQVUsQ0FBQztRQUM5QixJQUFJLElBQUksR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDO1FBQ25CLElBQUksY0FBYyxHQUFHLEVBQUUsQ0FBQyxhQUFhLENBQUM7UUFDdEMsSUFBSSxXQUFXLEdBQUcsRUFBRSxDQUFDLFdBQVcsQ0FBQztRQUNqQyxJQUFJLFlBQVksR0FBRyxDQUFDLENBQUM7UUFDckIsSUFBSSxNQUFNLEdBQUcsY0FBYyxDQUFDLENBQUMsQ0FBQyxXQUFXLENBQUMsRUFBRSxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7UUFDMUQsSUFBSSxTQUFTLENBQUM7UUFFZCxHQUFHLENBQUMsU0FBUyxHQUFHLFNBQVMsQ0FBQztRQUMxQixHQUFHLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FBQztRQUN6QixHQUFHLENBQUMsSUFBSSxHQUFHLE9BQU8sQ0FBQyxVQUFVLENBQzNCLFlBQVksRUFDWixFQUFFLENBQUMsY0FBYyxFQUNqQixFQUFFLENBQUMsZUFBZSxDQUNuQixDQUFDO1FBRUYsRUFBRSxDQUFDLENBQUMsR0FBRyxXQUFXLENBQUMsRUFBRSxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBRWxDLGNBQWM7UUFDZCxJQUFJLGNBQWMsR0FBRyxVQUFVLElBQUk7WUFDakMsR0FBRyxDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDLENBQUMsR0FBRyxZQUFZLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQzlDLEVBQUUsQ0FBQyxDQUFDLElBQUksWUFBWSxHQUFHLFdBQVcsQ0FBQztRQUNyQyxDQUFDLENBQUM7UUFFRixvQkFBb0I7UUFDcEIsR0FBRyxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUMsYUFBYSxDQUFDO1FBQ2pDLE9BQU8sQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLFVBQVUsRUFBRSxjQUFjLENBQUMsQ0FBQztRQUU1QyxZQUFZO1lBQ1YsY0FBYyxJQUFJLFNBQVMsS0FBSyxPQUFPO2dCQUNyQyxDQUFDLENBQUMsU0FBUyxLQUFLLFFBQVE7b0JBQ3RCLENBQUMsQ0FBQyxZQUFZLEdBQUcsQ0FBQyxHQUFHLENBQUM7b0JBQ3RCLENBQUMsQ0FBQyxZQUFZLEdBQUcsQ0FBQztnQkFDcEIsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUVSLHNCQUFzQjtRQUN0QixPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxVQUFVLFFBQVEsRUFBRSxDQUFDO1lBQ3RDLFNBQVMsR0FBRyxFQUFFLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQ2xDLEdBQUcsQ0FBQyxTQUFTLEdBQUcsU0FBUyxDQUFDO1lBQzFCLE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLE1BQU0sRUFBRSxjQUFjLENBQUMsQ0FBQztZQUU5QyxtQ0FBbUM7WUFDbkMsSUFBSSxjQUFjLEVBQUU7Z0JBQ2xCLHVFQUF1RTtnQkFDdkUsR0FBRyxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUMscUJBQXFCLENBQUM7Z0JBQ3pDLEdBQUcsQ0FBQyxRQUFRLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLEVBQUUsWUFBWSxFQUFFLFlBQVksQ0FBQyxDQUFDO2dCQUV2RCxTQUFTO2dCQUNULEdBQUcsQ0FBQyxTQUFTLEdBQUcsQ0FBQyxDQUFDO2dCQUNsQixHQUFHLENBQUMsV0FBVyxHQUFHLFdBQVcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxXQUFXLENBQUM7Z0JBQzdDLEdBQUcsQ0FBQyxVQUFVLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLEVBQUUsWUFBWSxFQUFFLFlBQVksQ0FBQyxDQUFDO2dCQUV6RCxlQUFlO2dCQUNmLEdBQUcsQ0FBQyxTQUFTLEdBQUcsV0FBVyxDQUFDLENBQUMsQ0FBQyxDQUFDLGVBQWUsQ0FBQztnQkFDL0MsR0FBRyxDQUFDLFFBQVEsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxFQUFFLFlBQVksR0FBRyxDQUFDLEVBQUUsWUFBWSxHQUFHLENBQUMsQ0FBQyxDQUFDO2dCQUN2RSxHQUFHLENBQUMsU0FBUyxHQUFHLFNBQVMsQ0FBQzthQUMzQjtZQUVELE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssRUFBRSxjQUFjLENBQUMsQ0FBQztZQUU3QyxPQUFPLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsY0FBYyxDQUFDLENBQUM7UUFDL0MsQ0FBQyxDQUFDLENBQUM7UUFFSCxpQ0FBaUM7UUFDakMsWUFBWSxHQUFHLENBQUMsQ0FBQztRQUVqQixtQkFBbUI7UUFDbkIsT0FBTyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsU0FBUyxFQUFFLGNBQWMsQ0FBQyxDQUFDO1FBQzNDLEVBQUUsQ0FBQyxDQUFDLElBQUksV0FBVyxDQUFDLENBQUMsMkJBQTJCO0lBQ2xELENBQUM7QUFDSCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZGVjbGFyZSBjbGFzcyBDaGFydCB7XG4gIHN0YXRpYyByZWFkb25seSBDaGFydDogdHlwZW9mIENoYXJ0O1xuICBzdGF0aWMgcmVhZG9ubHkgVG9vbHRpcDogYW55O1xuICBzdGF0aWMgcmVhZG9ubHkgaGVscGVyczogYW55O1xuICBzdGF0aWMgcmVhZG9ubHkgZGVmYXVsdHM6IGFueTtcbiAgc3RhdGljIHJlYWRvbmx5IHBsdWdpbnM6IGFueTtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIG1vbmtleVBhdGNoQ2hhcnRKc1Rvb2x0aXAoKSB7XG4gIGlmICh0eXBlb2YgQ2hhcnQgPT09IFwidW5kZWZpbmVkXCIpIHtcbiAgICBjb25zb2xlLmxvZyhcIkNoYXJ0IG5vdCBkZWZpbmVkXCIpO1xuICAgIHJldHVybjtcbiAgfVxuICBDaGFydC5Ub29sdGlwLnByb3RvdHlwZS5kcmF3Qm9keSA9IGRyYXdCb2R5O1xuICBjb25zdCBoZWxwZXJzID0gQ2hhcnQuaGVscGVycztcblxuICBmdW5jdGlvbiBnZXRBbGlnbmVkWCh2bSwgYWxpZ24pIHtcbiAgICByZXR1cm4gYWxpZ24gPT09IFwiY2VudGVyXCJcbiAgICAgID8gdm0ueCArIHZtLndpZHRoIC8gMlxuICAgICAgOiBhbGlnbiA9PT0gXCJyaWdodFwiXG4gICAgICA/IHZtLnggKyB2bS53aWR0aCAtIHZtLnhQYWRkaW5nXG4gICAgICA6IHZtLnggKyB2bS54UGFkZGluZztcbiAgfVxuXG4gIGZ1bmN0aW9uIGRyYXdCb2R5KHB0LCB2bSwgY3R4KSB7XG4gICAgbGV0IGJvZHlGb250U2l6ZSA9IHZtLmJvZHlGb250U2l6ZTtcbiAgICBsZXQgYm9keVNwYWNpbmcgPSB2bS5ib2R5U3BhY2luZztcbiAgICBsZXQgYm9keUFsaWduID0gdm0uX2JvZHlBbGlnbjtcbiAgICBsZXQgYm9keSA9IHZtLmJvZHk7XG4gICAgbGV0IGRyYXdDb2xvckJveGVzID0gdm0uZGlzcGxheUNvbG9ycztcbiAgICBsZXQgbGFiZWxDb2xvcnMgPSB2bS5sYWJlbENvbG9ycztcbiAgICBsZXQgeExpbmVQYWRkaW5nID0gMDtcbiAgICBsZXQgY29sb3JYID0gZHJhd0NvbG9yQm94ZXMgPyBnZXRBbGlnbmVkWCh2bSwgXCJsZWZ0XCIpIDogMDtcbiAgICBsZXQgdGV4dENvbG9yO1xuXG4gICAgY3R4LnRleHRBbGlnbiA9IGJvZHlBbGlnbjtcbiAgICBjdHgudGV4dEJhc2VsaW5lID0gXCJ0b3BcIjtcbiAgICBjdHguZm9udCA9IGhlbHBlcnMuZm9udFN0cmluZyhcbiAgICAgIGJvZHlGb250U2l6ZSxcbiAgICAgIHZtLl9ib2R5Rm9udFN0eWxlLFxuICAgICAgdm0uX2JvZHlGb250RmFtaWx5XG4gICAgKTtcblxuICAgIHB0LnggPSBnZXRBbGlnbmVkWCh2bSwgYm9keUFsaWduKTtcblxuICAgIC8vIEJlZm9yZSBCb2R5XG4gICAgbGV0IGZpbGxMaW5lT2ZUZXh0ID0gZnVuY3Rpb24gKGxpbmUpIHtcbiAgICAgIGN0eC5maWxsVGV4dChsaW5lLCBwdC54ICsgeExpbmVQYWRkaW5nLCBwdC55KTtcbiAgICAgIHB0LnkgKz0gYm9keUZvbnRTaXplICsgYm9keVNwYWNpbmc7XG4gICAgfTtcblxuICAgIC8vIEJlZm9yZSBib2R5IGxpbmVzXG4gICAgY3R4LmZpbGxTdHlsZSA9IHZtLmJvZHlGb250Q29sb3I7XG4gICAgaGVscGVycy5lYWNoKHZtLmJlZm9yZUJvZHksIGZpbGxMaW5lT2ZUZXh0KTtcblxuICAgIHhMaW5lUGFkZGluZyA9XG4gICAgICBkcmF3Q29sb3JCb3hlcyAmJiBib2R5QWxpZ24gIT09IFwicmlnaHRcIlxuICAgICAgICA/IGJvZHlBbGlnbiA9PT0gXCJjZW50ZXJcIlxuICAgICAgICAgID8gYm9keUZvbnRTaXplIC8gMiArIDFcbiAgICAgICAgICA6IGJvZHlGb250U2l6ZSArIDJcbiAgICAgICAgOiAwO1xuXG4gICAgLy8gRHJhdyBib2R5IGxpbmVzIG5vd1xuICAgIGhlbHBlcnMuZWFjaChib2R5LCBmdW5jdGlvbiAoYm9keUl0ZW0sIGkpIHtcbiAgICAgIHRleHRDb2xvciA9IHZtLmxhYmVsVGV4dENvbG9yc1tpXTtcbiAgICAgIGN0eC5maWxsU3R5bGUgPSB0ZXh0Q29sb3I7XG4gICAgICBoZWxwZXJzLmVhY2goYm9keUl0ZW0uYmVmb3JlLCBmaWxsTGluZU9mVGV4dCk7XG5cbiAgICAgIC8vIERyYXcgTGVnZW5kLWxpa2UgYm94ZXMgaWYgbmVlZGVkXG4gICAgICBpZiAoZHJhd0NvbG9yQm94ZXMpIHtcbiAgICAgICAgLy8gRmlsbCBhIHdoaXRlIHJlY3Qgc28gdGhhdCBjb2xvdXJzIG1lcmdlIG5pY2VseSBpZiB0aGUgb3BhY2l0eSBpcyA8IDFcbiAgICAgICAgY3R4LmZpbGxTdHlsZSA9IHZtLmxlZ2VuZENvbG9yQmFja2dyb3VuZDtcbiAgICAgICAgY3R4LmZpbGxSZWN0KGNvbG9yWCwgcHQueSwgYm9keUZvbnRTaXplLCBib2R5Rm9udFNpemUpO1xuXG4gICAgICAgIC8vIEJvcmRlclxuICAgICAgICBjdHgubGluZVdpZHRoID0gMTtcbiAgICAgICAgY3R4LnN0cm9rZVN0eWxlID0gbGFiZWxDb2xvcnNbaV0uYm9yZGVyQ29sb3I7XG4gICAgICAgIGN0eC5zdHJva2VSZWN0KGNvbG9yWCwgcHQueSwgYm9keUZvbnRTaXplLCBib2R5Rm9udFNpemUpO1xuXG4gICAgICAgIC8vIElubmVyIHNxdWFyZVxuICAgICAgICBjdHguZmlsbFN0eWxlID0gbGFiZWxDb2xvcnNbaV0uYmFja2dyb3VuZENvbG9yO1xuICAgICAgICBjdHguZmlsbFJlY3QoY29sb3JYICsgMSwgcHQueSArIDEsIGJvZHlGb250U2l6ZSAtIDIsIGJvZHlGb250U2l6ZSAtIDIpO1xuICAgICAgICBjdHguZmlsbFN0eWxlID0gdGV4dENvbG9yO1xuICAgICAgfVxuXG4gICAgICBoZWxwZXJzLmVhY2goYm9keUl0ZW0ubGluZXMsIGZpbGxMaW5lT2ZUZXh0KTtcblxuICAgICAgaGVscGVycy5lYWNoKGJvZHlJdGVtLmFmdGVyLCBmaWxsTGluZU9mVGV4dCk7XG4gICAgfSk7XG5cbiAgICAvLyBSZXNldCBiYWNrIHRvIDAgZm9yIGFmdGVyIGJvZHlcbiAgICB4TGluZVBhZGRpbmcgPSAwO1xuXG4gICAgLy8gQWZ0ZXIgYm9keSBsaW5lc1xuICAgIGhlbHBlcnMuZWFjaCh2bS5hZnRlckJvZHksIGZpbGxMaW5lT2ZUZXh0KTtcbiAgICBwdC55IC09IGJvZHlTcGFjaW5nOyAvLyBSZW1vdmUgbGFzdCBib2R5IHNwYWNpbmdcbiAgfVxufVxuIl19