- <!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="text" id="hdMapFlag" name="hdMapFlag" />
- </body>
- </html>
<!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>
以上就是全部的地图标注代码,希望对于后来者会有所帮助。如果有想看页面效果的兄弟可以进入:
地图标注http://www.52cfml.com/demo/mapsite.html
另外还有一个用JS实现的日历控件,连接地址:
日历控件http://www.52cfml.com/demo/calender.html