我必须开发一个函数"onMouseClick“来获取画布中图片的坐标(x,y),那么我们如何获取画布(javascript)中可拖动和可缩放图像的坐标x,y呢?
下面是我的代码:
onMouseClick: function(iEvent){
var rect = this.elements.container.getBoundingClientRect();
var x = iEvent.pageX - rect.left;
var y = iEvent.pageY - rect.top;
var coord = "X: " +x+
我有25张带有坐标(x,y)的图片,图片的大小是128*128。所以我加入了图像,新的图像大小将是640 * 640。我想找出(x,y)的新坐标 我试过这样的东西 #w,h of the new image i.e 640 , 640
#imw,imh of the old image i.e 128*128
#x,y old coordinates
newx = int(( w * x )/ imw)
newy = int(( h * y )/ imh)
我正试图用可拖式处理程序绘制语音buble。这就是我所拥有的
(x,y) - buble的左下角坐标
buble长度
buble的宽度
(x1,y1)处理程序端的共接板
以下是更好理解的图片:
当所有的坐标都知道时,我知道如何在画布上画它。这相当简单。
function drawBubble(ctx, x, y, w, h, radius)
{
var r = x + w;
var b = y + h;
ctx.beginPath();
ctx.strokeStyle="black";
ctx.lineWidth="2&
如何从HTML元素中获得相对于屏幕的x,y坐标?我使用getBoundingClientRect()中的x,y,如下所示,但正如您在放大图像中看到的,如果我使用移动光标到x,y位置,光标位于0和+按钮之间的中间,而不是5按钮,这是目标按钮。我遗漏了什么?
JS代码:
var e = document.querySelector('input[id=five]');"
var r = e.getBoundingClientRect();
var x = r.x;
var y = r.y;
MoveMouseTo(x,y); // imaginary call, the r
我有一个独特的问题:投影和从图像中获取经度/经度坐标。
我有一张800 x 600像素的美国图像,我知道图像的投影(极地立体图,原点中心为-75长),左下角的经度/经度,右上角的经度/经度。我已经将图片放到一个网页上,我可以将鼠标移到图片上,并从div标签中的图片中获取x和y“像素”坐标。有没有一个简单的公式来帮助获得x/y像素坐标的经度和经度?
我想要一个简化的过程,因为我有多个地图投影和图像大小。