<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=GB2312"/>
<style type="text/css">v\:*{behavior:url(#default#VML);}</style>
<style type="text/css">
html,body
{
background:#FFFFFF;
overflow : auto;
}
table
{
font-size:12px;
font-weight:bold;
color:#E066FF;
}
input
{
font-size: 12px;
color:#E066FF;
}
</style>
<script language="javascript" src="http://api.51ditu.com/js/maps.js"></script>
<script language="javascript" src="http://api.51ditu.com/js/traffic.js"></script>
<script language="javascript">
var map;
var mgr;
var poit;
var scaleControl; /* 比例尺控件 */
var icon; /* 标注自定义图标样式 */
var mapText; /* 添加文字标签 */
var controlZoom; /* 拉框放大控件 */
var controlDistance; /* 测距离控件 */
var controlMianji; /* 侧面积控件 */
var aryRightMenu; /* 右键菜单数组 */
var zoomIn; /* 右键放大 */
var zoomOut; /* 右键缩小 */
var markerRightMenu; /* 右键添加标注 */
var menuRightMenu; /* 添加右键菜单控件到地图上 */
var LatMin; /* 矩形框的边界值,最小维度 */
var LatMax; /* 矩形框的边界值,最大维度 */
var LonMin; /* 矩形框的边界值,最小经度 */
var LonMax; /* 矩形框的边界值,最大经度 */
var rect; /* 矩形框对象 */
var controlOfweilan; /* 建立新的拉框查找控件对象 */
var markerToDrag; /* 可拖拽的标注对象 */
/*===================== 主函数 ===================== */
function onLoad()
{
map=new LTMaps("mapDiv"); /* 创建地图 */
point = new LTPoint( 10645971,2956742 );
map.centerAndZoom( point,2 );
map.setMapCursor("hand","move"); /* 设置鼠标在地图上的形状 */
map.addControl(new LTStandMapControl());
map.addControl(new LTOverviewMapControl()); /* 添加鹰眼 */
mgr = new LTTraffic(map);
scaleControl=new LTScaleControl(); /* 添加比例尺 */
scaleControl.units=[[1000,"km"],[1,"m"]];
scaleControl.setColor("red");
scaleControl.setLeft(280);
map.addControl(scaleControl);
map.handleMouseScroll(true); /* 鼠标滚轮操作 */
map.mapCartoonControl(true); /* 滚轮操作时,地图动画效果展示放大和缩小 */
LTEvent.bind(map,"dblclick",map,function(){{this.zoomIn()}}); /* 双击放大地图 */
icon=new LTIcon("C:\\centerPoi.gif",[24,24],[12,12]); /* 添加标注 */
var marker = new LTMarker( point,icon );
map.addOverLay( marker );
LTEvent.addListener( marker , "click" , doitForMarker); /* 给标记添加点击事件,点击显示当前的详细地理位置 */
mapText = new LTMapText( marker ); /* 为标注添加文字标签 */
mapText.setLabel("{2}" );
mapText.setBackgroundColor("#CAFF70");
mapText.setFontColor("#D15FEE");
map.addOverLay( mapText );
var myHtml="我在这里,这是第1个标记";
var infoWin=mapText.openInfoWinHtml(myHtml);
infoWin.setTitle("这里是我的标记的标题");
LTEvent.addListener( mapText , "click" ,getClickCallBack(mapText,myHtml));
controlZoom = new LTZoomInControl();
controlZoom.setTop( 400 );
controlZoom.setLeft( 30 );
controlZoom.setLabel("拉框放大"); /*拉框放大*/
map.addControl(controlZoom);
controlDistance=new LTPolyLineControl();
controlDistance.setTop( 350 );
controlDistance.setLeft( 30 );
controlDistance.setLabel(" 测距离 "); /*测距离按钮*/
controlDistance.lineColor="red";
controlDistance.lineStroke=1;
controlDistance.lineOpacity=1;
controlDistance.lineStyle="ShortDash";
controlDistance.lineArrow=["Open","Open"];
map.addControl(controlDistance);
LTEvent.addListener(controlDistance,"draw",onDraw);
controlMianji = new LTPolygonControl();
map.addControl( controlMianji );
controlMianji.setTop( 300 );
controlMianji.setLeft( 30 );
controlMianji.setLabel(" 测面积 "); /*测面积按钮*/
aryRightMenu = new Array();
zoomIn = new LTMenuItem(); /* 右键放大 */
zoomIn.id = "zoomIn";
zoomIn.menuText = "放大";
zoomIn.functionName = mapZoomIn;
aryRightMenu.push(zoomIn);
zoomOut = new LTMenuItem(); /* 右键缩小 */
zoomOut.id = "zoomOut";
zoomOut.menuText ="缩小";
zoomOut.functionName = mapZoomOut;
aryRightMenu.push(zoomOut);
markerRightMenu = new LTMenuItem(); /* 右键添加标注 */
markerRightMenu.id = "marker";
markerRightMenu.menuText ="在此添加标注";
markerRightMenu.functionName = mapMarker;
aryRightMenu.push(markerRightMenu);
menuRightMenu = new LTMenuControl(aryRightMenu); /* 添加右键菜单控件到地图上 */
map.addMenuControl(menuRightMenu);
controlOfweilan = new LTZoomSearchControl("red","red",1,0.4); /* 建立新的拉框查找控件 */
controlOfweilan.setTop( 450 );
controlOfweilan.setLeft( 30 );
controlOfweilan.setLabel("电子围栏" );
map.addControl(controlOfweilan); /* 添加控件到地图 */
markerToDrag=new LTMarker(point);
markerToDrag.enableDrag();
map.addOverLay(markerToDrag);
LTEvent.addListener(markerToDrag,"dragend",onDragEnd); /* 设置用户在拖拽标记之后执行onDragEnd函数 */
LTEvent.addListener(controlOfweilan,"mouseup",doit); /* 设置在用户拉框完成之后执行doit函数 */
}
/*====================== 在标记被点击的时候执行的函数,marker的onClick监听的事件 ====================== */
function doitForMarker()
{
onClickForMarker();
}
/*====================== 在标记被点击的时候执行的函数 ====================== */
function onClickForMarker()
{
var reg=new LTRegoLoader();
LTEvent.bind(reg,"loaded",reg,myLocation);
reg.loadDescribe(point);
}
/*====================== onClickForMarker函数中,reg对象绑定的事件myLocation ====================== */
function myLocation(obj)
{
var myHtml = obj.describe; /* 逆地理信息描述 */
var infoWin=mapText.openInfoWinHtml(myHtml);
infoWin.setTitle("当前具体位置");
}
/*====================== 本函数是在用户每次拉框操作完成之后执行的操作,bounds是代表用户拉框选择的区域的范围 ====================== */
function doit(bounds)
{
var str="电子围栏区域坐标为:\n"
- 1
- 2
- 3
- 4
- 5
- 6
前往页