ConservationMetrics / mapgl-tile-renderer

Headless Node.js Maplibre-GL renderer for generating MBTiles with styled raster tiles.
MIT License
6 stars 3 forks source link

Label clipping #41

Closed acalcutt closed 4 months ago

acalcutt commented 4 months ago

I noticed the rendering was not being done in tile mode, so I wanted to see if label clipping was an issue and it turns out it was

image

In tileserver-gl we have two ways that we fix clipped tiles

1.) Create the maplibre.Map object with mode: 'tile', . This allows sources that have extra data about the surrounding tiles built in to use that information.

For example, if I change this to

  const map = new maplibre.Map({
    request: requestHandler(styleDir, sourceDir),
    ratio: 1,
    mode: 'tile',
  });

the label clipping goes away image

2.) Some tile sources don't have the extra data that tile mode needs to work. In those cases in tileserver-gl we added a tile margin option, which renders in mode: 'static' but requests a bit extra margin to the tile size, which it removes after rendering. I don't have an example for that, but it is an alterantive.

rudokemper commented 4 months ago

Thanks @acalcutt, really great to have your insights and experience here!

I did some testing and found an immediate improvement by including mode: 'tile' as you suggested. So I submitted a PR with that change.

We may also want to implement a similar solution for (2). For reference, linking this thread which describes the issue mentioned https://github.com/maplibre/maplibre-native/issues/644 and the tileserver-gl PR which adds a workaround: https://github.com/maptiler/tileserver-gl/pull/608

acalcutt commented 4 months ago

I'm going to close this since you did put in the mode: 'tile' change. but just keep in mind number 2, because I have had some people use tiles that did not have the extra info needed for it to work. so if you still see clipping, it could be that.