高德地圖marker添加屬性、更換icon圖標

爲高德地圖marker添加屬性

首先創建marker

	//創建icon
	var icon = new AMap.Icon({
         size: new AMap.Size(25, 34),
         image: '/img/path',
         imageSize: new AMap.Size(20, 40) 
	});
	
	//創建marker
	var marker = new AMap.Marker({
		  position: new AMap.LngLat(longitude, latitude),
		  icon: icon ,
		  map: map
	});
	
	//此時 marker 已經創建好了			

	// 爲marker添加點擊事件,觸發 markerClick 函數
	marker.on('click', markerClick);

爲 marker 添加 orderno 屬性

marker.orderno = '123456'; // 此處直接用 marker.orderno 即可,如果想添加 content 屬性,直接 marker.content

怎麼使用添加的 orderno 屬性

//以之前設置的 marker 點擊事件爲例
function markerClick(e) {
	//此處的 e 是關鍵,這樣就可以拿到
	console.log(e.target.orderno);
	//或者這樣
	console.log(this.orderno);
}

如何更改已經設置好的marker的icon圖標

//假設新的 icon 是 newIcon
//之前設置了 marker 的 icon 圖標,可用以下方式更改
marker.setIcon(newIcon);
//如果是在剛剛的點擊事件中,可以如下設置:
	function markerClick(e) {
	//此處的 e 是關鍵,這樣就可以拿到
	console.log(e.target.orderno);
	//或者這樣
	console.log(***this.orderno***);
	
	//**更改 icon** 
	e.target.setIcon(newIcon);
}

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章