【问题标题】:Change Marker to Blue Dot in Android Google Maps v2 using Google Maps v3使用 Google Maps v3 在 Android Google Maps v2 中将标记更改为蓝点
【发布时间】:2014-06-19 02:33:29
【问题描述】:

我使用了 Android Google Maps v2,我喜欢它的一个功能是在地图上跟踪您的位置的蓝点。如果您开始移动,蓝点会变为箭头,这也很棒。但是,我在 Google Maps JS api v3 上取得的成就是我可以使用地理位置在我的位置上放置标记。有没有办法从谷歌地图 v2 中放置蓝点和蓝色箭头?

谢谢! :)

编辑:

var map;
var marker;
function initialize() {
var mapOptions = {
zoom: 18
};
map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);

 // Try HTML5 geolocation
if(navigator.geolocation) {
  mapAutoUpdate();
} else {
// Browser doesn't support Geolocation
handleNoGeolocation(false);
}
}

function mapAutoUpdate(){
navigator.geolocation.getCurrentPosition(function(position) {
    var pos = new google.maps.LatLng(position.coords.latitude,
                                     position.coords.longitude);

    var shellCenter = new google.maps.LatLng(14.635595,121.033074);
    marker = new google.maps.Marker({
        map:map,
        draggable:true,
        animation: google.maps.Animation.DROP,
        position: pos
      });
      google.maps.event.addListener(marker, 'click', toggleBounce);


      var shellMarker = new google.maps.Marker({
            map: map,
            position: shellCenter
        });
      var shellCircle = new google.maps.Circle({
          map: map,
          strokeColor: '#FF0000',
          strokeOpacity: 0.8,
          strokeWeight: 2,
          center: shellCenter
      });

      shellCircle.setRadius(40);

      var result = distance( marker.getPosition().lat(), marker.getPosition().lng(), shellMarker.getPosition().lat(), shellMarker.getPosition().lng());
    if(result<shellCircle.getRadius()){

        alert("inside!");
    }

    else 
        alert("outside!");

    map.setCenter(pos);
  }, function() {
    handleNoGeolocation(true);
  });
  setTimeout(mapAutoUpdate, 5000);
}



function distance(lat1,lon1,lat2,lon2) {
var R = 6378137; // km (change this constant to get miles)
var dLat = (lat2-lat1) * Math.PI / 180;
var dLon = (lon2-lon1) * Math.PI / 180; 
var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
    Math.cos(lat1 * Math.PI / 180 ) * Math.cos(lat2 * Math.PI / 180 ) * 
    Math.sin(dLon/2) * Math.sin(dLon/2); 
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
var d = R * c;
return d;
 }

function handleNoGeolocation(errorFlag) {
 if (errorFlag) {
 var content = 'Error: The Geolocation service failed.';
 } else {
var content = 'Error: Your browser doesn\'t support geolocation.';
}

 var options = {
map: map,
position: new google.maps.LatLng(60, 105),
content: content
};

 var infowindow = new google.maps.InfoWindow(options);
 map.setCenter(options.position);
}

function toggleBounce() {

  if (marker.getAnimation() != null) {
    marker.setAnimation(null);
  } else {
    marker.setAnimation(google.maps.Animation.BOUNCE);
  }
}

google.maps.event.addDomListener(window, 'load', initialize);

【问题讨论】:

  • 嗨 Miguel,您介意粘贴一些代码吗?
  • 嗨,saj,我已经更新了我的问题,谢谢。
  • 嗨,有人可以帮我吗?谢谢。

标签: javascript android google-maps google-maps-api-3 geolocation


【解决方案1】:

您可以尝试使用Google Maps Utility Library 中的Geolocation Marker。它没有箭头,但具有您想要的其他功能。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-06-14
    • 2013-05-02
    • 2013-12-28
    • 2013-08-31
    • 1970-01-01
    • 2013-01-28
    • 1970-01-01
    • 2013-05-28
    相关资源
    最近更新 更多