#wxml代码#
<view class="flex-style">
<view class="flex-item active" bindtouchstart="goToCar">驾车</view>
<view class="flex-item" bindtouchstart="goToWalk">步行</view>
<view class="flex-item" bindtouchstart="goToBus">公交</view>
<view class="flex-item" bindtouchstart="goToRide">骑行</view>
</view>
<view class="map_box">
<map id="navi_map" longitude="{{longitude}}" latitude="{{latitude}}" scale="12" markers="{{markers}}" polyline="{{polyline}}" show-location="true"></map>
</view>
<view class="text_box">
<view class="text">{{distance}}</view>
<view class="text">{{cost}}</view>
<view class="detail_button" bindtouchstart="goDetail">详情</view>
</view>
#js代码#
var amapFile = require('../../utils/amap-wx.js');
var config = require('../../utils/config.js');
Page({
data: {
markers: [{
iconPath: "../../img/mapicon_navi_s.png",
id: 0,
latitude:'',
longitude:'',
width: 23,
height: 33
},{
iconPath: "../../img/mapicon_navi_e.png",
id: 0,
latitude:'',
longitude:'',
width: 24,
height: 34
}],
distance: '',
cost: '',
polyline: []
},
onLoad: function() {
var that = this;
var key = config.Config.key;
var myAmapFun = new amapFile.AMapWX({key: key});
myAmapFun.getDrivingRoute({
success: function(data){
origin: data[0].longitude,data[0].latitude;
destination: data[1].longitude,data[1].latitude;
var marker = [{
latitude: data[0].latitude,
longitude: data[0].longitude
},
{
latitude: data[1].latitude,
longitude: data[1].longitude
}
]
that.setData({
markers: marker[0],
latitude: data[0].latitude,
longitude: data[0].longitude
});
that.setData({
markers: marker[1],
latitude: data[1].latitude,
longitude: data[1].longitude
});
var points = [];
if(data.paths && data.paths[0] && data.paths[0].steps){
var steps = data.paths[0].steps;
for(var i = 0; i < steps.length; i++){
var poLen = steps[i].polyline.split(';');
for(var j = 0;j < poLen.length; j++){
points.push({
longitude: parseFloat(poLen[j].split(',')[0]),
latitude: parseFloat(poLen[j].split(',')[1])
})
}
}
}
that.setData({
polyline: [{
points: points,
color: "#0091ff",
width: 6
}]
});
if(data.paths[0] && data.paths[0].distance){
that.setData({
distance: data.paths[0].distance + '米'
});
}
if(data.taxi_cost){
that.setData({
cost: '打车约' + parseInt(data.taxi_cost) + '元'
});
}
}
})
},
goDetail: function(){
wx.navigateTo({
url: '../navigation_car_detail/navigation'
})
},
goToCar: function (e) {
wx.redirectTo({
url: '../navigation_car/navigation'
})
},
goToBus: function (e) {
wx.redirectTo({
url: '../navigation_bus/navigation'
})
},
goToRide: function (e) {
wx.redirectTo({
url: '../navigation_ride/navigation'
})
},
goToWalk: function (e) {
wx.redirectTo({
url: '../navigation_walk/navigation'
})
}
})
怎么改才能让marker的两个标记变成活的经纬度,原来的高德地图API是两个写死的经纬度,高德路线规划,现在这个样子是我自己改的,摸索了微信小程序3天了,还不太懂,希望有大神能不吝赐教!!