无法使用jquery加载整个新的Google地图

时间:2013-03-26 01:55:36

标签: php javascript jquery google-maps

我的页面上有一张Google地图和一个切换开关按钮。当点击切换时,我让它调用一个java脚本函数,它清除具有当前谷歌地图的div元素并加载另一个:

//clear div
        $('#putMap').empty();

        //call to get new friend list
        $('#putMap').load('getVisitMap.php?u=' + userID ,
            function() {
            alert("called load function");
        }); 

        return false;

我的访问php文件如下所示:

$userID = $_GET['u'];
    //Get all breweries

    echo "<div id=\"map_canvas\" style=\"width: 600px; height: 400px;\"></div>";


    echo '<script type="text/javascript">
    var locations = [';

    //count unique breweries
    ***mysql call is here****

    echo "before for loop";

    for( $i = 0; $i < $breweryNum; $i++){
        $row = $resultBrew ->fetch_assoc();
        $brewery = $row['beerBrewery'];
        $long = $row['longi'];
        $lat = $row['lat'];

        $breweryURL = "breweryPage.php?id=$breweryID";


        echo "['$brewery', $lat, $long] ";

        //add camas if not last one
        if($i !=  $breweryNum - 1 ){
            echo   ',';

        }

    }

        echo ' 

        ];

    var map = new google.maps.Map(document.getElementById(\'map_canvas\'), {
      zoom: 10,
      center: new google.maps.LatLng(-33.92, 151.25),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });


        var bounds = new google.maps.LatLngBounds();
    var infowindow = new google.maps.InfoWindow();

    var marker, i;

    for (i = 0; i < locations.length; i++) {
        var position = new google.maps.LatLng(locations[i][1], locations[i][2]);  
      marker = new google.maps.Marker({
        position: position,
        map: map
      });



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

      bounds.extend(position);

    } //end for loop


    map.fitBounds(bounds);


  </script>

        ';

当我查看网络中的chrome中的inspect元素以查看getVisitMap.php文件的响应时它只显示:

<div id="map_canvas" style="width: 600px; height: 400px;"></div><script type="text/javascript">
    var locations = [

我的回声我应该展示更多的代码。

以下是原始php页面的更多代码:

$page->content .= "<div id = \"putMap\">
<div id=\"map_canvas\" style=\"width: 600px; height: 400px;\"></div>";  
$map = createMap($userID);


$page->content .= "

$map
</div>
"; 

0 个答案:

没有答案