I am very new to GIS.
I am trying to display a map on a website using leaflet.
The map I want to display is hosted from an arcGIS server here:
http://ags.gis.iastate.edu/ArcGISServer/rest/services/Ortho/andreas/ImageServer
This page lists a number of different interfaces, including WMS. The link to WMS info on the site has an error in it, but can be retrieved here:
http://ags.gis.iastate.edu/ArcGISServer/services/Ortho/andreas/ImageServer/WMSServer?request=GetCapabilities&service=WMS
I have a web page set up on the model of the leaflet quickstart guide
(leafletjs.com/examples/quick-start.html)
And that was displaying the map of London as expected.
I then found documentation on the leaflet L.tileLayer.wms function which gave this example
var nexrad = L.tileLayer.wms("http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi", {
layers: 'nexrad-n0r-900913',
format: 'image/png',
transparent: true,
attribution: "Weather data © 2012 IEM Nexrad"
});
based on this, I substituted information from the ags.gis.iastate.edu wms capabilities sheet (linked above) and added the addTo(map) as below
var andreas = L.tileLayer.wms("http://ags.gis.iastate.edu/arcgisserver/services/Ortho/andreas/ImageServer/WMSServer", {
layers: '0',
format: 'image/png',
transparent: true,
attribution: "Andreas atlas © Iowa DNR"
}).addTo(map);
[note I also tried transparent: false]
Result: nothing.
Can anyone point out what is probably a very obvious error, or lack of understanding on my part?
Best Answer
Your piece of code seems to be good in theory. As I used arcGIS/Leaflet in exactly the same way.
But the problem could come from missing spatial reference (or maybe incorrect format (image/png or image/jpeg).
For the spatial reference, here is how Leaflet works :
It's really easy and helpful. Works like this (for EPSG:3006) :
You define your new crs
And include it in your map :
You can find Spatial References here.