地图 Api 使用小记 (use 51ditu)
哎呀我日。。。写3次了，ie死3次。没耐心了。。。
写了好几百字关于SmartMap的发展。。。全没了。我郁闷
衰。
没心情写了，简单的贴贴使用代码吧，自己打开记事本保存*.html就行
上面的是简单的地图显示
那我们日常遇到的，企业要标住地理位置怎么办那，别急，接着往下看吧！
解释一下吧
到此就标住完必，一定要把纬度和经度记载下来啊,否则上头的活就白干了
下面来说显示，这个稍微有些复杂
累死之。。。好几次重做。。。ie频频死掉。。。人品？
最后祝福全天下的妇女,美女,女孩,,,,,妇女节快乐!
写了好几百字关于SmartMap的发展。。。全没了。我郁闷
衰。没心情写了，简单的贴贴使用代码吧，自己打开记事本保存*.html就行
1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
2<html>
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
5<title>JavaScript Maps API</title>
6
7<!--1、引入JavaScript文件-->
8<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>
9</head>
10<body>
11
12
13<!--2、引入一个DIV-->
14<div id="myMap" style="position:relative; width:400px; height:300px;"></div>
15
16<!--3、创建地图对象-->
17
<script language="javascript">
18
var maps = new LTMaps( "myMap" );
19
20maps.cityNameAndZoom( "haerbin" , 5 );
21//maps.centerAndZoom ( new LTPoint( 11636224 , 3991040 ) , 5 );
22
23</script>
24
25</body>
26</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">2
<html>3
<head>4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">5
<title>JavaScript Maps API</title>6
7
<!--1、引入JavaScript文件-->8
<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>9
</head>10
<body>11
12
13
<!--2、引入一个DIV-->14
<div id="myMap" style="position:relative; width:400px; height:300px;"></div> 15
16
<!--3、创建地图对象-->17
<script language="javascript">
18
var maps = new LTMaps( "myMap" ); 19
20
maps.cityNameAndZoom( "haerbin" , 5 ); 21
//maps.centerAndZoom ( new LTPoint( 11636224 , 3991040 ) , 5 );22
23
</script> 24
25
</body>26
</html>上面的是简单的地图显示
1maps.cityNameAndZoom( "haerbin" , 5 );
显示城市为haerbin ,改成任意省份的全拼就是那个省了，第2个参数是显示比例，官方提供1-5，5是最大比例!maps.cityNameAndZoom( "haerbin" , 5 ); 那我们日常遇到的，企业要标住地理位置怎么办那，别急，接着往下看吧！
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
2<html>
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
5<title>JavaScript Maps API</title>
6<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>
7</head>
8
9<body>
10<div id="myMap" style="position:relative; width:400px; height:300px;"></div>
11
12<script language="javascript">
13var maps = new LTMaps( "myMap" );
14maps.cityNameAndZoom( "haerbin" , 5 );
15maps.handleKeyboard(); //键盘操作支持
16maps.handleMouseScroll();//鼠标滚轮支持
17//var control = new LTStandMapControl();
18var control1 = new LTSmallMapControl();
19
20maps.addControl( control1 );
21var control = new LTMarkControl();
22maps.addControl( control );
23
24
function getPoi(){
25
26var poi = control.getMarkControlPoint();
27
28alert( "纬度：" + poi.getLatitude() + "\n经度：" + poi.getLongitude() );
29
}
30LTEvent.addListener( control , "mouseup" , getPoi );
31</script>
32</body>
33</html>
34
标住也不复杂，不要被上面杂乱代码所迷惑。。。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">2
<html>3
<head>4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">5
<title>JavaScript Maps API</title> 6
<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>7
</head>8
9
<body>10
<div id="myMap" style="position:relative; width:400px; height:300px;"></div>11
12
<script language="javascript">13
var maps = new LTMaps( "myMap" );14
maps.cityNameAndZoom( "haerbin" , 5 );15
maps.handleKeyboard(); //键盘操作支持16
maps.handleMouseScroll();//鼠标滚轮支持17
//var control = new LTStandMapControl();18
var control1 = new LTSmallMapControl();19
20
maps.addControl( control1 );21
var control = new LTMarkControl();22
maps.addControl( control );23
24
function getPoi(){
25
26
var poi = control.getMarkControlPoint();27
28
alert( "纬度：" + poi.getLatitude() + "\n经度：" + poi.getLongitude() ); 29
}30
LTEvent.addListener( control , "mouseup" , getPoi );31
</script>32
</body>33
</html>34
解释一下吧
1maps.handleKeyboard(); //键盘操作支持
2maps.handleMouseScroll();//鼠标滚轮支持
这是对鼠标和键盘的支持maps.handleKeyboard(); //键盘操作支持2
maps.handleMouseScroll();//鼠标滚轮支持1var control1 = new LTSmallMapControl();
2
3maps.addControl( control1 );
4var control = new LTMarkControl();
5maps.addControl( control );
比例尺调整控件填加var control1 = new LTSmallMapControl();2
3
maps.addControl( control1 );4
var control = new LTMarkControl();5
maps.addControl( control );1function getPoi(){
2
3var poi = control.getMarkControlPoint();
4
5alert( "纬度：" + poi.getLatitude() + "\n经度：" + poi.getLongitude() );
6}
7LTEvent.addListener( control , "mouseup" , getPoi );
得到当前坐标并显示！function getPoi(){2
3
var poi = control.getMarkControlPoint();4
5
alert( "纬度：" + poi.getLatitude() + "\n经度：" + poi.getLongitude() ); 6
}7
LTEvent.addListener( control , "mouseup" , getPoi );到此就标住完必，一定要把纬度和经度记载下来啊,否则上头的活就白干了
下面来说显示，这个稍微有些复杂
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
2<html>
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
5<title>JavaScript Maps API</title>
6<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>
7</head>
8
9<body>
10<div id="myMap" style="position:relative; width:400px; height:300px;"></div>
11
12<script language="javascript">
13var maps = new LTMaps( "myMap" );
14maps. centerAndZoom ( new LTPoint( 12668820 , 4574000 ) , 1 );
15var point = new LTPoint( 12668820 , 4574000 );
16var marker = new LTMarker( point );
17maps.addOverLay( marker );
18var infoWin = new LTInfoWindow( marker );
19infoWin.setLabel( "四海一家科技发展有限公司" );
20maps.addOverLay( infoWin );
21</script>
22</body>
23</html>
24
解释一下<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">2
<html>3
<head>4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">5
<title>JavaScript Maps API</title> 6
<script language="javascript" src=" http://api.51ditu.com/js/maps.js "></script>7
</head>8
9
<body>10
<div id="myMap" style="position:relative; width:400px; height:300px;"></div>11
12
<script language="javascript">13
var maps = new LTMaps( "myMap" );14
maps. centerAndZoom ( new LTPoint( 12668820 , 4574000 ) , 1 );15
var point = new LTPoint( 12668820 , 4574000 );16
var marker = new LTMarker( point );17
maps.addOverLay( marker );18
var infoWin = new LTInfoWindow( marker );19
infoWin.setLabel( "四海一家科技发展有限公司" ); 20
maps.addOverLay( infoWin );21
</script>22
</body>23
</html>24
1maps. centerAndZoom ( new LTPoint( 12668820 , 4574000 ) , 1 );
地图以哪个点为中心显示。。。maps. centerAndZoom ( new LTPoint( 12668820 , 4574000 ) , 1 );1var point = new LTPoint( 12668820 , 4574000 );
2var marker = new LTMarker( point );
3maps.addOverLay( marker );
4var infoWin = new LTInfoWindow( marker );
5infoWin.setLabel( "四海一家科技发展有限公司" );
6maps.addOverLay( infoWin );
标记到某一点并添加到地图上。。。var point = new LTPoint( 12668820 , 4574000 );2
var marker = new LTMarker( point );3
maps.addOverLay( marker );4
var infoWin = new LTInfoWindow( marker );5
infoWin.setLabel( "四海一家科技发展有限公司" ); 6
maps.addOverLay( infoWin );累死之。。。好几次重做。。。ie频频死掉。。。人品？
最后祝福全天下的妇女,美女,女孩,,,,,妇女节快乐!
浙公网安备 33010602011771号