在谷歌地图中动态添加更多结果

时间:2013-04-15 11:55:07

标签: php javascript jquery google-maps google-maps-api-3

我这几个小时的工作但没有成功 此代码工作正常一次,并在地图上添加100条记录。然后我想在db 100之后添加更多来自db的结果。我该怎么做才能引导我。这是代码 我也尝试使用ajax但js​​on损坏后结果从php返回,所以这对我来说也不起作用。

<div class="span12 geoData">

    <?php

    $db = new db();
    $data = array();
    $tweets = array();
    $counter = 0;

    $query = "SELECT * FROM `tweets` WHERE `geo_lat` != 0 LIMIT 100";
    $results = $db->select($query);

    $count = mysqli_num_rows($results);

    while (($row = mysqli_fetch_assoc($results)) !=FALSE) {
        $tweets[$counter]['tweet_text'] =  $row['tweet_text'];
        $tweets[$counter]['geo_lat'] =  $row['geo_lat'];
        $tweets[$counter]['geo_long'] =  $row['geo_long'];

        $counter++;
    }

    $data['count'] = $count;
    $data['tweets'] = $tweets;


    $jsonData = json_encode($data);

    ?>
    <script src="mapsApi.js"></script>
    <script src="markerclusterer_compiled.js"></script>
    <script type="text/javascript">


    var data = <?php echo $jsonData; ?>;

    function initialize() {       

    var center = new google.maps.LatLng(39.744408452010475, -100.15602825000002);

    var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: center,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    infowindow = new google.maps.InfoWindow({
    content: "holding..."
    });

    var markers = [];
    for (var i = 0; i < data.count; i++) {
    var contentSTR = '<div id="info"><p><span>Ttitle:</span> '+ data.tweets[i].tweet_text + '</p></div>';
    var dataTweets = data.tweets[i];
    var latLng = new google.maps.LatLng(dataTweets.geo_lat,
                                      dataTweets.geo_long);
    var marker = new google.maps.Marker({
        position: latLng,
        html: contentSTR,           
    });

    google.maps.event.addListener(marker, 'click', function() {
                infowindow.setContent(this.html);
        infowindow.open(map, this);

    });

    markers.push(marker);
    }
    var markerCluster = new MarkerClusterer(map, markers); 
}                         
google.maps.event.addDomListener(window, 'load', initialize);


</script>

<div id="map-container">
    <div id="map"></div>
</div>              


</div>

0 个答案:

没有答案