Bad readable wms layer on android - leaflet

Question

I need consume my WMS on leaflet and display it in web view. When I open my leaflet app in broser is pretty pure and readable. When same code run in android, it is much worst readable. I've tried add detectRetina: true to wms layer, but text was very small, and worst readable as now. On the images you can see differents.

Here is my full code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>LEaflet</title>
    <link rel="stylesheet" href="leaflet/leaflet.css">
    <link rel="stylesheet" href="style.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

</head>
<body style="padding:0; margin:0; height: 100vh; width: 100vw;">

<div id="map" style="height: 100vh; width: 100vw;"></div>


</body>

<script src="leaflet/leaflet.js"></script>

<script>
    var map = L.map('map', {
        minzoom:13
    }).fitWorld();

    var wmsLayer = L.tileLayer.wms('http://10.0.2.2:8080/geoserver/TEST/wms?', {
        layers: 'TEST:MyBaseLayer'
        //detectRetina: true
    }).addTo(map);

</script>
</html>

IvanSanchez · Accepted Answer · 2017-02-18 14:14:35Z

1

You will have to resort to the trick of having tiles double the size, with a zoomOffset of -1, i.e.:

var tileLayer = L.tileLayer(tileUrlTemplate, {
  tileSize: 512,
  zoomOffset: -1
}).addTo(map);

Check the Leaflet documentation for L.TileLayer about those options. They apply to L.TileLayer.WMS as well.

answered Feb 18, 2017 at 14:14

IvanSanchez

19.3k3 gold badges39 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Bad readable wms layer on android - leaflet

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest