您的位置:首页 > 其它

百度地图使用-简单使用

2014-04-27 12:30 176 查看
1、获取密钥,JavaScript API v1.4及以前版本无须申请密钥(ak),自v1.5版本开始需要先申请密钥(ak),才可使用API接口。

格式如:http://api.map.baidu.com/api?v=1.5&ak=您的密钥

2、简单使用DEMO

<script>
$(function () {
//创建地图
var map = new BMap.Map("ditu");
window.map = map;

//地图设置
map.enableDragging();            //启用地图拖拽事件,默认启用
map.enableScrollWheelZoom();    //启用地图滚轮放大缩小
map.enableDoubleClickZoom();    //启用鼠标双击放大,默认启用
map.enableKeyboard();            //启用键盘上下左右键移动地图
map.enableContinuousZoom();        //启用连续缩放效果

//添加地图控件
map.addControl(new BMap.NavigationControl());                    //添加默认缩放平移控件
map.addControl(new BMap.ScaleControl());                        //添加默认比例尺控件
map.addControl(new BMap.OverviewMapControl({ isOpen: 1 }));        //添加默认缩略地图控件
map.addControl(new BMap.MapTypeControl());                        //添加控件展示的类型 包括 地图 卫星 三维

map.centerAndZoom('南京', 13); // 初始化地图,设置中心点坐标和地图级别。

//添加覆盖物
addPoint();
});

function addPoint() {
var point = new BMap.Point(118.757917, 32.043227);

var myIcon = new BMap.Icon("resource/image/employee.gif", new BMap.Size(10, 18));
//创建标注图标
var marker = new BMap.Marker(point, { icon: myIcon }); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中

//添加鼠标事件
marker.addEventListener("mouseover", function () {
this.openInfoWindow(new BMap.InfoWindow(
""
, { title: '<a href=" " target="_blank">' + "我是GPS坐标" + '</a>' }
));
});

BMap.Convertor.translate(point, 0, function (currentPoint) {

var marker = new BMap.Marker(currentPoint, { icon: myIcon });
map.addOverlay(marker);
//添加鼠标事件
marker.addEventListener("mouseover", function () {
this.openInfoWindow(new BMap.InfoWindow(
""
, { title: '<a href=" " target="_blank">' + "我是百度地图坐标" + '</a>' }
));
});
});
}

</script>


View Code
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: