diff --git a/src/marks/tip.js b/src/marks/tip.js
index 89a0d808ad..a23bedb994 100644
--- a/src/marks/tip.js
+++ b/src/marks/tip.js
@@ -281,19 +281,19 @@ function getTextTranslate(anchor, m, r, width, height) {
case "middle":
return [-width / 2, height / 2];
case "top-left":
- return [r, m + r];
+ return [r, m / 2 + r];
case "top":
return [-width / 2, m / 2 + r];
case "top-right":
- return [-width - r, m + r];
+ return [-width - r, m / 2 + r];
case "right":
return [-m / 2 - width - r, height / 2];
case "bottom-left":
- return [r, -m - r];
+ return [r, -m / 2 - r];
case "bottom":
return [-width / 2, -m / 2 - r];
case "bottom-right":
- return [-width - r, -m - r];
+ return [-width - r, -m / 2 - r];
case "left":
return [r + m / 2, height / 2];
}
@@ -306,19 +306,19 @@ function getPath(anchor, m, r, width, height) {
case "middle":
return `M${-w / 2},${-h / 2}h${w}v${h}h${-w}z`;
case "top-left":
- return `M0,0l${m},${m}h${w - m}v${h}h${-w}z`;
+ return `M0,0l${m / 2},${m / 2}h${w - m / 2}v${h}h${-w}z`;
case "top":
return `M0,0l${m / 2},${m / 2}h${(w - m) / 2}v${h}h${-w}v${-h}h${(w - m) / 2}z`;
case "top-right":
- return `M0,0l${-m},${m}h${m - w}v${h}h${w}z`;
+ return `M0,0l${-m / 2},${m / 2}h${m / 2 - w}v${h}h${w}z`;
case "right":
return `M0,0l${-m / 2},${-m / 2}v${m / 2 - h / 2}h${-w}v${h}h${w}v${m / 2 - h / 2}z`;
case "bottom-left":
- return `M0,0l${m},${-m}h${w - m}v${-h}h${-w}z`;
+ return `M0,0l${m / 2},${-m / 2}h${w - m / 2}v${-h}h${-w}z`;
case "bottom":
return `M0,0l${m / 2},${-m / 2}h${(w - m) / 2}v${-h}h${-w}v${h}h${(w - m) / 2}z`;
case "bottom-right":
- return `M0,0l${-m},${-m}h${m - w}v${-h}h${w}z`;
+ return `M0,0l${-m / 2},${-m / 2}h${m / 2 - w}v${-h}h${w}z`;
case "left":
return `M0,0l${m / 2},${-m / 2}v${m / 2 - h / 2}h${w}v${h}h${-w}v${m / 2 - h / 2}z`;
}
diff --git a/test/output/tipAnchors.svg b/test/output/tipAnchors.svg
new file mode 100644
index 0000000000..b2a3d74ba7
--- /dev/null
+++ b/test/output/tipAnchors.svg
@@ -0,0 +1,98 @@
+
\ No newline at end of file
diff --git a/test/plots/tip.ts b/test/plots/tip.ts
index 4540b9cf35..48c4b30c00 100644
--- a/test/plots/tip.ts
+++ b/test/plots/tip.ts
@@ -3,6 +3,33 @@ import * as d3 from "d3";
import {feature, mesh} from "topojson-client";
import {test} from "test/plot";
+test(async function tipAnchors() {
+ const plot = Plot.plot({
+ style: "overflow: visible;",
+ height: 160,
+ marks: [
+ Plot.frame({strokeOpacity: 0.2}),
+ (
+ [
+ "top",
+ "right",
+ "bottom",
+ "left", // sides
+ "top-left",
+ "top-right",
+ "bottom-right",
+ "bottom-left", // corners
+ "middle"
+ ] as const
+ ).map((anchor) => [
+ Plot.dot({length: 1}, {frameAnchor: anchor, fill: "blue"}),
+ Plot.tip([anchor], {frameAnchor: anchor, anchor})
+ ])
+ ]
+ });
+ return Object.assign(plot, {ready: new Promise((resolve) => setTimeout(resolve, 100))}); // postrender
+});
+
test(async function tipAreaBand() {
const aapl = await d3.csv("data/aapl.csv", d3.autoType);
return Plot.areaY(aapl, {x: "Date", y1: "Low", y2: "High", tip: true, curve: "step", stroke: "currentColor"}).plot();