`

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' onclick='javascript:registMouseAddMarker();' value='标点'/>
    <!---<input type='button' name='b' onclick='javascript:unregistMouseAddMarker();' value='确定标点'/>--->
    <input type="text" id="hdMapFlag" name="hdMapFlag" />
</body>
</html>

 以上就是全部的地图标注代码,希望对于后来者会有所帮助。如果有想看页面效果的兄弟可以进入:

地图标注

另外还有一个用JS实现的日历控件,连接地址:

日历控件

分享到:
评论

相关推荐

    MAPABC电子地图代码

    总的来说,"MAPABC电子地图代码"是一个学习和实践地图开发的好材料,它涵盖了地图API的基本使用和一些进阶功能。通过这三个HTML文件,开发者能够深入理解如何在Web应用中集成和定制电子地图,提升自己的技能。

    MapABC地图使用手册

    1. **开发者标注**:MapABC地图API允许开发者通过接口将个性化数据直接标注在地图上,实现“我的地图我做主”,这对于开发定制化地图应用非常有用。 2. **Flash技术支持**:利用Flash技术,MapABC地图API能够创建...

    MapABC地图制作

    1.了解MapABC地图 2.MapABC地图服务平台的产品特点? 3.MapABC地图服务平台总体架构 4.MapABC Web API 简介 5.MapABC Ajax API(Ajax地图展现) 6.如何使用MapABC Ajax API(Ajax地图展现) ? 7.如何使用MapABC ...

    MapABC 地图API介绍

    2. **定位与标注**:API支持获取用户当前位置,并能在地图上添加自定义标注,展示特定地点或兴趣点。这在地理信息展示、商业选址分析等方面非常实用。 3. **地理编码与反地理编码**:地理编码是将地址转换为经纬度...

    MapABC地图API JavaScript版

    MapABC地图API JavaScript版

    MAPABC电子地图应用PPT讲解

    总的来说,MapABC电子地图应用不仅提供了丰富的地图服务,还通过API开放了地图功能,使得开发者能够构建个性化的地图应用,极大地拓展了电子地图在各领域的应用可能性。无论是个人还是企业,都能通过MapABC API轻松...

    MapABC地图使用手册.doc

    1. **开发者标注支持**:这是MapABC的一大亮点,它允许开发者通过接口将自己的数据直接标注在地图上,实现个性化地图定制。这一特性使得开发者能够“我的地图我做主”,创建具有独特数据和功能的地图应用。 2. **...

    MapABC电子地图服务器产品安装和维护.docx

    MapABC电子地图服务器产品安装和维护

    mapabc地图数据下载,高德数据(免费更新)

    标题中的“mapabc地图数据下载,高德数据(免费更新)”揭示了本文将要讨论的核心内容,即如何获取和使用mapabc与高德地图的数据,特别是这些数据的免费更新服务。mapabc和高德地图是两个知名的在线地图服务平台,...

    MapABC_API_JavaScript

    MapABC API 允许创建和管理地图标注,包括文本标注和自定义图标标注。开发者可以通过`MapABC.Marker`和`MapABC.Label`类来创建标注,并设置其位置、样式和事件监听器。 六、图层管理 API支持多图层管理,包括底图...

    google地图mapabc地图yahoo 在线地图api开发包OnlineMapProject.rar

    MapABC是中国本土的在线地图服务提供商,其地图API提供了类似的功能,如地图展示、标注、路径规划等。MapABC API支持JavaScript和RESTful两种接口,适用于不同类型的开发需求。开发者可以通过注册获取API密钥,然后...

    MapABC地图API Flash版-JavaScript版-Silverlight版-Flex版.zip

    MapABC地图API是一款广泛应用于地理信息系统(GIS)开发中的工具,为开发者提供了在网页上集成地图功能的能力。这个压缩包包含四个不同版本的MapABC地图API文档:Flash版、JavaScript版、Silverlight版和Flex版,...

    MapABC Flex4 Demo

    2. 地图API的集成:学习MapABC API文档,了解如何请求地图数据,如何添加和操作地图标注,以及如何实现其他高级功能。 3. 地图交互设计:理解地图控件的实现原理,例如缩放滑块、平移按钮等,以及如何响应用户的点击...

    MapABC地图使用演示

    MapABC的基础使用 多点添加 地图交互 工具条样式修改 弹出信息泡泡等

    MapABC电子地图服务器产品安装与维护记录.doc

    MapABC电子地图服务器产品安装与维护记录.doc

    MapABC API

    地图组件API用户手册则可能涉及如何使用预封装的组件,如地图控件、标注控件等,简化开发流程。搜索API用户手册则专注于地图上的搜索功能,帮助开发者实现在地图上定位和查找特定地点。 五、示例程序和图片资源 ...

Global site tag (gtag.js) - Google Analytics