Info:
I have a local Open Street Maps Server which is serving tiles for Michigan, Indiana, Ohio, Illinois, and West Virginia. I also have a geoserver set up serving a wms layer containing states. Because I only have several states served in Open Street Maps, OSM does not show state borders, which is why I have a WMS layer.
The Problem:
I wanted to layer OSM over top of my WMS layer and make it transparent so that the state lines will show through from the WMS layer.
Code:
var map;var feature;function load_map() { map = new L.Map('map', { zoomControl: true, center: [0, 0], zoom: 3 }); var osmUrl = 'http://my_server/osm_tiles/{z}/{x}/{y}.png', osmAttribution = 'Map data © 2012 OpenStreetMap contributors', osm = new L.TileLayer(osmUrl, { maxZoom: 18, attribution: osmAttribution, transparent: true }); var states = L.tileLayer.wms('http://my_server:8080/geoserver/Indigital/wms', { format: 'image/png', transparent: false, layers: 'Indigital:states' }); var overlays = { "States:WMS": states, "OSM": osm, }; var layerControl = L.control.layers(null, overlays); map.addControl(layerControl);
أكثر...
I have a local Open Street Maps Server which is serving tiles for Michigan, Indiana, Ohio, Illinois, and West Virginia. I also have a geoserver set up serving a wms layer containing states. Because I only have several states served in Open Street Maps, OSM does not show state borders, which is why I have a WMS layer.
The Problem:
I wanted to layer OSM over top of my WMS layer and make it transparent so that the state lines will show through from the WMS layer.
Code:
var map;var feature;function load_map() { map = new L.Map('map', { zoomControl: true, center: [0, 0], zoom: 3 }); var osmUrl = 'http://my_server/osm_tiles/{z}/{x}/{y}.png', osmAttribution = 'Map data © 2012 OpenStreetMap contributors', osm = new L.TileLayer(osmUrl, { maxZoom: 18, attribution: osmAttribution, transparent: true }); var states = L.tileLayer.wms('http://my_server:8080/geoserver/Indigital/wms', { format: 'image/png', transparent: false, layers: 'Indigital:states' }); var overlays = { "States:WMS": states, "OSM": osm, }; var layerControl = L.control.layers(null, overlays); map.addControl(layerControl);
أكثر...