Question

我已经使用API v3集成了Google地图，一切正常但是我收到了一些控制台错误，想知道是否有人可以指出原因。

在Chrome上我得到：未捕获的TypeError：无法读取null VM262的属性'lat'：13（匿名函数）VM262：13T.trigger main.js：15N.Hc VM261：137（匿名函数）main.js：13T.trigger main.js：15N。 Xl VM261：122（匿名函数）

在Firefox上我得到： TypeError：s为null

基于阅读其他答案，看起来dom在初始化时没有完全加载，但这似乎并非如此，因为我在加载时运行它。我的代码在下面，如果有人能指出我为什么会出现这些错误的方向（一切似乎都正常工作！）那么我将非常感激（这里有一些PHP代码用于将db变量插入到JS）：

var map;
var infos = [];
var ib = new InfoBox();
var infowindow;

function initialize() {
    var contentString = '';
    infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    map = new google.maps.Map(document.getElementById('map-canvas'));
    var address = 'Netherlands';
    var geocoder = new google.maps.Geocoder();
       geocoder.geocode( { 'address': address}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            map.fitBounds(results[0].geometry.viewport);
          }
        });
    var markers = [
    [1, '52.350785','5.264702', 2, 'Almere', '01345'],[1, '52.992753','6.564228', 2, 'Assen', '012345678']
    ];
    for (var i = 0; i < markers.length; i++) {
        setMarkers(map, markers[i]);
    }
}

function setMarkers(map, beach) {
    var image = new google.maps.MarkerImage('/img/marker.png',
      // This marker is 20 pixels wide by 32 pixels tall.
      new google.maps.Size(21, 34),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is the base of the flagpole at 0,32.
      new google.maps.Point(5, 34));

    var html = '<div class="phoney">'+beach[4]+'<br>'+beach[5]+'<\/div>';
    var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
    var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    icon: image,
    content:html,
    title: beach[4],
    zIndex: beach[3]
    });

    var boxText = document.createElement("div");
    boxText.style.cssText = "border: 2px solid #4a5461; margin-top: 8px;background: #ffffff; padding: 5px;font-family: \'ff-din-web-n6\',\'ff-din-web\',sans-serif; font-size: 17px; color: #4a5461;";
    boxText.innerHTML = beach[4] + '<br>' + beach[5];

    var myOptions = {
    content:boxText,
    disableAutoPan: false,
    maxWidth: 0,
    pixelOffset: new google.maps.Size(-140, 0),
    zIndex: null,
    boxStyle: {
        width: "200px"
    },
    closeBoxMargin: "13px 5px 2px 2px",
    closeBoxURL: "/img/close.png",
    infoBoxClearance: new google.maps.Size(1, 1),
    isHidden: false,
    pane: "floatPane",
    enableEventPropagation: false
    };

    google.maps.event.addListener(marker, "click", function (e) {
    ib.setOptions(myOptions);
    ib.open(map, marker);
    });
}

$( document ).ready(function() {
    google.maps.event.addDomListener(window, 'load', initialize);
});

非常感谢，

戴夫

Answer 1

戴夫，

确保lat，long是十进制值，如下：

var center = {lat：-25.363，lng：131.044};

谷歌地图API js错误

1 个答案: