Add tooltip and create hugo shortcode
This commit is contained in:
parent
7b9b9bdcd3
commit
2c1f8b45b3
4 changed files with 64 additions and 11 deletions
|
|
@ -79,7 +79,28 @@ export function render(weeks, counts) {
|
|||
|
||||
svg.appendChild(rect);
|
||||
});
|
||||
});
|
||||
return svg;
|
||||
}
|
||||
|
||||
document.getElementById("heatmap").appendChild(svg);
|
||||
export function setupTooltips(svg) {
|
||||
const tooltip = document.getElementById("tooltip");
|
||||
|
||||
svg.addEventListener("mouseover", (e) => {
|
||||
if (e.target.tagName != "rect") return;
|
||||
const date = e.target.dataset.date;
|
||||
const count = e.target.dataset.count;
|
||||
|
||||
tooltip.textContent = `${date} - ${count} commit${count == 1 ? "" : "s"}`;
|
||||
tooltip.classList.remove("hidden");
|
||||
});
|
||||
|
||||
svg.addEventListener("mousemove", (e) => {
|
||||
tooltip.style.left = e.pageX + 12 + "px";
|
||||
tooltip.style.top = e.pageY - 28 + "px";
|
||||
});
|
||||
|
||||
svg.addEventListener("mouseout", (e) => {
|
||||
if (e.target.tagName === "rect") tooltip.classList.add("hidden");
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue