Карты Google (API v2) + диалоговое окно jQuery UI, проблема с неостановимым перетаскиванием - PullRequest
Новая
       2

Карты Google (API v2) + диалоговое окно jQuery UI, проблема с неостановимым перетаскиванием

2 голосов
/ 14 декабря 2010

Привет!

Я использую Google Maps API v2 (по некоторым причинам он имеет в качестве v2) и jQuery UI 1.8.6 (и jQuery 1.4.1).

Ситуация такова: У меня есть карта внутри модального диалога.

Проблема: Когда я нажимаю на тень с информацией «шар» иперетащите карту, перетаскивание не прекратится.

Я действительно не знаю, какой код я должен предоставить, поэтому, если вы хотите, чтобы я специально добавил код, просто дайте мне знать. 

function createMarker(latitude, longitude, num, color, id_local) {

var iconOptions = {};
iconOptions.width = 32;
iconOptions.height = 32;
iconOptions.primaryColor = ''+color;
iconOptions.label = ''+num;
iconOptions.cornerColor = "#82c4e8";
iconOptions.strokeColor = "#000000";

var newIcon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
//
var point = new GLatLng(latitude,longitude,0);
//
var marker = new GMarker(point, {
    icon: newIcon
});


var html = $('#info_mapa_'+id_local).html();
GEvent.addListener(marker, 'click', function() {
    marker.openInfoWindowHtml(html);
});

return marker;
}

Спасибо.

Ответы [ 2 ]

0 голосов
/ 22 марта 2011

Мой босс решил провести день, переходя на v3 и избавившись от этой глупой проблемы.Спасибо всем.

0 голосов
/ 23 декабря 2010

UPDATE

ДЕМО: http://jsbin.com/ofuze4

ДЕМО: http://so.devilmaycode.it/google-maps-api-v2-jquery-ui-dialog-non-stoppable-dragging-problem/

КОД PSEUDO:

JS: 

$(function() {
    $("#j-dialog").dialog({
        resizable: false,
        width: 500,
        height: 400,
        open: function() {
            initialize();
        }
    });
});
function initialize() {
    var latlng = new google.maps.LatLng( - 34.397, 150.644);
    var myOptions = {
        zoom: 8,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map($("#map_canvas")[0], myOptions);

    var contentString = $('#map-info').text();

    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

var newIcon = 'http://cdn2.iconfinder.com/data/icons/oxygen/48x48/actions/note2.png';

var marker = new google.maps.Marker({ 
    icon: newIcon,
    position: latlng,
    map: map,
    title: "Hello World!"
});

    google.maps.event.addListener(marker, 'click',
    function() {
        infowindow.open(map, marker);
    });
}

CSS: 

<style>#map_canvas { margin:0 auto; width:450px; height: 340px }</style>

HTML: 

    <div title="google maps inside jquery dialog" id="j-dialog">    
      <div id="map_canvas">
      </div>  
    </div>

надеюсь, это поможет

ССЫЛКА:

...