Question

我想将引脚保持在Google地图的中心位置，同时用户可以移动地图并缩放。关键是当前GPS的位置（当然仍在中心）递归地返回值作为值。我发现了这个

Google Map API V2 - How do I keep a marker in the center of the screen while user is scrolling the map?

但是我没有返回当前的中心坐标。我正在寻找带代码的演示实现，但无法找到任何内容，非常感谢帮助。

Answer 1

从this example on daftlogic.com修改为使用标记而不是十字准线，将中心坐标放在页面上的HTML元素中。

要点：

标记绑定到地图的中心
'center_changed'用于更新页面上显示的坐标。

工作片段：

function initialize() {
  var crosshairShape = {
    coords: [0, 0, 0, 0],
    type: 'rect'
  };
  var latlng = new google.maps.LatLng(54.62279178711505, -5.895538330078125);
  var myOptions = {
    zoom: 12,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.SATELLITE,
    mapTypeControlOptions: {
      style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
    }
  };
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  var marker = new google.maps.Marker({
    map: map,
  });
  document.getElementById('coordinates').innerHTML = "<b>center coordinates</b>: " + map.getCenter().toUrlValue(6)
  google.maps.event.addListener(map, 'center_changed', function() {
    document.getElementById('coordinates').innerHTML = "<b>center coordinates</b>: " + map.getCenter().toUrlValue(6);
  });
  marker.bindTo('position', map, 'center');
}
google.maps.event.addDomListener(window, 'load', initialize);

html,
body,
#map_canvas {
  height: 500px;
  width: 500px;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>
<div id="coordinates"></div>

working jsfiddle

谷歌地图浮针在中心和返回位置

1 个答案: