wxml:
<map id="testMap"
longitude="{{longitude}}"
latitude="{{latitude}}"
markers="{{markers}}"
bindcontroltap="controltap"
bindmarkertap="markertap"
bindcallouttap="callouttap"
polyline="{{polyline}}"
animation="{{mapAnimationData}}"
bindregionchange="regionchange"
bindtap="clickmap"
show-location
style="width:100%; height:500px;"></map>
js:
Page({
/**
* 页面的初始数据
*/
data: {
},
mapCtx: null,
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
this.mapCtx = wx.createMapContext('testMap');
var that = this;
wx.getLocation({
type: 'gcj02',
success: function (res) {
that.setData({
latitude: res.latitude,
longitude: res.longitude
});
setTimeout(function () {
that.mapCtx.getCenterLocation({
success: function (res) {
var latitude = res.latitude;
var longitude = res.longitude;
var markerData = [{
iconPath: "/resources/location.png",
id: 100,
latitude: latitude,
longitude: longitude,
width: 40,
height: 40,
callout: {
content: "点我查看",
color: "#fff",
fontSize: 12,
borderRadius: 5,
display: "ALWAYS"
}
}];
that.setData({
markers: markerData
});
}
});
}, 2000);
}
});
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
你好,这是一个已知问题,安卓下默认背景为黑色,我们会在后续版本中进行修复,敬请关注。你可以先手动设置bgColor为白色
2018/8/28 android 华为测试机 小米5s 测试机 callout 的 color 不支持简写 "#fff" 必须 这样写 "#ffffff" 才正常显示 iOS 没发现问题
css 不简写看 ? 用#ffffff
callout: {
content: that.data.title + '</br>地址:' + that.data.addr,
color: '#000',
fontSize: 16,
borderRadius: 4,
bgColor: 'white',///用#fff不行 ???
padding: 4,
display: 'ALWAYS'
}