如何在谷歌地图中突出显示用户的当前位置？ [英] How to highlight a user's current location in google maps?

问题描述

 函数getLocation（）{ 
 var win =函数（位置）{
 var lat = position.coords.latitude; 
 var long = position.coords.longitude; 
 var myLatlng = new google.maps.LatLng（lat，long）; 
 
 var myOptions = {
 center：myLatlng，
 zoom：7，
 mapTypeId：google.maps.MapTypeId.ROADMAP 
}; 
 var map_element = document.getElementById（displayMap）; 
 var map = new google.maps.Map（map_element，myOptions）; 
}; 
 
 var fail = function（e）{
 alert（'Error：'+ e）; 
}; 
 
 var watchID = navigator.geolocation.getCurrentPosition（win，fail）; 
} 
  

通过将用户的当前位置居中在地图上，但我想在用户的位置上显示一个指示符（红点）。但我可以看到，google API只提供3个选项center，zoom和mapTypeId。

是否有任何可用的选项可用于突出显示位置或是否有解决方法？

编辑

能够发现google maps API有一个标记ho突出任何位置。这看起来很有帮助，但是它显示了一个默认的红色气球，可以通过自定义图像修改吗？ 您可以使用新发布的 GeolocationMarker ，它是 Google Maps API实用程序库。

它会在用户当前位置添加一个标记和精度圆。它还允许开发人员使用 setMarkerOptions 方法并指定图标属性来自定义标记。

I am using following code to get the location of user in phonegap (it works fine)

function getLocation() {
    var win = function(position) {
        var lat = position.coords.latitude;
        var long = position.coords.longitude;
        var myLatlng = new google.maps.LatLng(lat, long);

        var myOptions = {
           center: myLatlng,
           zoom: 7,
           mapTypeId : google.maps.MapTypeId.ROADMAP
        };
        var  map_element = document.getElementById("displayMap");
        var map = new google.maps.Map(map_element, myOptions);
    };

    var fail = function(e) {
        alert('Error: ' + e);
    };

    var watchID = navigator.geolocation.getCurrentPosition(win, fail);
}

This is working fine by centering the user's current location on the map. But I would like to show an indicator (a red dot) on the user's location. But I can see that google API provide only 3 options center, zoom and mapTypeId.

Are there any available options that can be used to highlight the position or is there a workaround?

EDIT

Was able to find that google maps API has a marker ho highlight any position. That looks helpful, but that shows a default red balloon, can that be modified by a custom image?

解决方案

You can use the newly released GeolocationMarker which is part of the Google Maps API Utility Library.

It will add a marker and accuracy circle at the user's current location. It also allows a developer to customize the marker using the setMarkerOptions method and specifying an icon property.

这篇关于如何在谷歌地图中突出显示用户的当前位置？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！