具有来自 PostGIS 查询的多层的 NodeJS Leaflet

Question

正在使用 Nodejs、传单和 PostGIS 开发一个新的地图项目。此时，我可以从 Postgis 加载和显示地图图块图层以及我们的销售代表区域。现在我正在尝试添加另一个层来显示所有美国县，也存储在 Postgresql 中。 Postgis 查询运行并在单独使用时显示，但我无法同时加载和显示。这是 nodejs 'routes/index.js':

的摘录

router.get('/map', function(req, res) {
var client = new pg.Client(conString); // Setup our Postgres Client
client.connect(); // connect to the client
var query = client.query(zone_query); // Run our Query
query.on("row", function (row, result) {
    result.addRow(row);
});
// Pass the result to the map page
query.on("end", function (result) {
    var data = result.rows[0].row_to_json; // Save the JSON as variable data
    res.render('map', {
        title: "Express API", // Give a title to our page
        zoneData: data // Pass data to the View
    });
});
});

router.get('/map', function(req, res) {
var client = new pg.Client(conString); // Setup our Postgres Client
client.connect(); // connect to the client
var query = client.query(counties_query); // Run our Query
query.on("row", function (row, result) {
    result.addRow(row);
});
// Pass the result to the map page
query.on("end", function (result) {
    var data2 = result.rows[0].row_to_json; // Save the JSON as variable data
    res.render('map', {
        title: "Express API", // Give a title to our page
        countyData: data2 // Pass data to the View
    });
});
});

并且来自 'view/map.pug'：

    script("text/javascript").
    $(document).ready(function(){
        var myData = !{JSON.stringify(zoneData)};
        var cntyData = !{JSON.stringify(countyData)};
        // Create variable to hold map element, give initial settings to map
        var map = L.map('map',{
            center: [39.7799642, -86.2728367],
            zoom: 6,
            //layers: [zones, counties]
        });

...然后再往下：

L.geoJson(myData,{
            style: zoneStyle,

            onEachFeature: function (feature, layer) {
                var ofc = JSON.stringify(feature.properties.office);
                var zn = JSON.stringify(feature.properties.zone);
                layer.bindPopup("office: " + ofc + "<br>" + "zone #" + zn);
               // layer.bindPopup("Zone #"+JSON.stringify(feature.properties.zone));
            }
        }).addTo(map);

        // Add county data to map
        L.geoJson(cntyData,{
            onEachFeature: function (feature, layer) {
                //var desc = JSON.stringify(feature.properties.descriptio);
                layer.bindPopup(desc);
            }
        }).addTo(map);

这些中的任何一个本身都可以完美地工作，但是尝试加载两个图层时什么也没有显示。最终我想要完成的是能够打开和关闭销售区和州县边界层。

如有任何见解，我们将不胜感激。

Answer 1

所以我遇到了同样的问题，在一些同事的帮助下想出了这个解决方案。

router.get('/', function (req, res) {
var client = new pg.Client(conString); // Setup our Postgres Client
client.connect(); // connect to the client

// creating an empty array for my row_to_json queries
var data = []

var resto_query = client.query(restoPoint_query); //connects to postgres so it can query up my request
resto_query.on("row", function (row, result) {
result.addRow(row);
});
resto_query.on("end", function (result) {
var resto_to_json = result.rows[0].row_to_json; // Save the JSON as variable data
data.push(resto_to_json); // push JSON data to data[]

var barrierQuery = client.query(barrier_query);
barrierQuery.on("row", function (row, result) {
    result.addRow(row);
});
barrierQuery.on("end", function (result) {
    var barrier_to_json = result.rows[0].row_to_json;
    data.push(barrier_to_json);

    res.render('map', {
      title: "Leaflet Test API", // Give a title to our page
      resto_point: data[0], // Pass data to the View
      barrier: data[1]

可能不是最好的解决方案，但暂时有效。

具有来自 PostGIS 查询的多层的 NodeJS Leaflet

NodeJS Leaflet with multiple layers from PostGIS Query

node.js

leaflet

postgis