Asp Forum
Home
|
Login
|
Register
|
Search
Forums
>
comp.lang.javascript
need x,y coordinates of click inside SVG element
Jay Braun
8/26/2015 8:39:00 PM
I have a map background, drawn as an SVG element with a width of 2188 pixels and a height of 1312 pixels. I want the x,y coordinates of a click within this area, but the event clientX and clientY attributes, as well as the screenX and screenY attributes, seem to be scaled differently. In both cases, the width and length are expressed as smaller quantities (apparently larger measurement units).
Can one retrieve the x and y coordinates of a click inside an SVG element that has a specified width and height? I would also be willing to use a multiplier for clientX/Y or screenX/Y, but I do not understand what they denote.
Here is my html file:
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>RESA Graphics</title>
<meta http-equiv="refresh" content="5">
<style>
#svgContainer {
width: 2188px;
height: 1312px;
background-color: "white";
}
</style>
<script type='text/javascript' src='fixed.js'></script>
<script type='text/javascript' src='var.js'></script>
</head>
<body onload="resagui()">
<div id="svgContainer"></div>
</body>
and here is JavaScript that defines attributes of the SVG element representing the map:
function resagui() {
var xmlns = "
http://www.w3.org/2000/...
var boxWidth = 2188;
var boxHeight = 1312;
var svgElem = document.createElementNS (xmlns, "svg");
svgElem.setAttributeNS (null, "viewBox", "0 0 " + boxWidth + " " + boxHeight);
svgElem.setAttributeNS (null, "width", boxWidth);
svgElem.setAttributeNS (null, "height", boxHeight);
svgElem.setAttributeNS (null, "preserveAspectRatio", "xMidYMid meet");
var g = document.createElementNS (xmlns, "g");
svgElem.appendChild (g);
g.setAttributeNS (null, "transform", "translate(0.000000,1312.000000) scale(0.100000,-0.100000)");
....
The scale in the last posted statement does seem fishy, but the difference does not seem to be a factor of 10.
1 Answer
Jay Braun
8/26/2015 10:10:00 PM
0
Just found out about pageX and pageY, which is what I needed.
Thanks to whomever was going to reply.
Servizio di avviso nuovi messaggi
Ricevi direttamente nella tua mail i nuovi messaggi per
need x,y coordinates of click inside SVG element
Inserendo la tua e-mail nella casella sotto, riceverai un avviso tramite posta elettronica ogni volta che il motore di ricerca troverà un nuovo messaggio per te
Il servizio è completamente GRATUITO!
x
Login to ForumsZone
Login with Google
Login with E-Mail & Password