Question

我按照代码如何沿着地图的路径绘制折线，知道地图中存在的点将只给出直线如何沿着车道的路径

 <!DOCTYPE html>
    <html>
    <head>
        <title>Rotation example</title>
    </head>
    <body>
    <div style="width:80%; height:80%; position:fixed; border: 1px solid;" id="map"></div>
    <script src="http://openlayers.org/en/v3.11.2/build/ol.js"></script>
    <script>

        var lineString = new ol.geom.LineString([
            [103.986083,  1.350349],
            [103.985097, 1.349067]
        ]);
        lineString.transform('EPSG:4326', 'EPSG:3857');

        var lineLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
                features: [new ol.Feature({
                    geometry: lineString,
                    name: 'Line'
                })]
            }),
            style: new ol.style.Style({
                stroke: new ol.style.Stroke({
                    color: [255, 255, 0, 0.5],
                    width: 10
                })
            })
        });

        var view = new ol.View({
            center: ol.proj.transform([103.986908, 1.353199], 'EPSG:4326','EPSG:3857'),
            zoom: 18,
            rotation: 68*Math.PI/180
        });

        var map = new ol.Map({
            layers: [
                new ol.layer.Tile({
                    source: new ol.source.OSM()
                }),
                lineLayer
            ],
            target: 'map',
            controls: ol.control.defaults({
                attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
                    collapsible: false
                })
            }),
            view: view
        });



    </script>

    </body>
    </html>

是否有openlayer3提供的任何指导服务请指向样本来完成它

Answer 1

如果沿着车道有坐标，则可以使用MultiLineString而不是LineString。

Answer 2

您需要使用路由服务来执行此类操作。您可以设置自己的服务，也可以使用任何在线服务。 here您可以找到免费在线路由器的列表，并根据您的需求决定哪一个最好。从所选服务中获取根折线后，您可以解码（如果已编码）并在ol3地图中绘制线条。此外，根据您将要使用的服务，cos3还提供了一个用于以编码折线算法格式读取和写入数据的类，其中描述了here

在openlayer3中沿着地图的路径绘制折线

2 个答案: