How to get relative image coordinate of this div ?
It’s a number between 0 and 1 and indicate position relative to the background image.
<div class="marker ui-draggable ui-draggable-handle" title="" style="position: absolute; left: 297.5px; top: 236px;">
<img src="./lib/images/marker-15.svg" style="width: 110%;">
<p class="marker-text">1</p>
</div>
I found a function for getting cursor relative image coordinate but I don’t know how to do for this div :
cursorToImg: function(cx, cy) {
if (this.ready) {
var $img = $(this.img),
width = $img.width(),
height = $img.height(),
offset = $img.offset();
var zLeft = width/2 - this.vCenter.x * this.options.zoom;
var zTop = height/2 - this.vCenter.y * this.options.zoom;
var relx = (cx - offset.left - this.offsetBorder.x - this.offsetPadding.left- zLeft)/(width * this.options.zoom);
var rely = (cy - offset.top - this.offsetBorder.y - this.offsetPadding.top - zTop)/(height * this.options.zoom);
if (relx>=0 && relx<=1 && rely>=0 && rely<=1) {
return {x: relx, y: rely};
} else {
return null;
}
} else {
return null;
}
},
Thank’s in advance.
Tags: image, java, javascriptjavascript