Leaflet + Proj4Leaflet + EPSG3995 + WMS

Saya mencoba untuk mendukung lapisan WMS dengan proyeksi North Polar Stereographic (EPSG3995) pada Leaflet tetapi tidak dapat membuatnya berfungsi.

Saya menggunakan Proj4Leaflet dan telah membuat proyeksi dengan resolusi yang diberikan oleh GeoServer (lapisan WMS dilayani oleh GeoServer, lihat gambar yang digabungkan).

Pada jsfiddle berikut: https://jsfiddle.net/gaubert/Lyojcrzo/ Saya telah mencoba mengimplementasikannya dan jika Anda memperbesar peta selebaran, Anda akan melihat bahwa ubinnya tidak pada tempatnya?

Apa yang hilang untuk membuatnya bekerja? Apakah saya perlu menerapkan metode transformasi atau proyek?

Ada beberapa masalah di sini.

Pertama, izinkan saya mengutip dari http://leafletjs.com/examples/wms/wms.html (penekanan milik saya):

Juga mencatat bahwa Leaflet dukungan sangat sedikit sistem koordinat: CRS:3857, CRS:3395dan CRS:4326(Lihat dokumentasi untuk L.CRS). Jika layanan WMS Anda tidak menyajikan gambar dalam sistem koordinat tersebut, Anda mungkin perlu menggunakan Proj4Leaflet untuk menggunakan sistem koordinat yang berbeda di Leaflet. Selain itu, cukup gunakan CRS yang tepat saat menginisialisasi peta Anda, dan setiap lapisan WMS yang ditambahkan akan menggunakannya :

var map = L.map('map', {
    crs: L.CRS.EPSG4326
});

var wmsLayer = L.tileLayer.wms('http://demo.opengeo.org/geoserver/ows?', {
    layers: 'nasa:bluemarble'
}).addTo(map);

Kode di biola Anda melakukan sebaliknya, ia menentukan CRS sebagai opsi untuk lapisan wms, bukan sebagai opsi untuk peta:

wmsBKLayer = new L.tileLayer.wms('http://eumetview.eumetsat.int/geoserv/wms', {
    layers: 'bkg-raster:bkg-raster',
    crs: customCRS
}

var map = new L.map('map', {
   // No CRS option here!!
});

Tentukan CRS di opsi peta , dan Anda akan baik-baik saja.

Kedua, instantiasi objek. Leaflet menggunakan camelCase dengan huruf besar pertama untuk kelas (mis. L.TileLayerAdalah kelas), dan camelCase dimulai dengan huruf kecil untuk metode pabrik (mis. L.tileLayerAdalah metode pabrik).

var foo = L.tileLayer(...);     // Preferred
var foo = new L.TileLayer(...); // OK, but not preferred
var foo = L.TileLayer(...);     // Nope, one cannot call a class
var foo = new L.tileLayer(...); // Nope nope nope nope, one cannot create an instance of a factory

Silakan baca « /programming/8698726/constructor-function-vs-factory-functions » jika Anda merasa ini membingungkan.

Ketiga, mengutip dari https://kartena.github.io/Proj4Leaflet/ :

Apakah Anda menggunakan Leaflet 1.0 beta 1 atau versi pengembangan Leaflet? Maka Anda perlu menggunakan cabang pengembangan Proj4Leaflet.

Ini berarti bahwa tidak ada versi proj4leaflet yang dirilis yang berfungsi dengan Leaflet 1.

Di biola Anda, Anda menggunakan Leaflet 1.0.2 dan proj4leaflet 0.7.2. Mereka tidak akan bekerja sama.

Baik menggunakan Leaflet versi yang lebih rendah, atau membangun (dan menyebarkan dan menggunakan) versi proj4leaflet yang lebih baru. Harap dicatat bahwa proj4leaflet dapat menggunakan sedikit bantuan dengan pemeliharaannya, karena @liedman tidak dapat lagi mendukungnya.

Jika Anda punya waktu, saya sarankan Anda menghubungi pengelola saat ini, untuk membantu dengan rilis baru yang kompatibel dengan Leaflet 1.0.0.

Jika seseorang mengatasi tiga masalah ini, semuanya akan berfungsi lagi. Lihat contoh kerja di:

https://playground-leaflet.rhcloud.com/giwo/edit?html,output