谷歌地图的使用，包括坐标点的刷新，设置中心点

之前官网重构，有用到谷歌地图的使用，以及切换坐标点时，图标的切换。
1、首先创建谷歌地图，并申明一个中心点，以及缩放比例。

var myOptions = {
	zoom: 17,
	center: new google.maps.LatLng(clat, clng), // 设置当前柜子为中心
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	mapTypeControl: false
};
//添加map
gmap = new google.maps.Map(document.getElementById("googleMap"), myOptions);

2、取数据，并标点，并给每个标点添加点击事件：

let markers = [];
for(var i = 0; i < Mapdata.length; i++) {
	var gmarker = new google.maps.Marker({
		position: new google.maps.LatLng(Mapdata[i].latitude, Mapdata[i].longitude),
		map: gmap,
		// 下面是匹配中心点图标及一般坐标的图标
		icon: (clng == Mapdata[i].longitude && clat == Mapdata[i].latitude) ? "" : 'img/myPic.png',
		siteId: Mapdata[i].siteId,
		_lng: Mapdata[i].longitude,
		_lat: Mapdata[i].latitude,
	});
	markers.push(gmarker);
}

// 添加点击事件
for(let j = 0; j < markers.length; j++) {
	markers[j].addListener('click', function() {
		// 点击图标，跳转到对应的详情
		location.href = "detail.html?id=" + markers[j].siteId + "&lng=" + markers[j]._lng + "&lat=" + markers[j]._lat;
	});
}

下面是首页示意图，下面的图标采用的自定义的图标

3、点击首页标点，进入详情页，把ID传过去，
其中一个是重新定位最新的中心点，并zoom到适当的比例，并把选中的中心点标为谷歌默认的红色；下面是详情展示

4、详情页面点的切换，地图不刷新，地图标点重新渲染

for(let j = 0; j < markers.length; j++) {
	markers[j].addListener('click', function() {
           event.preventDefault();
           event.stopPropagation();
			// 点击图标，获取到对应的详情
             getDetail(markers[j].siteId);
             gmap.setCenter(new google.maps.LatLng(markers[j]._lat,markers[j]._lng));  // 设立新的中心点        
              // 设立当前点中的为红标，其他的为默认黑标        
              markers.forEach(function(ee, ii){
                  if (ee._lng !== markers[j]._lng && ee._lat !== markers[j]._lat) {
                      ee.setIcon("img/location/myPic.png"); //非选中的图标
                  } else {
                      ee.setIcon("");  // 选中的图标（红色）
                  }
              })

	});
		}

所以总结就是：
一、设立新的中心点：gmap.setCenter(latitude, longitude);
二、重新渲染选中的图标：ee.setIcon(“img/myPic.png”); //非选中的图标