Here地图：onclick使用Here地图在两点之间添加曲线？答案

【问题标题】：Here maps: onclick add Curved line between two points using Here maps?Here地图：onclick使用Here地图在两点之间添加曲线？
【发布时间】：2022-11-04 14:56:34
【问题描述】：

此处添加了单击绘制 2 点之间的折线的代码。需要帮助我们如何在两个地理位置之间添加曲线/弧线。

          // add map
          var defaultLayers = this.platform.createDefaultLayers();
          var map = new H.Map(document.getElementById('map'),
            defaultLayers.vector.normal.map,{
               center: {lat:21, lng:72},
               zoom: 7,
               pixelRatio: window.devicePixelRatio || 1
            });
            var lineString = new H.geo.LineString();
            const mapevents = new H.mapevents.MapEvents(map);

            // enable the tap event system
            this.map.addEventListener("tap", (event: any) => {
              const position = map.screenToGeo(event.currentPointer.viewportX, 
              event.currentPointer.viewportY);
              const marker = new H.map.Marker(position);
               map.addObject(marker);

              //push point to strip
              lineString.pushPoint(position);
              console.log(this.lineString);

              //create the line
              map.addObject(new H.map.Polyline(
                lineString, { style: { lineWidth: 4 }}
              ));
            })```

【问题讨论】：

标签： javascript angular typescript here-api heremaps

【解决方案1】：

没有任何直接的方法，但您可以使用以下公式：

var D2R = Math.PI / 180;
var R2D = 180 / Math.PI;

var Coord = function(lon, lat) {
    this.lon = lon;
    this.lat = lat;
    this.x = D2R * lon;
    this.y = D2R * lat;
};

Coord.prototype.view = function() {
    return String(this.lon).slice(0, 4) + ',' + String(this.lat).slice(0, 4);
};

Coord.prototype.antipode = function() {
    var anti_lat = -1 * this.lat;
    var anti_lon = (this.lon < 0) ? 180 + this.lon : (180 - this.lon) * -1;
    return new Coord(anti_lon, anti_lat);
};

var LineString = function() {
    this.coords = [];
    this.length = 0;
};

LineString.prototype.move_to = function(coord) {
    this.length++;
    this.coords.push(coord);
};

var Arc = function(properties) {
    this.properties = properties || {};
    this.geometries = [];
};

Arc.prototype.json = function() {
    if (this.geometries.length <= 0) {
        return { 'geometry': { 'type': 'LineString', 'coordinates': null }, 'type': 'Feature', 'properties': this.properties };
    } else if (this.geometries.length == 1) {
        return { 'geometry': { 'type': 'LineString', 'coordinates': this.geometries[0].coords }, 'type': 'Feature', 'properties': this.properties };
    } else {
        var multiline = [];
        for (var i = 0; i < this.geometries.length; i++) {
            multiline.push(this.geometries[i].coords);
        }
        return { 'geometry': { 'type': 'MultiLineString', 'coordinates': multiline }, 'type': 'Feature', 'properties': this.properties };
    }
};

Arc.prototype.strip = function() {
    var s = H.geo.Strip ? new H.geo.Strip() : new H.geo.LineString();
    for (var i = 0; i < this.geometries.length; i++) {
        if (this.geometries[i].coords.lenght !== 0) {
            var coords = this.geometries[i].coords;
            for (var j = 0; j < coords.length; j++) {
                var p = new H.geo.Point(coords[j][1], coords[j][0]);
                s.pushPoint(p);
            }
        }
    }
    return s;
}

详细示例，我创建了一个示例，请查看-https://demo.support.here.com/examples/v3.1/geodesic_polyline

【讨论】：