Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Blurry tiles #41

Closed
ma7moudat opened this issue Nov 28, 2022 · 2 comments · Fixed by #42
Closed

Blurry tiles #41

ma7moudat opened this issue Nov 28, 2022 · 2 comments · Fixed by #42

Comments

@ma7moudat
Copy link
Contributor

ma7moudat commented Nov 28, 2022

While re-implementing the tile layer with maplibre-gl-leaflet I noticed the quality of the tiles dropped due to blurriness.

I hope the difference is recognisable in the screenshots 😅

With leaflet on its own with raster tiles (or maplibre-gl on its own with vector tiles), the map looks sharp and crisp:
leaflet

But when I try to use maplibre-gl-leaflet, it's not as clean:
maplibre-gl-leaflet

The reason is that tile layer gets a transform css rule with fractions:
maplibre-gl-leaflet-style

So if the style were transform: translate3d(-107px, -50px, 0px) instead, we would not have the problem.

Can we round the translate properties?

@ma7moudat
Copy link
Contributor Author

The problem can also be seen in the examples.

https://raw.githack.com/maplibre/maplibre-gl-leaflet/main/examples/basic.html

@ma7moudat
Copy link
Contributor Author

Please review #42 and, if everything is fine, publish it to npm.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant