2010-10-21 2 views
0

Я использую автозаполнение jQuery. Я хотел бы нарисовать карту на основе результата , который выбран из автозаполнения. У меня есть лат/долго использовать захваченный в переменной «LatLong»jQuery autocomplete result for google map api

код автозаполнения: http://pastebin.com/YTNnDS51

код Google карта:

var map = new GMap2($("#map").get(0)); 
    var burnsvilleMN = new GLatLng(latlong); 
    map.setCenter(burnsvilleMN, 8); 

    // setup 10 random points 
    var bounds = map.getBounds(); 
    var southWest = bounds.getSouthWest(); 
    var northEast = bounds.getNorthEast(); 
    var lngSpan = northEast.lng() - southWest.lng(); 
    var latSpan = northEast.lat() - southWest.lat(); 
    var markers = []; 
    for (var i = 0; i < 10; i++) { 
     var point = new GLatLng(southWest.lat() + latSpan * Math.random(), 
      southWest.lng() + lngSpan * Math.random()); 
    marker = new GMarker(point); 
    map.addOverlay(marker); 
    markers[i] = marker; 
    } 

    $(markers).each(function(i,marker){ 
    $("<li />") 
    .html("Point "+i) 
    .click(function(){ 
    displayPoint(marker, i); 
    }) 
    .appendTo("#list"); 

    GEvent.addListener(marker, "click", function(){ 
    displayPoint(marker, i); 
    }); 
    }); 

    $("#message").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE)); 

    function displayPoint(marker, index){ 
    $("#message").hide(); 

    var moveEnd = GEvent.addListener(map, "moveend", function(){ 
    var markerOffset = map.fromLatLngToDivPixel(marker.getLatLng()); 
    $("#message") 
    .fadeIn() 
    .css({ top:markerOffset.y, left:markerOffset.x }); 

    GEvent.removeListener(moveEnd); 
    }); 
    map.panTo(marker.getLatLng()); 
    } 

если я поставил на карту код Google в любом месте страницы с жестко закодированный лат/длинный, он отлично рисует. Проблема в том, что для моего использования мне нужно подождать, чтобы нарисовать карту до тех пор, пока не произойдет событие автозаполнения, чтобы я мог зафиксировать правильный lat/long. Я не уверен, как вызвать карту Google , чтобы обновить один раз я захватил, что лат/длинные

Спасибо за ваши мысли

+0

В вашем коде pastebin есть большая проблема. Если вы скопируете и вставляете код для изменения имени переменной в следующей части IF, вы делаете что-то очень неправильно. Вся эта программа должна быть около 1/2 или меньше от ее размера. Вы должны заглянуть в ООП ... Я даже не хочу смотреть на код pastebin, потому что он смело идет против лучших практик. – Incognito

+0

Я не копирую и не вставляю код, чтобы изменить имя переменной. Также я просто пытаюсь получить функциональность, а затем я очищу код. Более того, у вас не было проблемы с тем, чтобы поднять ваше эго, пытаясь сбросить мои. кыш – specked

ответ

0

Я использую ВМАР с JQuery, чтобы нарисовать карту Google. Это намного проще и отлично работает.

0

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

$(function(){ 

     //your autocomplete data structure - here lat and long values are made up so pls use real ones 
     var places = [{ 
      label: "Place 1", 
      lat: "34", 
      lng: "134" 
     }, { 
      label: "Place 2", 
      lat: "34", 
      lng: "134" 
     }, { 
      label: "Place 3", 
      lat: "34", 
      lng: "134" 
     }]; 
     $("#tags").autocomplete({ 
      source: places, 
      select: function(event, ui){ 
       //grab the new marker's lat long - assuming you are storing it in an array of objects as above 

       item = ui.item; 
       //draw the new marker on a the map 
       showMarker(item.lat,item.lng) 
       //if you like pan to the new marker 

      } 
     }); 
    }); 

function showMarker(lat,lng){ 
     var point = new GLatLng(lat,lng); 
     //add a marker 
map.addOverlay(new GMarker(point)); 
//if you want pan the map to marker - assuming that your map object is called "map" 
    map.panTo(point) 
    } 

Надеется, что это help

Смежные вопросы