0

我可以在 Firefox 网络浏览器中显示来自 json 的标记，但不能在 crome 和 safari 中显示。perarps 它取决于我的 jquery 脚本的形式来检索 json？

我的jQuery代码是：

   (function() {
    window.onload = function() {

        // Creating a new map
        var map = new google.maps.Map(document.getElementById("map"), {
          center: new google.maps.LatLng(41.65, -0.88),
          zoom: 12,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });


        // Get  the JSON data from PHP script

var json ;
$.getJSON("http://myserver/down.php").done(function(data) {
  console.log(data);
   json = data;
});

alert( " Benvenuto " );


        // Creating a global infoWindow object that will be reused by all markers
        var infoWindow = new google.maps.InfoWindow();

        // Looping through the JSON data
        for (var i = 0, length = json.locations.length; i < length; i++) {

                var data = json.locations[i],
                latLng = new google.maps.LatLng(data.lat, data.long);

            var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                title: data.nombre,
                icon: iconBase + 'schools_maps.png'
                });


            (function(marker, data) {

                // Attaching a click event to the current marker
                google.maps.event.addListener(marker, "click", function(e) {
                    infoWindow.setContent(data.nombre);
                    infoWindow.open(map, marker);
                });


            })(marker, data);

        }

    }

})();

调用脚本的 HTML 代码是：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>MAPPA</title>
    <link type="text/css" href="css/style.css" rel="stylesheet" media="all" />

     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&v=3.8"></script>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>   

    <script type="text/javascript" src="map.js"></script>
  </head>
  <body>
    <h1>MAPPA PROVE</h1>
    <div id="map"></div>

  </body>
</html>

我没有尝试使用 Explorer。

提前感谢

4

1 回答 1

1

这里的第一件事： $.getJSON 是异步过程。因此，当获取“for”行时，数据可能尚未加载。

试试这个：

   (function() {
    window.onload = function() {

        // Creating a new map
        var map = new google.maps.Map(document.getElementById("map"), {
          center: new google.maps.LatLng(41.65, -0.88),
          zoom: 12,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });


        // Creating a global infoWindow object that will be reused by all markers
        function createPoints(json){
        var infoWindow = new google.maps.InfoWindow();

        // Looping through the JSON data
        for (var i = 0, length = json.locations.length; i < length; i++) {

                var data = json.locations[i],
                latLng = new google.maps.LatLng(data.lat, data.long);

            var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                title: data.nombre,
                icon: iconBase + 'schools_maps.png'
                });


            (function(marker, data) {

                // Attaching a click event to the current marker
                google.maps.event.addListener(marker, "click", function(e) {
                    infoWindow.setContent(data.nombre);
                    infoWindow.open(map, marker);
                });


            })(marker, data);
         }
        }


        // Get  the JSON data from PHP script

var json ;
$.getJSON("http://myserver/down.php").done(function(data) {
  console.log(data);
   json = data;
    createPoints(json);
});

    }

})();

我没有搜索其他人的错误，所以如果没有工作评论，我们可以再试一次。

于 2013-05-10T17:17:49.017 回答