2017-04-11 94 views
0

我想在谷歌地图中找到多个位置,我不擅长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); 
} 

回答

0

我会通过使用来自谷歌地图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!' 
    }); 
    }