您的位置:首页 > 其它

51地图 点击时取经纬度

2010-05-20 10:24 162 查看
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JavaScript Maps API</title>

<!--1、引入JavaScript文件-->
<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>
</head>
<body>
<!--3、创建地图对象-->
<script language="javascript">
var toolTipLayer=document.createElement("DIV");
toolTipLayer.id="myMap";
toolTipLayer.style.position="absolute";
toolTipLayer.style.left="200px";
toolTipLayer.style.width="400px";
toolTipLayer.style.height="300px";
toolTipLayer.style.top="200px";
document.body.appendChild(toolTipLayer);
var maps = new LTMaps( "myMap" );
maps.cityNameAndZoom( "beijing" , 5 );
LTEvent.addListener( maps , "click" , b );
function b(p){
alert(p[0]);
alert(p[1]);
alert(p);
lpot=maps.getPointLatLng(p)//得到LTPOINT对象
var marker = new LTMarker( lpot);//产生标记
maps.addOverLay( marker );
alert("标记增加完成");
}
</script>
<srcipt language="javascript">
function c(e)
{
LTFunction.getEventPosition(e,document.getElementById("myMap"));
}
</script>

</body>
</html>

<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=GB2312"/>
<meta name="keywords" content="LTPolyLineControl.endDraw,LTPolyLineControl.setTips,LTPolygonControl.setTips,LTPolygonControl.endDraw,LTEvent.bind,JavaScript,灵图,51ditu Maps API,地图,范例文档,vml"/>
<title>我要地图-地图API-范例-双击结束测距控件</title>
<style type="text/css">v/:*{behavior:url(#default#VML);}</style>
<script language="javascript" src=http://api.51ditu.com/js/maps.js></script>
<script language="javascript">
var map;
function onLoad()
{
map=new LTMaps("mapDiv");
map.centerAndZoom(new LTPoint(11640969,3994940),6);
map.addControl(new LTStandMapControl());
//测面和测距控件使用方法相同
var control=new LTPolyLineControl(true);
control.setTips("双击结束");//改变操作提示文字内容
LTEvent.bind(map,"dblclick",control,control.endDraw);//在双击地图的时候调用结束操作
map.addControl(control);
LTEvent.bind(map,"click",control,b);//在双击地图的时候调用结束操作
}

function b(p){
lpot=map.getPointLatLng(p)//得到LTPOINT对象
alert(lpot.getLongitude());
}
</script>
</head>
<body onload="onLoad()">
<div id="mapDiv" style="position:absolute;width:400px; height:300px;"><div align="center" style="margin:12px;"><a href="http://api.51ditu.com/docs/mapsapi/help.html" target="_blank" style="color:#D01E14;font-weight:bolder;font-size:12px;">看不到地图请点这里</a></div></div>

<div style="position:absolute;left:420px;">
<ul>
<li>查看<b>本页面源文件</b>可以了解如何使用51ditu Maps API实现本功能;</li><br/><br/>

<li>测距控件(测面控件也类似)默认通过鼠标右键单击完成操作,本范例演示如何更改为通过双击完成操作;</li>
<li>点击"测距离"按钮开始画线操作,完成后双击地图,完成画线过程;</li>

<br/><br/><li><a href="../../examples.html">返回所有范例列表</a></li>
</ul>
</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: