Question

我有HTML文件，我有两个zipcode，一个用于源，第二个用于目标。我想用HTML显示两站之间的汽车路线。我可以知道如何使用谷歌地图做到这一点。

Answer 1

如果您只想坚持使用HTML，则需要弄清楚路线的编码折线，然后将其放在地图上。最简单的方法是使用Google Directions API获取概述折线（不是一条确切的线，但是它按照它应该做的那样），然后将它放在static map上。 / p>

如果您要使用javascript使其动态化，请对Directions API进行异步调用，将折线放在Google地图上。 This是如何在Google Maps v3上执行此操作的示例。

这个例子对于有趣的部分有点夸张：

function initialize() {
    var myLatlng = new google.maps.LatLng(51.65905179951626, 7.3835928124999555);
    var myOptions = {
        zoom: 8,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map"), myOptions);

    var setRegion = new google.maps.Polyline({
        path: <PATH FROM DIRECTIONS API HERE>,
        levels: <RESULT FROM DECODE LEVELS>,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2,
        map: map
    });
}

function decodeLevels(encodedLevelsString) {
    var decodedLevels = [];

    for (var i = 0; i < encodedLevelsString.length; ++i) {
        var level = encodedLevelsString.charCodeAt(i) - 63;
        decodedLevels.push(level);
    }
    return decodedLevels;
}

想要使用HTML在谷歌地图中的两个站之间显示汽车路径

1 个答案: