我试图找到一种可以点击单个像素然后记录/打印像素的XY坐标的方法。我在网上找到了下面的代码,但它只显示了最后点击的像素的坐标。有没有办法保存/打印我点击的所有像素的坐标。我正在为Java applet做这个,这会让我更容易制作多边形。 我希望输出(当我点击像素时)就像这样,这样我就可以复制&粘贴到java:
int [] x={x1,x2,x3,x4,x...};
int [] y={y1,y2,y3,y4,y...};
以下是我找到的代码:
<html>
<head>
<script language="JavaScript">
function point_it(event){
pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
document.getElementById("cross").style.left = (pos_x-1) ;
document.getElementById("cross").style.top = (pos_y-15) ;
document.getElementById("cross").style.visibility = "visible" ;
document.pointform.form_x.value = pos_x;
document.pointform.form_y.value = pos_y;
}
</script>
</head>
<body>
<form name="pointform" method="post">
<div id="pointer_div" onclick="point_it(event)" style = "background-image:url('image.jpg');width:2400px;height:1848px;">
<img src="point.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;"></div>
You pointed on x = <input type="text" name="form_x" size="4" /> - y = <input type="text" name="form_y" size="4" />
</form>
</body>
</html>
&#13;
答案 0 :(得分:0)
<html>
<head>
<script language="JavaScript">
var x = [];
var y = [];
function point_it(event) {
pos_x = event.offsetX ? (event.offsetX) : event.pageX - document.getElementById("pointer_div").offsetLeft;
pos_y = event.offsetY ? (event.offsetY) : event.pageY - document.getElementById("pointer_div").offsetTop;
document.getElementById("cross").style.left = (pos_x - 1);
document.getElementById("cross").style.top = (pos_y - 15);
document.getElementById("cross").style.visibility = "visible";
x.push(pos_x);
y.push(pos_y);
document.getElementById("form_x").innerHTML = x;
document.getElementById("form_y").innerHTML = y;
};
function remove_it() {
x.pop();
y.pop();
document.getElementById("form_x").innerHTML = x;
document.getElementById("form_y").innerHTML = y;
}
</script>
</head>
<body>
<form name="pointform" method="post">
<div id="pointer_div" onclick="point_it(event)" style="background-image:url('image.jpg');width:2400px;height:1848px;">
<img src="point.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;">
</div>
You pointed on
<br>x = <span id="form_x"></span>
<br>y = <span id="form_y"></span>
<br>
<button onclick="remove_it()">remove last</button>
</form>
</body>
</html>