Ok, I have done this now, the problem was with the wms defination, the styles specified was for the polygon layer but i was using lines, Below is the modified code and it works fine.
As i change the time the color of the road changes.
var roads = L.tileLayer.wms(m_wms, {
layers: 'test3',
format: 'image/png',
transparent: true,
});
There are several problems here.
First, let me quote from http://leafletjs.com/examples/wms/wms.html (emphasis mine):
Also note that Leaflet supports very few coordinate systems: CRS:3857
, CRS:3395
and CRS:4326
(See the documentation for L.CRS
). If your WMS service doesn’t serve images in those coordinate systems, you might need to use Proj4Leaflet to use a different coordinate system in Leaflet. Other than that, just use the right CRS when initializing your map, and any WMS layers added will use it:
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);
The code in your fiddle does the opposite, it specifies the CRS as an option for the wms layer, instead of as an option for the map:
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!!
});
Specify the CRS in the map options, and you should be fine.
Second, object instantiation. Leaflet uses camelCase with first uppercase letter for classes (e.g. L.TileLayer
is a class), and camelCase starting with lowercase letter for factory methods (e.g. L.tileLayer
is a factory method).
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
Please read «https://stackoverflow.com/questions/8698726/constructor-function-vs-factory-functions» if you find this confusing.
Third, quoting from https://kartena.github.io/Proj4Leaflet/ :
Are you using Leaflet 1.0 beta 1 or development versions of Leaflet? Then you need to use the development branch of Proj4Leaflet.
This means that there is no released version of proj4leaflet which works with Leaflet 1.
In your fiddle, you are using Leaflet 1.0.2 and proj4leaflet 0.7.2. Those will simply not work together.
Either use a lower version of Leaflet, or build (and deploy and use) a newer version of proj4leaflet. Please note that proj4leaflet could use a bit of help with its maintenance, as @liedman can no longer support it.
If you have the time, I suggest you get in contact with the current maintainers, in order to help with a new release compatible with Leaflet 1.0.0.
If one addresses these three issues, everything will work again. See a working example at:
https://playground-leaflet.rhcloud.com/giwo/edit?html,output
Best Answer
You are not telling us how you get the WMS in Leaflet: are you using the default object or a plugin?
I have experiences the "cut" issues with labels too.
I suspect that the problem might come from the fact that Leaflet WMS object is a extension of the Tile object and somehow in the request processing somehting ges wrong. The geometric object to which the label correspond is one one tile and the labels would be on two tiles, if it were a tile system. However, as the geometric object is not on the second tile, its label is not rendered and thus you get "cut" labels. => Check whether the issue always appear at the "tile" borders.
Maybe this plugin can help you: https://github.com/heigeo/leaflet.wms
Or you might want to change the default size of tiles, so that you get one big tile (the tile must be slightly bigger than the size of your map on the screen)