GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 22:12:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Fix up histogram code to correctly hide tooltip again

Browse source
This commit is contained in:
Henrik Giesel 2021-01-08 14:22:20 +01:00
parent 740dcedbe6
commit fd58f73f13
2 changed files with 16 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ts/graphs/graphs.scss
View file

@ -197,3 +197,7 @@
.no-focus-outline:focus { .no-focus-outline:focus {
outline: 0; outline: 0;
} }
.clickable {
cursor: pointer;
}

27
ts/graphs/histogram-graph.ts
View file

@ -136,7 +136,7 @@ export function histogramGraph(
"d", "d",
area() area()
.curve(curveBasis) .curve(curveBasis)
.x((d, idx) => { .x((_d, idx) => {
if (idx === 0) { if (idx === 0) {
return x(data.bins[0].x0!)!; return x(data.bins[0].x0!)!;
} else { } else {
@ -149,7 +149,7 @@ export function histogramGraph(
} }
// hover/tooltip // hover/tooltip
svg.select("g.hoverzone") const hoverzone = svg.select("g.hoverzone")
.selectAll("rect") .selectAll("rect")
.data(data.bins) .data(data.bins)
.join("rect") .join("rect")
@ -157,21 +157,18 @@ export function histogramGraph(
.attr("y", () => y(yMax!)!) .attr("y", () => y(yMax!)!)
.attr("width", barWidth) .attr("width", barWidth)
.attr("height", () => y(0)! - y(yMax!)!) .attr("height", () => y(0)! - y(yMax!)!)
.on("mouseover", function (this: any) { .on("mousemove", function (this: any, _d: any, idx: number) {
this.style = "cursor: pointer;";
})
.on("mousemove", function (this: any, d: any, idx) {
const [x, y] = mouse(document.body); const [x, y] = mouse(document.body);
const pct = data.showArea ? (areaData[idx + 1] / data.total) * 100 : 0; const pct = data.showArea ? (areaData[idx + 1] / data.total) * 100 : 0;
showTooltip(data.hoverText(data, idx, areaData[idx + 1], pct), x, y); showTooltip(data.hoverText(data, idx, areaData[idx + 1], pct), x, y);
}) })
.on("mouseout", function (this: any) { .on("mouseout", hideTooltip);
hideTooltip;
this.style = ""; if (data.makeQuery) {
}) hoverzone
.on('click', function(this: any, d: any, idx: number) { .attr("class", "clickable")
console.log('clicked', this) .on("click", function (this: any, _d: any, idx: number) {
if (!data.makeQuery) { return } dispatch("search", { query: data.makeQuery!(data, idx) })
dispatch("search", { query: data.makeQuery(data, idx) }) });
}); }
} }