谷歌地图中的多重标记

时间:2017-04-11 12:05:50

标签: javascript google-maps google-maps-markers

我想在google地图中找到多个位置,我不擅长javascript,这就是为什么我在创建多个位置的数组时遇到问题。 我创建了一个显示当前位置的地图。我想为此添加更多位置。

var watchID = null;
$(document).ready(function(){
    var optn = {
enableHighAccuracy: true,
            timeout: Infinity,
            maximumAge: 0   
        };
    if( navigator.geolocation )
     navigator.geolocation.watchPosition(success, fail, optn);
    else
     $("p").html("HTML5 Not Supported");
$("button").click(function(){

    if(watchID)
     navigator.geolocation.clearWatch(watchID);

    watchID = null;
    return false;
});

});

function success(position)
{
    var googleLatLng = new google.maps.LatLng(position.coords.latitude, 
                        position.coords.longitude);

      var myLatlng = new google.maps.LatLng(26.220778, 78.177259);      

    var mapOtn={
zoom:15,
center:googleLatLng,
mapTypeId:google.maps.MapTypeId.ROAD
    };

    var Pmap=document.getElementById("map");

    var map=new google.maps.Map(Pmap, mapOtn);
    addMarker(map, googleLatLng, "Momo", 
                  "Mamta");
}

function addMarker(map, googleLatLng, title, content){
    var markerOptn={
position:googleLatLng,
map:map,
title:title,
animation:google.maps.Animation.DROP
    };

    var marker=new google.maps.Marker(markerOptn);

    var infoWindow=new google.maps.InfoWindow({ content: content, 
                                                   position: googleLatLng});
    google.maps.event.addListener(marker, "click", function(){
        infoWindow.open(map);
    });                                                
}

function fail(error)
{
    var errorType={
0:"Unknown Error",
1:"Permission denied by the user",
2:"Position of the user not available",
3:"Request timed out"
    };

    var errMsg = errorType[error.code];

    if(error.code == 0 || error.code == 2){
        errMsg = errMsg+" - "+error.message;
    }

    $("p").html(errMsg);
} 

1 个答案:

答案 0 :(得分:0)

我建议首先使用google maps api文档中的这个简单教程设置一个简单的标记。

https://developers.google.com/maps/documentation/javascript/examples/marker-simple

在此页面上,我们可以看到在以下函数中创建简单市场的代码:

    function initMap() {
    var myLatLng = {lat: -25.363, lng: 131.044};

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 4,
      center: myLatLng
    });
      //Here we can see the code for creating a simple marker below.
      //by using the same logic we can copy the code below and create 
      //another marker on the map.
      var marker = new google.maps.Marker({
      position: {121.11,44.543},
      map: map,
      title: 'Hello World!'
    });
  }