javascript - スナップしないことと組み合わせた道路にスナップする（GMapsv3）

Question

データベースにいくつかの場所（この場合は4つ）があり、地図上に表示しようとしています。グーグルマップより良い方法はありませんか？ただし、1つの問題があります。場所に加えて、場所がポリラインでスナップされるかどうかを決定する「is_snapped」がデータベースに保存されています。

これで、Dbから場所ごとにループする関数を作成しました。マップ上に配置する必要のあるマーカー（Latlngオブジェクト）と、0または1のいずれかであるスナップ変数（スナップの場合は1、スナップされていない場合は0）を指定します。

さて、この関数の基本は機能します。スナップする必要のない場所ではスナップせず、スナップする必要がある場所でもスナップします。でも; スナップすると、AからBまでの2本の線が表示されます。1本の線は道路にスナップされ、もう1本の線は道路にスナップされていません。したがって、どういうわけか、重複したオブジェクトが私の「パス」配列にプッシュされます。しかし、私は自分の機能に不具合を見つけることができないようです。

誰かがここで何が問題になっているのかを確認して確認できますか？

前もって感謝します！

function createLines(marker, snap) {
    if (!service) {
        service = new google.maps.DirectionsService();
    }

    if (snap != 0 && snap != 1) {
        snap = 0;
    }

    if (path.length > 0 && snap != 1) {
        path.push(marker);
    }

    if (path.length == 0) {
        path.push(marker);
        poly = new google.maps.Polyline({ map: map });
        poly.setPath(path);
    } else {
        service.route({
            origin: path[path.length - 1],
            destination: marker,
            travelMode: google.maps.DirectionsTravelMode.WALKING
        }, function(result, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                if(snap == 1) {
                    path = path.concat(result.routes[0].overview_path);
                }
                poly.setPath(path);
            }
        });
        distance = google.maps.geometry.spherical.computeLength(path);
    }
    return Math.round(distance);
}

注：マップはこの関数の前に作成されているため、存在し、適切な場所にマーカーが表示されます。失敗するポリラインだけ:-)

何が起こっているのかを知るために、スナップ/スナップ解除と分離の組み合わせを示す3枚の写真を含めたので、それがどのようになっているのかを見ることができます...

これは、スナップされた線とスナップされていない線の両方を含むマップです（コードは現在作成されているため） http://www.envyum.nl/stupid_map.png

これは、スナップされた部分が省略されたマップです（path = path.concat .....） http://www.envyum.nl/stupid_map_wo_snap.png

これが、スナップされたパーツとスナップされていないパーツのマップです（Path.push（marker）） http://www.envyum.nl/stupid_map_w_snap.png

これらの興味のために、これはcreateLines関数を呼び出す関数です。

function drawMap(locations) {
    if(locations) {
        var markers = [];
        for (var i in locations) {
            loc = locations[i].latlng.split(', ');
            //Create a marker and give it a id(used later on to identify the correct inputfield)
            var markerPos = new google.maps.LatLng(loc[0], loc[1]);
            var mrkr = new google.maps.Marker({
                position: markerPos,
                map: map,
                clickable: true,
                id: locations[i].tripId
            });

            //Create the lines between te markers
            createLines(markerPos, locations[i].is_snapped);
        }
    }
}