All geek questions in one place

Dynamically create coordinates of a map area from clicks on an image (jquery or javascript)

I wondered if there was a way to generate the coordinates of the map area dynamically by clicking some parts of the image. This is necessary to create a complete image map.

As an example, I have this image:

View image by clicking here ...

and by clicking on it, I want to generate coordinates for each specific area, outputting something like this:

<input type="text" name="36" value="25,11,25,117,47,117,46,29,83,31,84,8" /> <input type="text" name="37" value="83,12,103,32" />

etc...

Then I will save this in a database for later use and processing.

I want to do something similar to what this site does, but simpler. I just need to maintain the functionality of displaying strings while drawing for the user to see what he is doing, and, of course, retrieve the coordinates.

Online Image Card Editor

Is there any jquery plugin that already does this job or how to do it using jquery or javascript.

Thanks at adavnce

+4
source share
2 answers

Check out the ImageMapster jQuery plugin: http://www.outsharked.com/imagemapster/default.aspx?demos.html

+2
source

We had the same requirements. And we ended up using this jQuery plugin: http://odyniec.net/projects/imgareaselect/

Hope this helps.

+2
source

Source: https://habr.com/ru/post/1439646/

More articles:


All Articles