Google maps api 3 无法绘制或显示我的多段线

我尝试根据以下示例绘制多段线：

将显示“我的地图”，也将显示标记，但多段线未绘制或不可见。 我不知道怎么了

我的javascript是：

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=geometry"></script>

$( document ).ready(function($) {

    var map;
    var poly;
    var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
    var ndgIconBase = 'http://example.com/img/';
    var clickMarker;

    nextWaypoint = parseInt(document.getElementById('agpoiwaypoints_size').innerHTML, 10);
    countWaypoint = nextWaypoint;

    function initialize() {

        var mapCanvas = document.getElementById('map-canvas');

        var content;
        content = document.getElementById('agpoi-0-lat').innerHTML
        var lat0 = parseFloat(content.substr(content.indexOf(":")+1));

        content = document.getElementById('agpoi-0-lng').innerHTML
        var lng0 = parseFloat(content.substr(content.indexOf(":")+1));

        content = document.getElementById('agpoi-1-lat').innerHTML
        var lat1 = parseFloat(content.substr(content.indexOf(":")+1));

        content = document.getElementById('agpoi-1-lng').innerHTML
        var lng1 = parseFloat(content.substr(content.indexOf(":")+1));

        var mapOptions = {
          center: new google.maps.LatLng((lat1 + lat0) / 2, (lng1 + lng0) / 2),
          zoom: 18,
          mapTypeId: google.maps.MapTypeId.ROADMAP

        }

        map = new google.maps.Map(mapCanvas, mapOptions);

        var polyOptions = {
            strokeColor: '#000000',
            strokeOpacity: 1.0,
            strokeWeight: 3,
            map: map
        };

        poly = new google.maps.Polyline(polyOptions);

        new google.maps.Marker({
          position: {lat: lat0, lng: lng0},
          map: map,
          icon: ndgIconBase + 'myLogo.png'
        });    

        new google.maps.Marker({
            position: {lat: lat1, lng: lng1},
            map: map,
            icon: ndgIconBase + 'myLogo.png'
        });

        google.maps.event.addListener(map, 'click', function(e) {
            placeMarker(e.latLng, map);
        });

        var position = {lat: lat0, lng: lng0};

        var path = poly.getPath();
        path.push(position);

        var content;
        for (i = 0; i < countWaypoint; i++) {

            content = document.getElementById("agpoiwaypoints-" + i + "-latitude").value;
            lat = parseFloat(content);

            content = document.getElementById("agpoiwaypoints-" + i + "-longitude").value;
            lng = parseFloat(content);

            position = {lat: lat, lng: lng};

            new google.maps.Marker({
                position: position,
                map: map
            });

            path = poly.getPath();
            path.push(position);

        }

        position = {lat: lat1, lng: lng1};

        path = poly.getPath();
        path.push(position);

    }

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

    function placeMarker(position, map) {
        if (clickMarker == 0) {
            clickMarker = new google.maps.Marker({
                position: position,
                map: map
            });
        } else {
            clickMarker.setPosition( position );
        }
    }  

    $("body").on("click", ".remove_agpoiwaypoint", function (e) {
        e.preventDefault();

    });

    $("body").on("click", ".add_agpoiwaypoint", function (e) {
        e.preventDefault();
        var path = poly.getPath();
        var position = clickMarker.getPosition();
        path.push(position);
    });

});

$（文档）.ready（函数（$）{
var映射；
var-poly；
iconBase变量https://maps.google.com/mapfiles/kml/shapes/';
var ndgIconBasehttp://example.com/img/';
var点击标记；
nextWaypoint=parseInt（document.getElementById（'agpoiwaypoints_size'））.innerHTML，10）；
countWaypoint=下一个点；
函数初始化（）{
var mapCanvas=document.getElementById（'map-canvas'）；
var含量；
content=document.getElementById（'agpoi-0-lat'）.innerHTML
var lat0=parseFloat（content.substr（content.indexOf（“：”）+1））；
content=document.getElementById（'agpoi-0-lng'）.innerHTML
var lng0=parseFloat（content.substr（content.indexOf（“：”）+1））；
content=document.getElementById（'agpoi-1-lat'）.innerHTML
var lat1=parseFloat（content.substr（content.indexOf（“：”）+1））；
content=document.getElementById（'agpoi-1-lng'）.innerHTML
var lng1=parseFloat（content.substr（content.indexOf（“：”）+1））；
变量映射选项={
中心：新的google.maps.LatLng（（lat1+lat0）/2，（lng1+lng0）/2），
缩放：18，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=新的google.maps.map（mapCanvas，mapOptions）；
var多选项={
strokeColor:“#000000”，
笔划不透明度：1.0，
冲程重量：3，
地图：地图
};
poly=新的google.maps.Polyline（多选项）；
新的google.maps.Marker({
位置：{lat:lat0，lng:lng0}，
地图：地图，
图标：ndgIconBase+'myLogo.png'
});    
新的google.maps.Marker({
位置：{lat:lat1，lng:lng1}，
地图：地图，
图标：ndgIconBase+'myLogo.png'
});
google.maps.event.addListener（映射，'click'，函数（e）{
地点标记（如板条、地图）；
});
变量位置={lat:lat0，lng:lng0}；
var path=poly.getPath（）；
路径推（位置）；
var含量；
对于（i=0；i

当您执行

path=poly.getPath（）时

您只需获取一个数组并将其分配给名为

path

的变量。然后当你做

path.push（位置）时您只是在向该变量中添加内容。。。它不会更新多段线的路径

相反，您也需要更新多段线，例如，您也可以这样做

poly.setPath(path);

你说得对，这是我在修改代码添加更多功能后才意识到的。