Question

我想在谷歌地图上添加一个标记，我有这个代码

<script type="text/javascript"
  src="https://maps.googleapis.com/maps/api/js?key=myKey&sensor=true">
</script>
<script type="text/javascript">
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(56.33481154165235, 11.107177734375),
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    setMarker();
  }

  // Function for adding a marker to the page.
function addMarker(location) {
    marker = new google.maps.Marker({
        position: location,
        map: map
    });
}

// Testing the addMarker function
function setMarker() {
       CentralPark = new google.maps.LatLng(55.671389288295465, 12.5601196289062);
       addMarker(CentralPark);
}


google.maps.event.addDomListener(window, 'load', initialize);
</script>

这显示地图，但不显示标记。

提前感谢您的帮助！

Answer 1

请尝试以下代码

<script type="text/javascript">
var marker,
    CentralPark = new google.maps.LatLng(55.671389288295465, 12.5601196289062);

function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng(56.33481154165235, 11.107177734375),
        zoom: 7,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    marker = new google.maps.Marker({
        position: CentralPark,
        map: map,
        animation: google.maps.Animation.DROP
    });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 2

问题是map是初始化函数中的局部变量，因此其他函数无法使用它。使它成为一个全局变量。

或者将地图对象作为参数传递给setMarker / addMarker函数。

此外，我不确定为什么你有addMarker和setMarker作为单独的函数（除非你稍后将扩展这些功能，这些功能可以解释为什么你会以这种方式拆分它们）。我在这个答案中将它们合并为一个，虽然从技术上讲，你的方法没有任何问题（只是非全局map是你的问题）。

试试这个：

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=myKey&sensor=true">
</script>
<script>
  // make this global:
  var map;

  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(56.33481154165235, 11.107177734375),
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    addMarker();
  }

  // Function for adding a marker to the page.
function addMarker() {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(55.671389288295465, 12.5601196289062),
        map: map
    });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

在浏览器中将标记添加到谷歌地图时出现问题

2 个答案: