Skip to content

Mapbox vector tiles from 1GB table rendering very slowly #24

@iskandari

Description

@iskandari

I am connecting a table in my PostgreSQL database, which was created from a shapefile that is almost 1 GB in size (containing detailed land parcel polygons). When I use the sample code provided in the tutorial requiring tilesplash and redis, the tiles render slowly, and at lower zoom levels most tiles do not render at all. Is there a way to render mvt tiles more efficiently?

app.layer('parcel06_proj', userMiddleware, function(tile, render){
  if (tile.z < 5 || tile.z > 20) {
    render.empty();
  } else {
  render(
    {      
      pol : "SELECT ST_AsGeoJSON(geom) as the_geom_geojson, parcel06_proj.* FROM parcel06_proj WHERE ST_Intersects(geom, !bbox_4326!)"
    });
}
});
<img width="1177" alt="screen shot 2016-11-18 at 5 36 46 pm" src="https://cloud.githubusercontent.com/assets/8308461/20449185/dc181d98-adb5-11e6-9f7e-a0a6905dc78d.png">
<img width="1177" alt="screen shot 2016-11-18 at 5 36 46 pm" src="https://cloud.githubusercontent.com/assets/8308461/20449196/ea6e9278-adb5-11e6-8e6e-ef4c12b46594.png">

app.server.listen(3000);


var map = new mapboxgl.Map({
    container: 'map', // container id
    style: 'mapbox://styles/mapbox/dark-v9',
    center: [-96.80011, 32.7817035], 
    zoom: 14 
});

map.on('load', function() {
    map.addSource('dallas', {
        type: 'vector',
        tiles: ['http://localhost:3000/parcel06_proj/{z}/{x}/{y}.mvt'],
        "minzoom": 5,
        "maxzoom": 19
    });
    map.addLayer({
        "id": "polygons",
        "type": "fill",
        "source": "dallas",
        "source-layer": "pol",
        "paint": {
            "fill-color": "#3887be"
        }
    });
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions