百度地图(1)基本嵌入

学习目标

完成本单元后,您将能够:

    • 了解百度地图API资源。
    • Visualforce Page嵌入百度地图。

调用百度地图,首先需要注册一个百度开发者账号。注册地址参考:http://developer.baidu.com/

登陆百度地图开放平台。打开控制台。在控制台中创建应用。系统自动生成访问应用(AK)

打开百度地图样例开发平台http://lbsyun.baidu.com/jsdemo.htm#a1_2

拷贝应用程序的(AK)替换你的密钥。点击运行进行测试。

登陆https://login.salesforce.com。创建Visualforce Page名称为map_base。

样例环境:user@baiduapi.dev/123456

Visualforce Page代码如下:

<apex:page showHeader=”true” sidebar=”true” >
<style type=”text/css”>
#allmap {width: 400px;height: 300px;overflow: hidden;margin:0;font-family:”微软雅黑”;}
</style>
<script type=”text/javascript” src=”https://api.map.baidu.com/api?v=2.0&ak=6UI8Ghw4gNU89uOH9Nny11u5″></script>
<div id=”allmap”></div>
<script type=”text/javascript”>
var map = new BMap.Map(“allmap”);
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
map.addControl(new BMap.MapTypeControl({
mapTypes:[
BMAP_NORMAL_MAP,
BMAP_HYBRID_MAP
]}));
map.setCurrentCity(“北京”);
map.enableScrollWheelZoom(true);
</script>
</apex:page>

打开Page。https://c.ap1.visual.force.com/apex/map_base效果如下图: