地图皮肤切换（高德）

说到地图，可以调用高德的接口。

api:http://lbs.amap.com/api/javascript-api/gettingstarted

js:

//地图

var map = new AMap.Map("container", {
			resizeEnable: true,
			center: [116.397643, 39.90808],
			//			layers: [//只显示默认图层的时候，layers可以缺省
			//	            new AMap.TileLayer()//高德默认标准图层
			//	        ],
			//			layers: [new AMap.TileLayer.Satellite()],
			//		center: [116.397428, 39.90923],
			//      layers: [
			//          new AMap.TileLayer.Satellite(),
			//          new AMap.TileLayer.RoadNet()
			//      ],
			zoom: 14,
		});
		var trafficLayer = new AMap.TileLayer.Traffic({
			zIndex: 11
		})
		var roadNetLayer = new AMap.TileLayer.RoadNet({
			zIndex: 10
		})
		var satelliteLayer = new AMap.TileLayer.Satellite({
			zIndex: 9
		})
		//卫星
		$('#satelliteLayer').click(function() {
			var layerGroup = new AMap.LayerGroup([satelliteLayer])
			layerGroup.setMap(map)
			if ($(this).hasClass('choose')) {
				layerGroup.hide();
				$(this).removeClass('choose');
				$(this).attr('src','img/wei.png');
			} else {
				$(this).addClass('choose');
				layerGroup.show();
				
				$(this).attr('src','img/hua_wei.png');
			}
		});
		//路况
		$('#trafficLayer').click(function() {
			var layerGroup = new AMap.LayerGroup([trafficLayer])
			layerGroup.setMap(map)
			if ($(this).hasClass('choose')) {
				layerGroup.hide();
				$(this).removeClass('choose');
				$(this).attr('src','img/lukuang.png');
			} else {
				$(this).addClass('choose');
				layerGroup.show();
				$(this).attr('src','img/hua_lukuang.png');
			}
		});
		//路网
		$('#roadNetLayer').click(function() {
			var layerGroup = new AMap.LayerGroup([roadNetLayer])
			layerGroup.setMap(map)
			if ($(this).hasClass('choose')) {
				layerGroup.hide();
				$(this).removeClass('choose');
				$(this).attr('src','img/luwang.png');
			} else {
				$(this).addClass('choose');
				layerGroup.show();
				$(this).attr('src','img/hua_luwang.png');
			}
		});
		//皮肤
		$('.skin img').click(function(){
			if ($(this).hasClass("light")) {
			var alla = $(".light");
			for (var i = 0; i < $(alla).length; i++) {
				var imgurl = $(alla[i]).attr('src');
				var url = "";
				if (imgurl.indexOf("hua_") > 0) {
					url = imgurl.substring(0, imgurl.indexOf("hua_"));
					url += imgurl.substring(imgurl.indexOf("hua_") + 4);

				} else {
					url = imgurl;
				}
				$(alla[i]).attr('src', url);
			}
			var src = $(this).attr("src");

			var s1 = src.substring(0, 4);
			var s2 = src.substring(4);
			s1 += "hua_";
			s1 += s2;
			$(this).attr("src", s1);
		}
			
			
		});
		function refresh(enName) {
			map.setMapStyle('amap://styles/' + enName);
		}
		//实时路况图层
		var trafficLayer = new AMap.TileLayer.Traffic({
			zIndex: 10
		});
		trafficLayer.setMap(map);
		var isVisible = true;
		AMap.event.addDomListener(document.getElementById('control'), 'click', function() {
			if (isVisible) {
				trafficLayer.hide();
				isVisible = false;
			} else {
				trafficLayer.show();
				isVisible = true;
			}
		}, false);