Question

我正在尝试为Google地图添加折线，以便在更新位置时，点之间会有一条线。我有以下代码从地理位置获取lat lng，通过ajax将其发送到数据库，然后将数据添加到折线。折线没有显示，我在控制台中收到的错误信息是：

InvalidValueError：不是数组 http://maps.google.com/maps-api-v3/api/js/22/2/intl/en_gb/main.js 第24行

<script>
$(document).ready(function() {
          // Initialize the Google Maps API v3
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 17,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var marker = null;

    function autoUpdate() {
      navigator.geolocation.getCurrentPosition(function(position) {  
        var newPoint = new google.maps.LatLng(position.coords.latitude, 
                                              position.coords.longitude);

        if (marker) {
          // Marker already created - Move it
          marker.setPosition(newPoint);
        }
        else {
          // Marker does not exist - Create it
          marker = new google.maps.Marker({
            position: newPoint,
            map: map
          });
        }

        console.log(newPoint);

        longi = newPoint['K'];
        lati = newPoint['G'];

        var ajaxurl = '<?php echo WEB_URL; ?>includes/send-coords.php',

        data =  {
            'latitude': lati,
            'longitude' : longi
        };
        $.post(ajaxurl, data, function (response) {

        });

            // Creates the polyline object
          var polyline = new google.maps.Polyline({
            map: map,
            path: newPoint,
            strokeColor: '#0000FF',
            strokeOpacity: 0.7,
            strokeWeight: 1
          });

        // Center the map on the new position
        map.setCenter(newPoint);
      }); 

      // Call the autoUpdate() function every 5 seconds
      setTimeout(autoUpdate, 5000);
    }

autoUpdate();
});
</script>

Answer 1

不使用Google Maps Javascript API（newPoint['K']，newPoint['G']）的未记录属性，他们可以（并且确实）随着每个版本的更新而变化API。
错误消息不言自明。 newPoint不是数组，path的{{1}}选项应该是数组。

Answer 2

path参数是Type：MVCArray<LatLng>|Array<LatLng|LatLngLiteral>

见PolylineOptions

因此，您需要保存数组中的所有newPoint。然后用作折线的路径。

查看编辑过的小提琴： http://jsfiddle.net/4mtyu/647/

将折线添加到谷歌地图

2 个答案: