對(duì)于我這個(gè)沒(méi)寫過(guò)前端的人,調(diào)用api感覺(jué)有點(diǎn)難,但是寫完以后,我發(fā)現(xiàn)真簡(jiǎn)單啊,以下代碼僅供參考,如有寫的不理想的地方,請(qǐng)?jiān)u論區(qū)指出,謝謝
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, ur-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; chart=utf-8" />
<title>Hello, World</title>
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
</style>
<script type="text/javascript" src="map_load.js"></script>
<script type="text/javascript" src="./MarkerClusterer_min.js"></script>
<script type="text/javascript" src="./TextIconOverlay_min.js"></script>
<script type="text/javascript" src="./CurveLine.min.js"></script>
</head>
<body>
<div id="container">
</div>
<script type="text/javascript"> var outputPath = 'tiles/'; //地圖瓦片所在的文件夾
var fromat = ".jpg"; //格式/*var tileLayer = new BMap.TileLayer();
tileLayer.getTilesUrl = function (tileCoord, zoom) {
var x = tileCoord.x;
var y = tileCoord.y;
var url = outputPath + zoom + '/' + x + '/' + y + fromat;
return url;
}
var tileMapType = new BMap.MapType('tileMapType', tileLayer);*/var map = new BMap.Map("container")
var point = new BMap.Point(116.404, 39.915); // 創(chuàng)建點(diǎn)坐標(biāo)
map.centerAndZoom(point, 6); // 初始化地圖,設(shè)置中心點(diǎn)坐標(biāo)和地圖級(jí)別
// //添加地圖類型控件
map.addControl(new BMap.MapTypeControl({ mapTypes:[
BMAP_NORMAL_MAP,
BMAP_HYBRID_MAP
]}));
map.tCurrentCity("北京"); // 設(shè)置地圖顯示的城市 此項(xiàng)是必須設(shè)置的
map.enableScrollWheelZoom(true); //開(kāi)啟鼠標(biāo)滾輪縮放
//單擊獲取點(diǎn)擊的經(jīng)緯度
map.addEventListener("click",function(e){
alert(e.point.lng + "," + e.point.lat); });
var MAX = 10;
var markers = [];
var pt = null;
var i = 0;
for (; i < MAX; i++) {
pt = new BMap.Point(Math.random() * 40 + 85, Math.random() * 30 + 21);
markers.push(new BMap.Marker(pt));
}
//最簡(jiǎn)單的用法,生成一個(gè)marker數(shù)組,然后調(diào)用markerClusterer類即可。
var markerClusterer = new BMapLib.MarkerClusterer(map, {markers:markers});var beijingPosition=new BMap.Point(116.432045,39.910683), hangzhouPosition=new BMap.Point(120.129721,30.314429), taiwanPosition=new BMap.Point(121.491121,25.127053); // console.log(beijingPosition) // console.log(hangzhouPosition)
// console.log(taiwanPosition)
var points = [beijingPosition,hangzhouPosition, taiwanPosition];console.log(points)
var curve = new BMapLib.CurveLine(points, {strokeColor:"blue", strokeWeight:3,strokeOpacity:0.5}); //創(chuàng)建弧線對(duì)象
// map.addOverlay(curve); //添加到地圖中
// curve.enableEditing(); //開(kāi)啟編輯功能
</script>
</body>
</html>
格式有些亂,用的時(shí)候用在線格式化工具格一下,
其他配置文件,如瓦片之類的我放在了我第二篇帖子中,(百度地圖離線版api實(shí)現(xiàn)多點(diǎn)聚合(二))
本文發(fā)布于:2023-02-28 20:16:00,感謝您對(duì)本站的認(rèn)可!
本文鏈接:http://www.newhan.cn/zhishi/a/167766643483053.html
版權(quán)聲明:本站內(nèi)容均來(lái)自互聯(lián)網(wǎng),僅供演示用,請(qǐng)勿用于商業(yè)和其他非法用途。如果侵犯了您的權(quán)益請(qǐng)與我們聯(lián)系,我們將在24小時(shí)內(nèi)刪除。
本文word下載地址:百度地圖全國(guó)離線包(百度地圖離線包在哪里).doc
本文 PDF 下載地址:百度地圖全國(guó)離線包(百度地圖離線包在哪里).pdf
| 留言與評(píng)論(共有 0 條評(píng)論) |