1

有谁知道如何使用 JQUERY AJAX 加载 Google Maps V3?下面是我的部分代码。我根据用户搜索词从 twitter API 检索一些推文,我想在谷歌地图上加载用户的位置。这个部分代码写在 index.php 中,我使用表单来获取文本字段的值。但是当我尝试加载它时,地图没有出现。所以我尝试使用视图源复制所有 html 代码并将它们放在另一个 html 文件中并再次加载。地图出现。问题是使用表单时地图不起作用以及如何使用 JQUERY AJAX 加载它。我将 showMap() 函数放在按钮 onclick 事件中,并使用表单来检索文本字段值。

谁能给我一些想法或有用的链接来解决我的问题,以便我参考?

提前致谢...

    function initialize() {
            var latlng = new google.maps.LatLng(52.56952058,-1.16262487);
            var myOptions = {
                zoom: 2,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };


            var map = new google.maps.Map(document.getElementById("mapContainer"), 
            myOptions);

<?php
for ($i = 0; $i < count($tweetList); $i++)
{

echo "var point$i = new google.maps.LatLng(". $tweetList[$i]->getLat(). ",". $tweetList[$i]->getLng().");\n";

echo "var marker$i = new google.maps.Marker({position: point$i, 
          map: map});\n";

}

?>

function showMap() {
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
            document.body.appendChild(script);
        }   
4

1 回答 1

0

我不知道 twitter api,但您的代码应该类似于下面的代码,以便使用 jQuery 和 ajax 在浏览器端获取您的 twitter 提要。

function init() {
    var latlng = new google.maps.LatLng(52.56952058,-1.16262487);
    var myOptions = {
        zoom: 2,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("mapContainer"), myOptions);
    getTweets();
}

function getTweets() {
    $.post('http://www.Twitter.com/endpoint',{term:'tweet search'}, function(data) {
        // assuming that twitter returns a JSON feed
        data = JSON.parse(data)
        // I don't know the twitter api, but here is the general idea:
        for (var i = 0; i<data.tweets.length; i++) {
            var tweet = data.tweets[i];
            var marker = new google.maps.Marker({options:'here'});
        }
    });
}

$(document).ready(function(){
    var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
        document.body.appendChild(script);
});
于 2013-01-26T14:11:09.543 回答