在Javascript中获取动力学图像的屏幕坐标？
我正在编写一个应用程序并使用Kinetic JS库从客户端的计算机加载图像。 图像包含在照片对象中，并按如下方式初始化
var photoObj = new Image(); photoObj.onload = function() { var photoImage = new Kinetic.Image({ x: 0, y: 0, image: photoObj, width: photoObj.width, height: photoObj.height, name: "photo", id: "photo" }); photoGroup.removeChildren(); photoGroup.add(photoImage); 该对象包含在名为photoGroup的Kinetic Group对象中，该对象是先前创建的。
photoGroup = new Kinetic.Group({ x : 0, y : 0, draggable : true, id : "photoGroup" }); photoLayer = new Kinetic.Layer({ drawBorder: true }); photoLayer.add(photoGroup); stage = new Kinetic.Stage({ container : "kinetic-kard-preview", width : 320, height : 480 }); stage.add(photoLayer); stage.draw();
组对象包含在名为photoLayer的Kinetic Layer对象中，该对象包含在名为stage的Kinetic Stage对象中。
无论如何，我的问题是，现在我想得到图像的屏幕坐标。 我成功地得到了舞台的坐标
var containerOffset=$("#kinetic-kard-preview").offset(); var offsetX=containerOffset.left; var offsetY=containerOffset.top; console.log(offsetX);//455.859375 console.log(offsetY);//218
但我似乎无法对图像做同样的事情。 当我查看网页的源代码时，我注意到生成的包含图像的canvas的html代码是这样的。
从客户端的PC加载到canvas后，如何获取图像的屏幕坐标？ 请帮忙！！！ 谢谢。
谢谢你的回答，但它似乎无法得到我需要的东西。 我刚刚在这里添加了屏幕截图的链接：
正如您在图片中看到的那样，图像的坐标与包含它的舞台的坐标不同。 我写了一个mousemove事件并计算了 – 舞台的x屏幕坐标（即offsetX）和图像的x屏幕坐标之间的距离。 – 舞台的y屏幕坐标（即，偏移Y）与图像的y屏幕坐标之间的距离。
它们都有相同的数字…. 24（如屏幕所示）。 通过使用mousemove事件，我手动获取offsetX，offsetY的值，图像的x和y屏幕坐标为455,218,479和242。
但是，我的问题是如何在从我的电脑上加载图像后自动获取这些数字，尤其是图像的屏幕坐标。 我将gPos的值打印到console.log并得到（0,0）值。 因此，当我将offsetX和offsetY添加到这些值时，它们是相同的（455,218），而不是（479,242）。 请让我知道我现在该怎么办？ 再次感谢你的帮助。
你的Kinetic.Image位于可拖动的Kinetic.Group中的[0,0]位置。
因此，您可以添加以下内容来获取图像位置：
-
＃kinetic-kard-preview抵消
-
加上当前组位置：group.position（）
[为KineticJS 4.5.1版添加了代码]
以下是v4.5.1和演示的示例代码： http ： //jsfiddle.net/m1erickson/NXH9X/
Prototype Semi-transparent flag is at screen position 150,200
Drag the opaque flag and see screen position
