Suite

Comment superposer l'image sur openstreetmap à l'aide de Leaflet.js


Je souhaite superposer une image satellite à large plage sur openstreetmap à l'aide de Leaflet.js. L'image satellite est en projection cylindrique équidistante.

C'est ainsi que je lance la couche.

L.imageOverlay(imgUrl, [[-15, 75], [45, 145]], {opacité : 0.6, autoZIndex : true});

Le résultat de la superposition est joint ci-dessous. Comme vous pouvez le voir, le littoral de l'image satellite (en violet) n'est pas aligné avec celui d'openstreetmap. Est-ce que quelque chose ne va pas avec la projection de l'image ou de la carte ? ou devrais-je utiliser un autre moyen pour superposer le satellite à cartographier ?


Malheureusement, votre imagerie satellite est en projection équirectangulaire (alias "projection cylindrique équidistante"), alors que les tuiles OpenStreetMap sont en projection Web Mercator (EPSG:3857), qui a un étirement vertical plus prononcé.

Je ne pense pas que Leaflet puisse faire quoi que ce soit pour vous aider dans cette situation. Vous pouvez essayer de tracer les parallèles de latitude pour voir l'écart (le haut et le bas doivent correspondre, puisque vous avez spécifié manuellement les limites de l'image, mais les parallèles intermédiaires doivent être à des positions différentes).

Vous devez soit rechercher une source de tuiles qui fournit également des tuiles en projection équirectangulaire (EPSG:4326), soit convertir votre image en Web Mercator.


Voir la vidéo: Video 3: Using OpenStreetMap for Your Project (Octobre 2021).