如何下载本地数组或添加到postgres数据库

Question

我在尝试将地理位置数组下载到我的本地存储或者更好地将它们附加到 postgres/postgis 数据库时遇到困难。 loc 的控制台打印正常，但是当我看到下载的 geojson 时，它是空的。我错过了什么吗？

var loc= new Array();

//click event for map
map.on("click", function(e){

    //add marker to click location
    var mp = new L.Marker([e.latlng.lat, e.latlng.lng]).addTo(map);

    //alert the location of the place           
    var pos= mp.getLatLng();
    alert(pos);

    apt_loc= new Array();
    apt_loc.push(pos);
    console.log(apt_loc);

    //for each item in apt_loc, add it to loc
    apt_loc.forEach(item=> loc.push(apt_loc));
    console.log(loc);

});
function saveToFile(content, filename) {
      var file = filename + '.geojson';
      saveAs(new File([JSON.stringify(content)], file, {
        type: "text/plain;charset=utf-8"
      }), file);
    } 

saveToFile(loc,'test');

Answer 1

这是您可以遵循的示例。一切都在 html 文件中，以便于测试和 post。在示例中，我使用绘制交互来获取地图的点，而不是单击事件。我想在评论中提到的是，你在得到任何一点之前就保存了文件。我添加了一个按钮作为事件示例 post先于积分生成。

<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/css/ol.css" type="text/css">
    <style>
      .map {
        height: 400px;
        width: 100%;
      }
            #a { display: none; }
    </style>
    <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.1.1/build/ol.js"></script>
    <title>Download Points</title>
  </head>
  <body>
    <h2>Click on Map to add Points then Download to file</h2>
    <div id="map" class="map"></div>
    <button onclick="downloadPoints()">Download</button>
    <p id="p"></p>

    <script type="text/javascript">
    var downloadPoints = function () {
        var file = new Blob([getGeoJSONText()], {type: 'text/plain'});
        if (window.navigator.msSaveOrOpenBlob)
            window.navigator.msSaveOrOpenBlob(file, filename);
        else {
            var a = document.createElement('a');
            var url = URL.createObjectURL(file);
            a.href = url;
            a.download = 'points.geojson';
            document.body.appendChild(a);
            a.click();
            setTimeout(function() {
                document.body.removeChild(a);
                window.URL.revokeObjectURL(url);  
            }, 0); 
        }
    }
    var source = new ol.source.Vector({wrapX: false});
    var vector = new ol.layer.Vector({
        source: source
    });
    var getGeoJSONText = function () {
        var format = new ol.format.GeoJSON();
        return format.writeFeatures(
            source.getFeatures(),
            {
                dataProjection: 'EPSG:4326',
                featureProjection: 'EPSG:3857'
            });
    }
    var map = new ol.Map({
        target: 'map',
        layers: [
            new ol.layer.Tile({
                source: new ol.source.OSM()
            }),
            vector
        ],
        view: new ol.View({
            center: ol.proj.fromLonLat([37.41, 8.82]),
            zoom: 4
        })
    });
    var draw = new ol.interaction.Draw({
        source: source,
        type: 'Point'
    });
    draw.on('drawend', function () {
        document.getElementById('p').innerText = getGeoJSONText();
    });
    map.addInteraction(draw);
    </script>

  </body>
</html>

如何下载本地数组或添加到postgres数据库

How to download local array or add to postgres database

javascript

arrays

geolocation