1. 小程序能否使用字體圖標
您好。小程序可以使用字體圖標,但是在微信小程序中使用字體圖標 ,不通過轉換成base64的方式實現。為了美化微信小程序,可以適當的使用一些小圖標,這樣體驗也更友好些
2. 小程序可以在地圖加上商家圖標嗎
一、在開發微信小程序地圖的過程中,有這樣一個需求,用戶發表祝福語,然後存入資料庫,可以在地圖上顯示用戶頭像並且點擊用戶頭像時顯示祝福語。
二、自己在開發時遇到的問題:
1.微信頭像是網路圖片,而地圖的markers中的iconPath只能使用本地圖片
2.將網路圖片緩存到本地,但是因為小程序的非同步執行導致圖片不能顯示
三、解決辦法:
1.解決微信頭像是網路圖片的問題,可以使用wx.downloadFile({})方法來將頭像緩存到本地,然後再將本地路徑賦給iconPath即可,第一個不能使用網路圖片的問題解決。
2.非同步請求導致本地緩存的圖片不能在地圖上顯示,我的解決辦法是,先通過request請求獲取到祝福語後,用for循環賦值給markers,iconPath路徑填寫一個本地路徑,同時調用一個方法,獲取當前用戶頭像的本地緩存路徑,獲取成功後賦值給markers中每個對象的iconPath,所以一般來說,地圖上的圖片會有切換,首先顯示的是本地的統一的圖片,經過一段時間的請求後,圖片一個個變為用戶頭像。
四、相關操作代碼
getBlessing: function(){
var that = this;
var getUserPic = function (pic_url,i) {
let cachePath;
if(pic_url==null || pic_url=='') return;
wx.downloadFile({
url: pic_url,
success: (pathInfo) => {
// pathInfo.path 這是下載成的緩存鏈接,模擬器marker有時不支持http開頭,真機不影響,得去掉http:/
cachePath = pathInfo.tempFilePath.replace("http:/", '').replace("https:/", '')//真機中無需replace,都支持,
var mak = "markers[" + i +"].iconPath";
that.setData({
[mak]: cachePath
})
}
})
}
wx.request({
url: '你的後台請求地址',
method: 'POST',
success: function (res) {
var list = res.data.list;
var tempArr = [];
var includeArr = [];
var item = {};
var includeItem = {};
for (var i = 0; i < list.length; i++) {
var pic = getUserPic(list[i].user.user_pic,i);
item = {
iconPath: '/images/icon/small-logo.png',
id: list[i].id,
latitude: list[i].latitude,
longitude: list[i].longitude,
width: 30,
height: 30,
alpha: 0.8,
callout: {
content: list[i].content,
color: '#FFFFFF',
fontSize: 10,
borderRadius: 10,
bgColor: '#F44336',
padding: 5,
display: 'BYCLICK',//'BYCLICK':點擊顯示; 'ALWAYS':常顯
}
}
includeItem = {
latitude: list[i].latitude,
longitude: list[i].longitude,
}
tempArr.push(item);
includeArr.push(includeItem);
}
that.setData({
markers: tempArr,
includepoints: includeArr,
count: res.data.count
})
console.log(that.data.markers)
}
})
},
五、效果截圖
3. 微信小程序可以用阿里字體圖標嗎
可以使用,但是一般大的平台圖標有涉及到版權的問題,希望知曉