Home » Jquery » javascript – Plot coordinates on image using jquery-Exceptionshub

javascript – Plot coordinates on image using jquery-Exceptionshub

Posted by: admin February 24, 2020 Leave a comment


I have image which is display dynamically. For this image i have coordinate value which is already stored in database.Now using this coordinate value i want to mark on image.

Here is my jquery code,

$(document).ready(function () {
           type: "POST",
           url: "Section.aspx/GetImageData",
           //data: '',
            data: JSON.stringify({ "dataSecName": name }),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                   var imgval = JSON.parse(data.d);
                   $.each(imgval, function (i, jsondata) {
                    var img = $('<img id="dynamic">'); //Equivalent: $(document.createElement('img'))
                    img.attr('src', "../Administration/imageHotspot/" + jsondata.ImageName);

Here image get display successfully. now i want to use this coordinate value plot on this image.
I have write the code to plot but nothing gets work

  $.each(imgval, function (i, jsondata) {
                                    position: 'absolute',
                                      top: jsondata.YCordinate + 'px',
                                      left: jsondata.XCordinate + 'px',
                                    //top: event.pageY + 'px',
                                    //left: event.pageX + 'px',
                                    width: '10px',
                                    height: '10px',
                                    background: '#dd4b39',
                                    'border-radius': '10px'

How to&Answer: