Question

我想在道路上绘制折线，并根据特定的道路速度限制显示不同颜色的折线，如下所示：

是否可以在这里实现此map API？

$data.value.[0].start.dateTime

Answer 1

您的问题有两种解释。我将尝试同时回答这两个问题，以便您可以选择自己的打算。希望对您有帮助！

如何绘制具有不同颜色段的路线- H.geo.LineString用于实现此目的。请参阅https://developer.here.com/documentation/maps/topics_api/h-geo-linestring.html#h-geo-linestring。您还可以阅读本文（https://developer.here.com/blog/who-wants-ice-cream-a-here-maps-api-for-javascript-tutorial-part-4-advanced-routing），他们尝试使用H.geo.Strip（已弃用并由H.geo.LineString代替）实现相同的目的。
如何获取路线中每个链接的速度限制- 使用以下示例中给出的路由API。检查How to get SpeedLimit in HERE API
中的答案
https://route.cit.api.here.com/routing/7.2/calculateroute.json?jsonAttributes=1&waypoint0=51.31854,9.51183&waypoint1=50.11208,8.68342&departure=2019-01-18T10:33:00&routeattributes=sh,lg&legattributes=li&linkattributes=nl,fc&mode=fastest;car;traffic:enabled&app_code=xxx&app_id=xxx

Answer 2

为您的路由请求使用routeattributes：“ shape”，您可能会如下所示获得每个路段和相关的速度限制：

       let route = res.body.response.route[0];
        let legs = route.leg;
        let links = [];
        legs.forEach(leg => {
            Object.assign(links, leg.link);
        });
        console.log("#links", links.length);

        links.forEach(link => {
            let sl = link.speedLimit; // in m/sec
            let shape = link.shape; // shape to draw

            let style = {
                lineWidth: 4,
                strokeColor: "yellow"
            };
            if (sl < 50 * 1000 / 3600)
                style.strokeColor = "red";
            else if (sl < 90 * 1000 / 3600)
                style.strokeColor = "orange";
            else
                style.strokeColor = "green";

            let line = new H.geo.LineString();
            shape.forEach(latlng => {
                let coord = latlng.split(",");
                line.pushLatLngAlt(coord[0], coord[1]);
            });

            let polyline = new H.map.Polyline(line, {
                style: style
            });

            /* group created previously as
               group = new H.map.Group();
               map.addObject(group);
            */
            group.addObject(polyline);

        });

只需根据速度限制根据自己的样式独立绘制每个形状。

使用HERE API绘制具有不同颜色的多条折线

2 个答案: