javascript - 多个标记在我的本地服务器上工作，但标记在我的实时站点上不起作用。 http ://www. sierracrestweb.com/dev/

Question

下面是代码，在我的本地服务器上完美显示紫色图标，但标记未显示在我的网站上，我在谷歌上搜索并尝试替代方法，但仍然面临这个问题，我猜这是由于多次加载 API key 错误，但是如果出现这个错误该如何解决？因为我已经删除了所有脚本但仍然面临问题。

<script>
var map;
var marker;
var infowindow;
var red_icon =  'http://maps.google.com/mapfiles/ms/icons/red-dot.png' ;
var purple_icon =  'http://maps.google.com/mapfiles/ms/icons/purple-dot.png';
    var locations = <?php get_all_locations() ?>;

    function initMap() {
    var america = {lat: 37.09024, lng: -95.712891};
    infowindow = new google.maps.InfoWindow();
    map = new google.maps.Map(document.getElementById('map'), {
        center: america,
        zoom: 7
    });
  var infowindow = new google.maps.InfoWindow();

   var marker, i;

    var i ; 
    for (i = 0; i < locations.length; i++) {

        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i] 
    [2]),
            icon : purple_icon,
            map: map


        });
 google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
    }
 }

  <script async defer
  src="https://maps.googleapis.com/maps/api/js? 
  language=en&key=APIKEY&callback=initMap">
  </script>

Answer 1

如果标记创建在本地工作但在服务器上不起作用，那么它可能与代码本身无关。

我认为问题出在这一行。

var locations = <?php get_all_locations() ?>;

该函数很可能返回一个空白数组，因为 map 上没有绘制任何标记。

尝试在控制台中打印出返回数组的值，以确保您确实获得了正确的位置数组。

var locations = <?php get_all_locations() ?>;
console.log(locations);