0

我之前准备了一个 javascript,它显示了一些从 web 服务以 JSON 格式下载的标记。

代码是:

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>MAP</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_bar.js"></script>
  </head>
  <body>
    <h1>MAPPA</h1>
    <div id="map"></div>

  </body>
</html>

调用 map_bar.js:

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

        // Creating a new map
        var map = new google.maps.Map(document.getElementById("map"), {
            center: new google.maps.LatLng(80.650535,41.886146),
            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);
        console.log(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: 'beer.png'
                });


            (function(marker, data) {
                // Attaching a click event to the current marker
                    google.maps.event.addListener(marker, "click", function() {
            info = data.nombre+'<br/>'+data.offerta+'<br/>'+data.horario;
                        infoWindow.setContent(info);   //esto escibe las info
                        infoWindow.open(map, marker);
                });

            })
            (marker, data);

         }

        }


        // Get  the JSON data from PHP script

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

    }

})();

它可以工作,但是当我尝试将其集成到现有网页中时出现问题。我有一些部分并将相同的代码放在我的“地图部分”中,地图出现但没有标记。

将console.log(data) 放入getJSON 方法中并没有给出答案。这很奇怪,因为相同的代码在“独立”页面中工作。

有什么想法吗?提前致谢。

4

1 回答 1

1

jquery getJSON受同源策略约束,子域与主域不同域。

使用对子域中文件的相对引用可以解决此问题。

于 2013-06-11T11:34:35.157 回答