Skip to content

Instantly share code, notes, and snippets.

@iamtekson

iamtekson/geoserverLeaflet.html

Last active October 24, 2019 16:19
Show Gist options
  • Save iamtekson/787be37c83aeb1d7b06060d9abc0dc18 to your computer and use it in GitHub Desktop.
Save iamtekson/787be37c83aeb1d7b06060d9abc0dc18 to your computer and use it in GitHub Desktop.
Download ZIP
Geoserver WMS feature with leaflet.js
Raw
geoserverLeaflet.html
<html>
<head>
<!-- leaflet css -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css">
<style>
#map {
width: 100%;
height: 500px;
}
</style>
</head>
<body>
<div id="map"></div>
<!-- leaflet js -->
<script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"></script>
<script>
var map = L.map("map").setView([38.45, 70.6], 6);
var osm = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
//load geojson form geoserver
var mywms = L.tileLayer.wms("http://localhost:8080/geoserver/tajikistan/wms", {
layers: 'tajikistan:country1',
format: 'image/png',
transparent: true,
version: '1.1.0',
attribution: "country layer"
});
mywms.addTo(map);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment