Question

如何在Google地图中指出具体位置？我之前试过看过这些问题，但我找不到任何可以“帮助”我的东西。

的JavaScript

<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
  function initialize() {
    var mapCanvas = document.getElementById('map');
    var mapOptions = {
      center: new google.maps.LatLng(58.393584, 15.566656),
      zoom: 17,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(mapCanvas, mapOptions)
  }
  google.maps.event.addDomListener(window, 'load', initialize);
</script>

CSS

#map {       
width: 500px;
height: 400px;
float: left;
margin: 10px;
margin-top: 15px;
}

（忽略margin和float），它会放大到该位置但是如何添加指针呢？指针的图像会吗？可能是一个新手问题，但谢谢你能帮助我。

Answer 1

您错过了Marker对象对于标签，您可以使用maplabel.js

function initialize() {
  var mapCanvas = document.getElementById('map');
  var mapOptions = {
    center: new google.maps.LatLng(58.393584, 15.566656),
    zoom: 17,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(mapCanvas, mapOptions);

  // MARKER:
  var marker = new google.maps.Marker({
    position: mapOptions.center,
    label: "G",
    map: map
  });
  
  // LABEL:
  var mapLabel = new MapLabel({
    text: "Go here!",
    position: mapOptions.center,
    map: map,
    fontSize: 22,
    align: 'center'
  });

}
google.maps.event.addDomListener(window, 'load', initialize);

#map {       
  width: 500px;
  height: 400px;
  float: left;
  margin: 10px;
  margin-top: 15px;
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<script src="https://google-maps-utility-library-v3.googlecode.com/svn/trunk/maplabel/src/maplabel.js"></script>

<div id="map"></div>

Answer 2

我不会像这样使用谷歌地图API，而是亲自将聚合物用于谷歌元素，如google-map等。

聚合物是关于网络组件的，它非常简单，干净，而且非常简单。易于使用。

google maps API如何使用Polymer元素

的示例

<google-map latitude="37.77493" longitude="-122.41942" fit-to-markers>
  <google-map-marker latitude="37.779" longitude="-122.3892"
      draggable="true" title="This is a title"></google-map-marker>
  <google-map-marker latitude="37.777" longitude="-122.38911"></google-map-marker>
</google-map>

它非常简单灵活。

如果您有兴趣，可以在此处找到文档的链接：

https://elements.polymer-project.org/elements/google-map

如何指出Google地图中的特定位置？

2 个答案: