第1行: | 第1行: | ||
− | <div id="examples_api_center"><div class="title-hd">基础地图展示</div></div> | + | =<div id="examples_api_center"><div class="title-hd">基础地图展示</div></div> |
<div class="demos_wrap"> | <div class="demos_wrap"> | ||
<div class="header"><div class="active">功能场景</div></div> | <div class="header"><div class="active">功能场景</div></div> | ||
第12行: | 第12行: | ||
|- | |- | ||
| Map | | Map | ||
− | | map. | + | | new BMapGL.Map('container') |
− | | | + | | 创建GL版地图 |
− | | [[jspopularGL/guide/ | + | | [[jspopularGL/guide/show|创建地图]] |
+ | |- | ||
+ | | Map | ||
+ | | map.setMapType(BMAP_EARTH_MAP) | ||
+ | | 变更地图类型 | ||
+ | | [[jspopularGL/guide/maptype|变更地图类型]] | ||
|} | |} | ||
</div></div><div class="header"><div class="active">核心代码</div></div> | </div></div><div class="header"><div class="active">核心代码</div></div> | ||
第20行: | 第25行: | ||
<div class="pre-wrap-w pre-wrap-w-and"> | <div class="pre-wrap-w pre-wrap-w-and"> | ||
<pre class="prettyprint prettyprinted pre-and"> | <pre class="prettyprint prettyprinted pre-and"> | ||
− | + | var map = new BMapGL.Map('container'); | |
− | + | map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 18); // 设置中心点和地图级别 | |
− | + | map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放 | |
− | + | map.addControl(new BMapGL.NavigationControl3D()); // 添加3D控件 | |
− | + | ||
− | + | function changeMapType(e) { | |
− | + | if (e.className.indexOf('current') === -1) { | |
− | + | var allLi = document.getElementsByClassName('btn'); | |
− | + | for (var i = 0; i < allLi.length; i++) { | |
− | + | allLi[i].className = allLi[i].className.replace(' current','').trim(); | |
− | + | } | |
− | + | e.className += ' current'; | |
− | + | if (e.className.indexOf('normal') != -1) { | |
− | + | map.setMapType(BMAP_NORMAL_MAP); | |
− | + | } else { | |
− | + | map.setMapType(BMAP_EARTH_MAP); | |
− | + | ||
} | } | ||
+ | } | ||
+ | } | ||
</pre> | </pre> | ||
<div class="pre-btn"><div class="pre-btn-copy-and">复制</div><div class="pre-btn-cb-and">深色</div></div><div class="success">复制成功</div></div></div></div></div> | <div class="pre-btn"><div class="pre-btn-copy-and">复制</div><div class="pre-btn-cb-and">深色</div></div><div class="success">复制成功</div></div></div></div></div> |
2020年10月9日 (五) 14:18的版本
=基础地图展示
功能场景
该示例介绍如何使用GL版API创建一张地图,并通过设置地图类型方法,展示3D地图与卫星地球地图之间的切换。
DEMO
https://mapopen-website-wiki.cdn.bcebos.com/wiki/android-loc-sdk/sdkgetAK.mov
白天模式与黑夜模式切换
核心代码
var map = new BMapGL.Map('container'); map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 18); // 设置中心点和地图级别 map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放 map.addControl(new BMapGL.NavigationControl3D()); // 添加3D控件 function changeMapType(e) { if (e.className.indexOf('current') === -1) { var allLi = document.getElementsByClassName('btn'); for (var i = 0; i < allLi.length; i++) { allLi[i].className = allLi[i].className.replace(' current','').trim(); } e.className += ' current'; if (e.className.indexOf('normal') != -1) { map.setMapType(BMAP_NORMAL_MAP); } else { map.setMapType(BMAP_EARTH_MAP); } } }
复制
深色
复制成功