jquery - bug noticed rendering positions with javascript -


i have code first creates variable positions x,y positions of image it's width , height. select area(s) in image remove these positions clone of positions have the sum of positions in 2 different arrays.

var positions = []; var areas = {} var area_counter = 0;  var image_width = $('.img-class')[0].naturalwidth; var image_height = $('.img-class')[0].naturalheight;  var area = image_width * image_height;  var img_width = 0; var img_height = 0; (counter = 0; counter < area; counter++) {      positions.push([img_width, img_height]);      img_width += 1;     if (img_width == image_width) {         img_width = 0;         img_height += 1;     } }  var drop_boxes = $('.drop-box'); var area_grid = []; var image_width = $('.img-class')[0].naturalwidth; var image_height = $('.img-class')[0].naturalheight;  drop_boxes.each(function() {     var position = $(this).position();     var width =  $(this).width();     var height = $(this).height();     var positions_clone = positions.slice(0);     //console.log(positions_clone.length);      var top_offset = parseint((position['top'] * image_width)/img_width);     var left_offset = parseint((position['left'] * image_height)/img_height);      position['top'] = top_offset;     position['left'] = left_offset;      var width_offset = parseint((width * image_width)/img_width);     var height_offset = parseint((height * image_height)/img_height);      var width_counter = 1;     var height_counter = 1;      var area = width_offset * height_offset;                      if (position['top'] < image_height-1 && position['left'] < image_width) {         (counter = 0; counter < area; counter++) {                    var pos = [position['left']+width_counter, position['top']+height_counter];              var index = positions.findindex(function(item) {               // return result of comparing `data` `item`                // simple implementation assumes `item`s arrays.               return pos.length === item.length &&                      item.every(function(n, i) { return n === pos[i] });             });              if (index > -1) {                 positions_clone.splice(index, 1);             }              area_grid.push(pos);              width_counter += 1;              if (width_counter == width_offset) {                 width_counter = 1;                 height_counter += 1;             }              if (counter%100 == 0) {                 var percentage = math.round((counter/area)*100, 2);                 console.log("percentage: "+percentage+"%");             }         }         console.log(positions_clone.length);         console.log(area_grid.length);          areas[area_counter] = {'area': area_grid, 'positions': positions_clone};         parent.find('.area').text(area_counter);         area_counter += 1;     }                  }); 

problem when use these positions render image there's either offsetted position or missing positions. seen in these images. original image first example


Comments

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

python Tkinter Capturing keyboard events save as one single string -

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -