DOM 点在 chrome 中被解释为对象

Question

以下相当愚蠢的代码在 Firefox 中运行良好，但在 chrome 中，注释中指示的内容发生了。想要检查 SVG 功能，所以我正在检查椭圆的中心是否是该椭圆的填充点，这显然是正确的。令人费解的事实是前两个控制台日志。Dom 点输出为“Dom 点”，然后它的typeof 为对象，这自然打破了接下来的两个console.log 语句。

let ellipseFirstStop = document.getElementById("Sation_1_circle"); //Sation_1_circle is an SVG ellipse.
let centroFirstStop = new DOMPoint(+ellipseFirstStop.cx.animVal.value, +ellipseFirstStop.cy.animVal.value);

console.log(centroFirstStop);
//outputs DOMPoint {x: 268.2749938964844, y: 183.63299560546875, z: 0, w: 1}, all fine.

console.log(typeof centroFirstStop);
//outputs "object", what?

console.log("is point in fill test: "+ellipseFirstStop.isPointInFill(centroFirstStop));
//causes: Uncaught TypeError: Failed to execute 'isPointInFill' on 'SVGGeometryElement' parameter 1 is not of type 'SVGPoint'.

console.log("is point in fill test: "+ellipseFirstStop.isPointInFill(new DOMPoint(+ellipseFirstStop.cx.animVal.value, +ellipseFirstStop.cy.animVal.value)));
//causes: Uncaught TypeError: Failed to execute 'isPointInFill' on 'SVGGeometryElement': parameter 1 is not of type 'SVGPoint'.

Answer 1

isPointInFill 的接口曾经是一个 SVGPoint，它被更改为 DOMPointInit。

DOMPointInit 的优点是您可以将 DOMPoint 或 SVGPoint 传递给 API，并且它仍然可以工作，基本上任何具有 x 和 y 属性的对象也是如此。

Firefox 已经实现了新的 API，Chrome 还没有。

如果您传递可以通过SVGSVGElement .createSVGPoint()获得的 SVGPoint，您的代码将适用于 Chrome 和 Firefox。