微信小程序--地图导览

---

前言

微信小程序,校园导览

---

一、整体框架,页面

二、主页面代码

index.wxml

代码如下（示例）：

<!-- 主页面,地图页面 -->

<view style="width: 100%;">

  <map longitude="{
   {longitude}}" style="width: 100%; height: 600px;" latitude="{
   {latitude}}"
    scale="{
   {buildlData[isSelectedBuildType].scale}}" markers="{
   {buildlData[isSelectedBuildType].data}}"
    bindmarkertap="markertap" label="{
   {buildlData[isSelectedBuildType].name}}" id="map"
    data-num="{
   {buildlData[isSelectedBuildType].data}}">


  </map>
<!-- cover-view 和scroll-view 不要放在地图组件的里面,否则真机调试时无法进行点击,图片也被覆盖了 -->
  <cover-view class="chatroom">
    <cover-image src="/img/留言板.png" bindtap="navitap" id="1"></cover-image>
  </cover-view>


  <!-- 定位的作用真机调试的时候可以体现出来 -->
  <cover-view class="img">
    <cover-image bindtap="dingwei" src="/img/location.png">
    </cover-image>
  </cover-view>

  <scroll-view scroll-y="true" scroll-into-