sjy-ecos/views/index.html

<%- include('comm/header.html') %>
<div class="container">
	<div class="news-heading green-line">
		<h4 class="coffer"> </h4>
	</div>
	<div class="row" style="margin-bottom: 20px;">
		<div class="news-box col-md-3">

			<div class="news-ul list-group">

				<a href="/portal/metadata?bf=%E5%A4%A7%E6%B0%94%E6%9C%AC%E5%BA%95&amp;current_page=1" class="list-group-item">气象监测</a>

				<a href="#" class="list-group-item">水文水资源监测</a>

				<a href="#" class="list-group-item">草地监测</a>

				<a href="#" class="list-group-item">森林监测</a>

				<a href="#" class="list-group-item">沙化土地监测</a>

				<a href="#" class="list-group-item">湿地监测</a>

				<a href="#" class="list-group-item">水土保持监测</a>

				<a href="#" class="list-group-item">水土保持监测</a>

			</div>
		</div>

		<div class="news-box col-md-9">
			<div id="carousel-example-generic1" class="carousel slide" data-ride="carousel">
				<!-- Indicators -->
				<ol class="carousel-indicators">
					<li data-target="#carousel-example-generic1" data-slide-to="0" class="active"></li>
					<li data-target="#carousel-example-generic1" data-slide-to="1" class=""></li>
					<li data-target="#carousel-example-generic1" data-slide-to="2"></li>
				</ol>

				<!-- Wrapper for slides -->
				<div class="banner-inner carousel-inner" role="listbox">
					<div class="banner-item item next left">
						<div id="map"></div>

					</div>
					<div class="banner-item item active left">
						<img src="/images/banner1.png" alt="1">

					</div>

				</div>

				<!-- Controls -->
				<a class="left carousel-control" href="#carousel-example-generic1" role="button" data-slide="prev">
					<i class="iconfont jiantou-left icon-jiantou-left-copy" aria-hidden="true"></i>
					<span class="sr-only">Previous</span>
				</a>
				<a class="right carousel-control" href="#carousel-example-generic1" role="button" data-slide="next">
					<i class="iconfont jiantou-right icon-jiantou-right" aria-hidden="true"></i>
					<span class="sr-only">Next</span>
				</a>
			</div>
		</div>

	</div>

</div>

<script type="text/javascript">

	var base_OSM_Mapnik = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
		maxZoom: 19,
		attribution: ''
	});

	var base_map = L.tileLayer('http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
		maxZoom: 18
	});

	var base_TDT_map_Annotion = L.tileLayer.chinaProvider('TianDiTu.Normal.Annotion', {
		errorTileUrl: '/lib/leaflet/images/none.png',
		attribution: 'tile &copy <a href="http://www.tianditu.com">tianditu</a> '
	});

	var over_TDT_map_Annotion = L.tileLayer.chinaProvider('TianDiTu.Normal.Annotion', {
		errorTileUrl: '/lib/leaflet/images/none.png',
		attribution: ''
	});

	var over_geojson_sjy_bound_2nd = new L.GeoJSON.AJAX("/json/sjy_bound_2nd.geojson", {
		style: {
			"color": "#de950d",
			"weight": 2,
			"opacity": 1,
			"fillOpacity": 0
		}
	});

	var over_geojson_a = new L.GeoJSON.AJAX("/json/grass.geojson", {
		pointToLayer: function (feature, latlng) {
			return L.circleMarker(latlng, {
				radius: 4,
				fillColor: "#0aff3c",
				color: "#000",
				weight: 1,
				opacity: 1,
				fillOpacity: 0.8
			})
		},
		onEachFeature: onEachFeature
	});
	var over_geojson_b = new L.GeoJSON.AJAX("/json/soil.geojson", {
		pointToLayer: function (feature, latlng) {
			return L.circleMarker(latlng, {
				radius: 4,
				fillColor: "#ffef3a",
				color: "#000",
				weight: 1,
				opacity: 1,
				fillOpacity: 0.8
			})
		},
		onEachFeature: onEachFeature
	});
	var over_geojson_c = new L.GeoJSON.AJAX("/json/comp.geojson", {
		pointToLayer: function (feature, latlng) {
			return L.circleMarker(latlng, {
				radius: 4,
				fillColor: "#FFC124",
				color: "#000",
				weight: 1,
				opacity: 1,
				fillOpacity: 0.8
			})
		},
		onEachFeature: onEachFeature
	});

	var baseLayers = {
		"base_map": base_map,
		"base_OSM_Mapnik": base_OSM_Mapnik
	};

	var overLayers = {
		"地名": over_TDT_map_Annotion,
		"sjy_bound_2nd": over_geojson_sjy_bound_2nd
	};

	var map = L.map('map', {
		layers: [
			base_map,
			over_geojson_a,
			over_geojson_b,
			over_geojson_c,
			over_geojson_sjy_bound_2nd
		],
		minZoom: 6,
		maxZoom: 17,
		zoomIn: 1,
		zoomOut: 1,
		zoomControl: false
	}).setView([34, 96], 6);

	//	L.control.layers(baseLayers, overLayers).addTo(map);

	var bounds = new L.LatLngBounds(new L.LatLng(31, 103), new L.LatLng(38, 89));
	map.fitBounds(bounds);
	console.log(map.getBounds());

	$(function () {
		$('.navbar-nav li').first().addClass('active');
	});
</script>
<%- include('comm/footer.html') %>