Mapabc——地圖標註

項目中使用到了地圖標註的功能(mapabc),現在將代碼共享出來,希望對於後來者有所幫助。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>地圖標註</title>
    <script src="http://app.mapabc.com/apis?&t=flashmap&v=2.2&key=98fadf9ac86088c6e7966e8949b1f5a3a6efe15d5c01eeb0e080fc298f8728c542a2b6f8d09d7e40"
        type="text/javascript"> </script>

    <script type="text/javascript">
    var mapObj = null;
    window.onload = function() {
        //設置地圖初始化參數對象
        var mapOptions = new MMapOptions();
        mapOptions.zoom = 10;
        //設置中心點爲鄭州
        mapOptions.center = new MLngLat("fjqennngoNKOI","hmlnnismtJGGM",0);
        mapOptions.zoom = 13;
        mapOptions.toolbar = DEFAULT;
        mapOptions.toolbarPos = new MPoint(0, 0);
        mapOptions.overviewMap = DEFAULT;
        //創建地圖對象
        mapObj = new MMap("mapObj", mapOptions);
        registMouseAddMarker();
    }
    function onClick(e) {        
        var ll = new MLngLat(e.eventX,e.eventY);
        var marker = new MMarker(ll);
        marker.id = "marker";
        mapObj.addOverlay(marker);
        var xy = marker.lnglat.lngX + "," + marker.lnglat.latY;
        document.getElementById("hdMapFlag").value = xy;
    }
    
    function registMouseAddMarker() {
		mapObj.addEventListener(mapObj,MOUSE_CLICK,onClick);
		/*
		var point = parent.document.getElementById("hdMap").value;
		if (point != null && point != "") {
		    var position = point.split(",");
		    var ll = new MLngLat(position[0],position[1]);
            var marker = new MMarker(ll);
            marker.id = "marker";
            mapObj.addOverlay(marker);
		}
		document.getElementById("hdMapFlag").value = point;
		*/
	}

	function unregistMouseAddMarker() {
		mapObj.removeEventListener(mapObj,MOUSE_CLICK,onClick);
        //parent.document.getElementById("hdMap").value = document.getElementById("hdMapFlag").value;
        //window.parent.$.fadeD(0);
	}
    </script>
</head>
<body>
    <div id="mapObj" class="view" style="width:620px;height:420px"></div> 
	<input type='button' name='a' οnclick='javascript:registMouseAddMarker();' value='標點'/>
    <!---<input type='button' name='b' οnclick='javascript:unregistMouseAddMarker();' value='確定標點'/>--->
    <input type="text" id="hdMapFlag" name="hdMapFlag" />
</body>
</html>

 以上就是全部的地圖標註代碼,希望對於後來者會有所幫助。如果有想看頁面效果的兄弟可以進入:

地圖標註

另外還有一個用JS實現的日曆控件,連接地址:

日曆控件

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