Skip to content

Commit

Permalink
set context to self for mouse events. bump version
Browse files Browse the repository at this point in the history
  • Loading branch information
@jkanche
jkanche committed Oct 30, 2023
1 parent 9ec2fc1 commit e6dbf50
Show file tree
Hide file tree
Showing 3 changed files with 49 additions and 37 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ridges.js",
"version": "0.0.3",
"version": "0.0.4",
"description": "Create and visualize ridge plots",
"repository": "https://github.com/jkanche/ridges.js",
"homepage": "https://github.com/jkanche/ridges.js#readme",
Expand Down
42 changes: 24 additions & 18 deletions src/HorizontalRidgePlot.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -125,10 +125,10 @@ export class HorizontalRidgePlot extends RidgePlot {
.style("text-anchor", "end")
.each(wrap)
.on("mouseover", (event, d) => {
const idx = this._dkeys.indexOf(d);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;
tip
.style("opacity", 1)
.html(
Expand All @@ -139,11 +139,13 @@ export class HorizontalRidgePlot extends RidgePlot {
)}</span><br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", x(d) + 20 + "px")
.style("top", height + "px");
// .style("left", 100 + "px")
// .style("top", y(d.key) + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
})
.on("click", function (e, d) {
Expand Down Expand Up @@ -259,10 +261,10 @@ export class HorizontalRidgePlot extends RidgePlot {
.curve(d3.curveCatmullRom)(bin.value);
})
.on("mouseover", function (event, d) {
const idx = this._dkeys.indexOf(d.key);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d.key);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;

tip
.style("opacity", 1)
Expand All @@ -274,11 +276,13 @@ export class HorizontalRidgePlot extends RidgePlot {
)}</span><br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", 100 + "px")
.style("top", y(d.key) + "px");
// .style("left", 100 + "px")
// .style("top", y(d.key) + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
});

Expand Down Expand Up @@ -329,10 +333,10 @@ export class HorizontalRidgePlot extends RidgePlot {
})
.style("opacity", 0.5)
.on("mouseover", (event, d) => {
const idx = this._dkeys.indexOf(d[0]);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d[0]);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;

tip
.style("opacity", 1)
Expand All @@ -343,11 +347,13 @@ export class HorizontalRidgePlot extends RidgePlot {
<br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", 100 + "px")
.style("top", y(d[0]) + "px");
// .style("left", 100 + "px")
// .style("top", y(d.key) + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
});

Expand Down
42 changes: 24 additions & 18 deletions src/VerticalRidgePlot.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,10 +113,10 @@ export class VerticalRidgePlot extends RidgePlot {
.style("text-anchor", "end")
.each(wrap)
.on("mouseover", (event, d) => {
const idx = this._dkeys.indexOf(d);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;
tip
.style("opacity", 1)
.html(
Expand All @@ -127,11 +127,13 @@ export class VerticalRidgePlot extends RidgePlot {
)}</span><br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", x(d) + 20 + "px")
.style("top", height + "px");
// .style("left", x(d[0]) + 20 + "px")
// .style("top", height - margin.top - margin.bottom + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
})
.on("click", function (e, d) {
Expand Down Expand Up @@ -244,10 +246,10 @@ export class VerticalRidgePlot extends RidgePlot {
.curve(d3.curveCatmullRom)(bin.value);
})
.on("mouseover", function (event, d) {
const idx = this._dkeys.indexOf(d.key);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d.key);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;

tip
.style("opacity", 1)
Expand All @@ -259,11 +261,13 @@ export class VerticalRidgePlot extends RidgePlot {
)}</span><br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", x(d.key) + 20 + "px")
.style("top", propheight - margin.top - margin.bottom + "px");
// .style("left", x(d[0]) + 20 + "px")
// .style("top", height - margin.top - margin.bottom + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
});

Expand Down Expand Up @@ -314,10 +318,10 @@ export class VerticalRidgePlot extends RidgePlot {
})
.style("opacity", 0.5)
.on("mouseover", (event, d) => {
const idx = this._dkeys.indexOf(d[0]);
const mets = this._dentries[idx][1];
const idx = self._dkeys.indexOf(d[0]);
const mets = self._dentries[idx][1];

this._hoverKey = idx;
self._hoverKey = idx;

tip
.style("opacity", 1)
Expand All @@ -328,11 +332,13 @@ export class VerticalRidgePlot extends RidgePlot {
<br/><span>min: ${mets?.min.toFixed(2)}</span>
<br/><span>max: ${mets?.max.toFixed(2)}</span>`
)
.style("left", x(d[0]) + 20 + "px")
.style("top", propheight - margin.top - margin.bottom + "px");
// .style("left", x(d[0]) + 20 + "px")
// .style("top", height - margin.top - margin.bottom + "px");
.style("left", event.clientX + "px")
.style("top", event.clientY + "px");
})
.on("mouseout", function (event, d) {
this._hoverKey = null;
self._hoverKey = null;
tip.style("opacity", 0);
});

Expand Down

0 comments on commit e6dbf50

Please sign in to comment.