карта наложение круг, отсутствует событие перетаскивания в Google Docs

Question

У меня есть Google карта с кружком на него, как только я изменить радиус, я представить форму с новыми параметрами,

это очень хорошо работает с editable:true и radius_changed -event

потому что событие radius_changed срабатывает, когда вы закончите изменение размера.

Я хочу сделать то же самое с center_changed-событием , но этот один огнем, когда это не распространяется я «падать» круг, он стреляет все время меняется центр,

я не могу найти какое-либо drag-событие круга в документах,

проблема заключается в том, что моя форма сразу же будет отправлена, как только я перемещу круг a px.

вот мой gmap3 фрагмент кода

circle:{ 
options:{ 
    center: destination, 
    radius : distance, 
    fillColor : "white", 
    fillOpacity:0.3, 
    strokeColor : "#c9311b", 
    editable:true, 
    draggable:true 
}, 
events:{ 
    click: function(circle){ 
    circle.setOptions({ 
     fillColor : "white", 
     fillOpacity:0.1, 
     strokeColor : "#FF512F" 
    }); 
    }, 
    radius_changed: function(circle){ 
    var radius =circle.getRadius() ; 
    var newradius = parseInt(radius)/1000; 
    alert(parseInt(newradius,10)); 
    $('#seldistance').val(parseInt(newradius,10)); 
    $('.sucheen').submit(); 

    }, 
    center_changed: function(circle){ // 
    var center = circle.getCenter(); // Here´s the center change event, 
    console.log(center);    //it really spams the console when you drag 
    }         // 
}, 
callback: function(circle){ 
    if(distance != '0'){ 
     if (distance < '1000'){ 
      $(this).gmap3('get').setZoom(15); 
      console.log('radius ='+distance); 
     } 
     else if (distance < '5000'){ 
      $(this).gmap3('get').setZoom(13); 
      console.log('radius ='+distance); 
     } 
     else if (distance < '10000'){ 
      $(this).gmap3('get').setZoom(12); 
      console.log('radius ='+distance); 
     } 
     else if (distance < '20000'){ 
      $(this).gmap3('get').setZoom(11); 
      console.log('radius ='+distance); 
     } 
     else if (distance < '35000'){ 
      $(this).gmap3('get').setZoom(10); 
      console.log('radius ='+distance); 
     } 
     else{ 
     $(this).gmap3('get').setZoom(10); 
     } 
    } 
    else { 
    //Clear circle if no radius is set 
    $(this).gmap3({ 
     clear: { 
     name:["circle"], 
     last: true 
     } 
    }); 
    $(this).gmap3('get').setZoom(12); 
    } 
} 
},//close circle 

кто имеет представление о том, как вызвать событие dragend =

хорошо я понял, что функция я хочу поставляется с редактируемой: истинный , но только тогда, когда я использую маленькую центральную точку, чтобы перетащить, я хотел бы, чтобы перетащить весь круг в любом месте заранее спасибо за любого намека

Answer 1

У меня была такая же проблема, и это мое решение. Я знаю, если мышь опущена - в этом случае центр круга еще не установлен. Когда мышь поднята, устанавливается центр. Мне нужно использовать таймаут, потому что событие center_change быстрее, чем событие mouseup.

По какой-либо причине событие center_changed запускается дважды в конце. Если это вас беспокоит, можно использовать Throttle/Debounce plugin Бен Алмана.

var mousedown; 
$(document).mousedown(function() { 
    mousedown = true; 
}); 
$(document).mouseup(function() { 
    mousedown = false; 
}); 

gmaps.event.addListener(this.circle, 'center_changed', function() { 
    setTimeout(function(){ 
     if (!mousedown) { 
      console.log('center changed'); 
     } 
    }, 10); 
}