OpenLayers 6：如何从api计算两点之间的距离（可单击）？

Question

我在api.py文件上声明了一些要点：

(...)
@app.route('/api/pontos/', methods=['GET'])
def get_pontos():
    return jsonify({
        'pontos': [
            [-44.3001,-2.52001, 3, "name1"],
            [-44.309468, -2.509284, 4, "name2"],
            [-44.307802, -2.557744, 5, "name3"],
(...)

我可以从中选择每个点，并在浏览器上显示它的一些特征

var selec = new ol.interaction.Select()
selec.getFeatures().on('add', function(e){

    var label = typeof (e.element.getProperties().text) != 'undefined' ? e.element.getProperties().text : ''
    if(label != ''){
        alert(e.element.getProperties().text)
    }

})

(...)

function loadPoints(){
    axios.get(`/api/pontos`)
        .then(function(response){
            if(response.status === 200){
                var coordsArray = response.data.pontos;

                coordsArray.map(coords =>{

                    var point = new ol.Feature({
                        geometry : new ol.geom.Point(ol.proj.fromLonLat(coords)), 
                        text : `Preco: ${coords[2]} reais, Bar:${coords[3]} `
                    });

                    point.setStyle(pointStyle);
                    vectorSource.addFeature(point)
                }); 

                //Fit nos pontos
                map.getView().fit(vectorSource.getExtent());
            }

        })
}

loadShape('ma')
loadPoints()

但是，如果我想单击两个点并计算它们之间的距离，以便可以在浏览器上显示它，该怎么办？

我尝试查看文档和其他一些问题，但似乎无法使它们适应我的特定问题。

Answer 1

您可以使用非常简单的getDistance（）函数来计算两个坐标之间的距离。

calculateDistance(toLonLat(first) , toLonLat(second));
function calculateDistance(src , dest ){
let finalmeasure = getDistance(src , dest);
//let finalmeasure = Math.round(line.getLength() * 100) / 100; //for rounding
console.log(finalmeasure); //in meter unit
}

最诚挚的问候