在 OpenLayers4 中绘制两点之间的路线

Question

我想用 OpenLayers4 在两点之间画一条路线。

我知道我应该使用折线来完成，但我不知道如何将 long/lat 格式的坐标转换为折线 ol.geom.LineString 的

var polyline = [
        'hldhx@lnau`BCG_EaC??cFjAwDjF??uBlKMd@}@z@??aC^yk@z_@se@b[wFdE??wFfE}N',
        'fIoGxB_I\gG}@eHoCyTmPqGaBaHOoD\??yVrGotA|N??o[N_STiwAtEmHGeHcAkiA}^',
        'aMyBiHOkFNoI`CcVvM??gG^gF_@iJwC??eCcA]OoL}DwFyCaCgCcCwDcGwHsSoX??wI_E',
        'kUFmq@hBiOqBgTwS??iYse@gYq\cp@ce@{vA}s@csJqaE}{@iRaqE{lBeRoIwd@_T{]_',
        'Ngn@{PmhEwaA{SeF_u@kQuyAw]wQeEgtAsZ}LiCarAkVwI}D??_}RcjEinPspDwSqCgs@',
        'sPua@_OkXaMeT_Nwk@ob@gV}TiYs[uTwXoNmT{Uyb@wNg]{Nqa@oDgNeJu_@_G}YsFw]k',
        'DuZyDmm@i_@uyIJe~@jCg|@nGiv@zUi_BfNqaAvIow@dEed@dCcf@r@qz@Egs@{Acu@mC',
        'um@yIey@gGig@cK_m@aSku@qRil@we@{mAeTej@}Tkz@cLgr@aHko@qOmcEaJw~C{w@ka',
        'i@qBchBq@kmBS{kDnBscBnFu_Dbc@_~QHeU`IuyDrC_}@bByp@fCyoA?qMbD}{AIkeAgB',
        'k_A_A{UsDke@gFej@qH{o@qGgb@qH{`@mMgm@uQus@kL{_@yOmd@ymBgwE}x@ouBwtA__',
        'DuhEgaKuWct@gp@cnBii@mlBa_@}|Asj@qrCg^eaC}L{dAaJ_aAiOyjByH{nAuYu`GsAw',


        'uEeFymAssAkdAmhAyTcVkFeEoKiH}l@kp@wg@sj@ku@ey@uh@kj@}EsFmG}Jk^_r@_f@m',
        '~@ym@yjA??a@cFd@kBrCgDbAUnAcBhAyAdk@et@??kF}D??OL'
      ].join('');

      var route = /** @type {ol.geom.LineString} */ (new ol.format.Polyline({
        factor: 1e6
      }).readGeometry(polyline, {
        dataProjection: 'EPSG:4326',
        featureProjection: 'EPSG:3857'
      }));

      var routeCoords = route.getCoordinates();
      var routeLength = routeCoords.length;

我有几个点，基于如下坐标：

var lat1 = 40.385064;
var lng1 = 2.173403;

var lat2 = 41.385064;
var lng2 = 2.273403;

我从 Open Layers 网站上的 "Marker Animation" 示例中获取了代码。，因为我想根据我的 2 个点创建多段线，但找不到任何示例

Answer 1

如果您询问如何从坐标创建线要素，这就是您的做法。

var route = new ol.Feature();
var coordinates = [[2.173403, 40.385064], [2.273403,41.385064]];
var geometry = new ol.geom.LineString(coordinates);
geometry.transform('EPSG:4326', 'EPSG:3857'); //Transform to your map projection
route.setGeometry(geometry);

并且您可以使用 vectorLayer.getSource().addFeature(route);

将线特征添加到您的矢量图层

在 OpenLayers4 中绘制两点之间的路线

Drawing a route in OpenLayers4 between 2 points

openlayers

openstreetmap