2013-03-12 31 views
1

我有一個谷歌地圖上有一個圓圈,只要我改變半徑,我提交一個表單用新的參數,地圖疊加圓,缺拖動事件在谷歌文檔

這個作品非常好,editable:trueradius_changed -event

因爲當完成調整大小移動時,會觸發radius_changed事件。

我想要做同樣與center_changed的事件 但是這一次doesn't火的時候我「滴」的圈子,它激發一切的中心發生變化的時候,

我不能找到任何拖事件中的文檔圓的,

的問題是,我的表格會立刻儘快提交我移動一圈像素。

這裏是我的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事件=

確定我意識到,我想要的功能自帶可編輯:真正 但只有當我用的是小中心點拖,我很想拖動整圈的任何地方 先感謝您的任何暗示

回答

0

我有同樣的問題,我的溶劑是這樣的。我知道鼠標是否關閉 - 在這種情況下,圓心沒有設置。當鼠標向上時,中心被設置。我需要使用超時,因爲center_change事件比mouseup事件快。

由於某種原因,center_changed事件在結尾處被觸發兩次。如果這讓你感到困擾,可以使用Ben Alman的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); 
}