2016-04-18 3 views
2

Мой HTML код выглядит так:Как добавить адрес в карту маркера google?

<a href="#" class="button" data-latLng="53#separator#-1.33#separator#Address 1">Button 1</a> 
<a href="#" class="button" data-latLng="-34.397#separator#150.644#separator#Address 2">Button 2</a> 
<div id="map-canvas"></div> 

Мой Javascript код выглядит так:

$(document).on("click", ".button", function(e) { 
    e.preventDefault(); 
    var latLng = $(this).attr("data-latLng");   
    initialize(latLng); 

    function initialize(latLng) { 
     console.log(latLng); 
     latLng = latLng.split("#separator#"); 
     address = latLng[2]; 
     console.log(address); 
     var map;   
     var myCenter=new google.maps.LatLng(latLng[0],latLng[1]); 
     var marker=new google.maps.Marker({ 
      position:myCenter 
     }); 

     var mapProp = { 
      center: myCenter, 
      zoom: 14, 
      mapTypeId:google.maps.MapTypeId.ROADMAP 
     }; 

     map=new google.maps.Map(document.getElementById("map-canvas"),mapProp); 
     marker.setMap(map); 

     ... 
    }; 
    ... 
}); 

Demo как это: https://jsfiddle.net/oscar11/b0ahcLxw/

Я хочу отображения адреса в маркерной Google карте, но я все еще смущен. Таким образом, при нажатии кнопки карта автоматически отображает адрес на маркере.

Любое решение для решения моей проблемы?

Большого спасибо

ответ

3

Вы не объявляли infowindow и contentString переменных. Таким образом, вы должны объявить переменную infowindow как сильфона

var infowindow = new google.maps.InfoWindow(); 

А также объявить contentString

var contentString ="Your Content String"; 

Edit:

// Add this line 
var contentString ="Your Content String"; 
google.maps.event.addListener(marker, 'click', function() { 
    // Add this line 
    var infowindow = new google.maps.InfoWindow(); 
    infowindow.setContent(contentString); 
    infowindow.open(map, marker); 
}); 

JsFiddle Example
Автоматически показывать InfoWindow JsFiddle Demo

+0

Благодарим Вас за ответь на мой вопрос. Но я хотел, адрес автоматически появляется без маркера кликов. Таким образом, при нажатии кнопки карта автоматически направляет адрес на маркер. –

+0

Вы можете сделать это тоже –

+0

Я обновил свой ответ, пожалуйста, посмотрите. –

0

Добавить эту строку и вместо hellooo установить свой контент.

google.maps.event.addListener(marker, 'click', function() { 
var infowindow = new google.maps.InfoWindow(); 
infowindow.setContent("hellooo"); 
infowindow.open(map, marker); 

}); 

еще можно найти здесь JsFiddle

и для получения адреса от лат долго вы можете использовать обратный геокодируете вы можете найти пример здесь с кодом попробовать это один Reverse Geocoding