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

Want to show car path between two station in google map using HTML

本文关键字：两个 谷歌地图 HTML 路径 汽车 显示 之间      更新时间：2023-09-26

我有HTML文件，我有两个邮编一个为源，第二个为目的地。我想在HTML中显示两个站点之间的汽车路线。有没有人知道我怎么用谷歌地图来做这个?

如果你只想坚持使用HTML，你需要找出路线的编码折线，然后把它放在地图上。最简单的方法是使用Google Directions API获得概览折线(不是一条精确的线，但它做了它应该做的)，然后把它放在静态地图上。

如果你要用javascript使它动态，异步调用方向API，取折线，并把它放在谷歌地图上。这是如何在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;
}
相关文章：