我正在尝试在Node.js中设置一个Web服务器,该服务器提供使用MapboxGL JS在浏览器中显示的矢量图块。矢量图块的数据存储在PostGIS数据库中。
我收到一个geojson文件,并对其进行处理,以创建带有下一个句子的数据库:CREATE TABLE IF NOT EXISTS countries ( table_id SERIAL,properties jsonb not null,geom geometry(GeometryZ,4326),primary key (table_id));
我的当前设置似乎朝着正确的方向发展,因为我可以看到矢量图块正在加载并显示在浏览器中。但是,渲染结果不正确(这是我的地图的一部分的屏幕截图):
呈现错误的内容是什么?
代码如下:
var express = require('express');
var SphericalMercator = require('sphericalmercator');
var mercator = new SphericalMercator({
size: 256 //tile size
});
const { pool } = require('../postgressql/config');
var app = express();
app.get('/:namelayer/:z/:x/:y.pbf',(req,res,next) => {
var options = {
x: parseInt(req.params.x),y: parseInt(req.params.y),z: parseInt(req.params.z),layerName: req.params.namelayer
};
const bbox = mercator.bbox(options.x,options.y,options.z,false,'3857');
const sql = `
SELECT ST_AsMVT(q,'${options.layerName}',4096,'geom')
FROM (
SELECT
table_id,properties,ST_AsMVTGeom(
geom,ST_MakeEnvelope(${bbox[0]},${bbox[1]},${bbox[2]},${bbox[3]},256,false
) AS geom
FROM ${'public.'+options.layerName} c
) q;
`;
try {
pool.query(sql,(error,results) => {
if (error) {
return res.status(500).json({
ok: false,message: error
});
}
const tile = results.rows[0];
// set the response header content type
res.setHeader('Content-Type','application/x-protobuf');
// trigger catch if the vector tile has no data,(return a 204)
if (tile.st_asmvt.length === 0) {
res.status(204);
}
// send the tile!
res.send(tile.st_asmvt);
});
} catch (e) {
res.status(404).send({
error: e.toString(),});
}
});
module.exports = app;
我遵循了来自这些站点的想法: