具有PostGIS Query多层的NodeJS Leaflet

时间:2016-11-04 15:33:54

标签: node.js leaflet postgis

使用Nodejs,leaflet和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);

这些中的任何一个都能完美地完成,但是尝试加载这两个层根本不显示任何内容。最终我想要完成的是能够打开和关闭销售区域和州边界层。

感谢任何见解。

1 个答案:

答案 0 :(得分:0)

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

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]

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