web端調百度地圖頁面

在點擊進入地圖的入口（下麵數據是vue渲染的數據）

<a class="navigation"  v-if="merchant.longitude && merchant.latitude"
   href="http://api.map.baidu.com/marker?location={{merchant.latitude}},{{merchant.longitude}}&title={{merchant.name}}&content={{merchant.address}}&output=html&src=hair">//latitude，longitude經緯度，name店名，address詳細地址

    <span><img src="../img/navigation.png"></span>
    <span class="arrive">到店</span>
</a>
<a class="navigation" v-else
        href="http://api.map.baidu.com/geocoder?address={{merchant.province + merchant.city + merchant.district + merchant.address}}&output=html&src=hair">
    <span><img src="../img/navigation.png"></span>
    <span class="arrive">到店</span>
</a>

在引用兩段百度js文件

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&amp;ak=ztcvocCR1iGzerE5RhLXWHSjPQsZ6X9G"></script>
<script type="text/javascript" src="http://api.map.baidu.com/getscript?v=2.0&amp;ak=ztcvocCR1iGzerE5RhLXWHSjPQsZ6X9G&amp;services=&amp;t=20171031174121"></script>

var data = {
    loc: JSON.parse(sessionStorage.getItem("loc")) || null, // 當前位置
};

var map;
function initMap() {
    try {
        map = new BMap.Map("l-map");
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                console.log('您的位置：' + r.point.lng + ',' + r.point.lat);//（lng，lat經緯度）
　　　　　　　　　　sessionStorage.setItem("loc", JSON.stringify(r.point));

                data.loc = r.point;//data.loc後臺返回數據
            } else {
                console.warn('failed\n' + this.getStatus());
                data.loc = defaultPoint;
            }
            loadMerchantInfo();//調用後臺數據
        }, {enableHighAccuracy: true});
    } catch (err) {
        loadMerchantInfo();
    }
}
if (data.loc) {
    loadMerchantInfo();
} else {
    initMap();
}