0

我对谷歌地图很陌生。在我的项目中,我基本上复制了使用我的 api 密钥的热图示例,替换为从Pastie.orgtaxiData中可用的后端提取的数据。从服务器端提取数据的 ajax 调用如下:

 <script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?key=<c:out value="${key}"/>&sensor=false&libraries=visualization">
</script>
 <script>
 var map, pointarray, heatmap;
    var taxiData = [];

    $(function(){
    var d = "2013-08-09T05:51:15Z";
    var postDate = new Date(d);
    var later =new Date(postDate);
    var earlier20 = new Date(later);
    later.setSeconds(later.getSeconds()+ 40);
    $.ajax({
    url: "<spring:url value="/streamview/do/retrieve_coordinates"/>",
    type: "post",
    data:{
    "startTime": earlier20.toISOString(),
    "endTime": later.toISOString()
    }

    }).done(function (data) {

    for(d in data){
         taxiData.push(new google.maps.LatLng(parseFloat(d.lat),parseFloat(d.lng)));
    }



    }).fail(function () {
    alert("FAILED");
    }).always(function(){


    });

     function initialize() {
        var mapOptions = {
            zoom: 7,
            center: new google.maps.LatLng(8.300616,-0.922852),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById('edowmis-map'),
                mapOptions);

        var pointArray = new google.maps.MVCArray(taxiData);

        heatmap = new google.maps.visualization.HeatmapLayer({
            data: pointArray
        });

        heatmap.setMap(map);
    }

    function toggleHeatmap() {
        heatmap.setMap(heatmap.getMap() ? null : map);
    }

    function changeGradient() {
        var gradient = [
            'rgba(0, 255, 255, 0)',
            'rgba(0, 255, 255, 1)',
            'rgba(0, 191, 255, 1)',
            'rgba(0, 127, 255, 1)',
            'rgba(0, 63, 255, 1)',
            'rgba(0, 0, 255, 1)',
            'rgba(0, 0, 223, 1)',
            'rgba(0, 0, 191, 1)',
            'rgba(0, 0, 159, 1)',
            'rgba(0, 0, 127, 1)',
            'rgba(63, 0, 91, 1)',
            'rgba(127, 0, 63, 1)',
            'rgba(191, 0, 31, 1)',
            'rgba(255, 0, 0, 1)'
        ]
        heatmap.setOptions({
            gradient: heatmap.get('gradient') ? null : gradient
        });
    }

    function changeRadius() {
        heatmap.setOptions({radius: heatmap.get('radius') ? null : 20});
    }

    function changeOpacity() {
        heatmap.setOptions({opacity: heatmap.get('opacity') ? null : 0.2});
    }

    google.maps.event.addDomListener(window, 'load', initialize);

我不明白为什么它没有显示任何可识别的数据作为我传递给它的数据。javascript 中没有错误(没有萤火虫错误),但我的地图只是一个简单的地图,就好像没有数据传递给它一样。我究竟做错了什么?

4

1 回答 1

0

你有一个关闭</script>然后直接跳进 JS 没有打开<script>时你这样做var map, pointarray, heatmap;
同样,最后你在你之后有一些关闭的 JS</script>

</script>

    });

这可能只是这个问题的复制粘贴错误,而不是实际代码中的错误。

添加实际生成的 JS 代码也可能是有益的,例如 lat/lng 坐标是否有错误?

于 2013-09-09T14:06:40.897 回答