uniapp webview 嵌html,html 引入百度地图. 百度地图的marker图标 ios 展示成三角形,不展示传入相对路径 的图片
- 发布:2024-01-23 17:03
- 更新:2024-02-02 19:06
- 阅读:344
uniapp webview 嵌html,html 引入百度地图. 百度地图的marker图标 ios 展示成三角形,不展示传入相对路径 的图片
1***@qq.com (作者)
百度地图用的 点聚合图层,marker 图标 只能传object(canvas dom) 、string(图片url地址) 本地的图标放到路径上,l离线打包 Android 可以,ios 展示成图片的样子
1***@qq.com (作者)
//正常
let pointT = new BMapGL.Point(lng,lat); // 创建点坐标
let marker1 = new BMapGL.Marker(pointT)
map.addOverlay(marker1);
//不展示
let myIcon = new BMapGL.Icon('../map/icwarn.png',
new BMapGL.Size(45, 55),{anchor:new BMapGL.Size(23, 55)});
let marker1 = new BMapGL.Marker(pointT,{
icon: myIcon
})
map.addOverlay(marker1);
1***@qq.com (作者)
我现在想在html 中将本地图标转base64, 有掉到一个坑里。。。。
//获取base64 图片
export function convertImgToBase64(url, callback) {
var canvas = document.createElement('canvas');
var img = new Image();
img.crossOrigin = 'Anonymous';
img.onload = function() {
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext('2d');
ctx.drawImage(img, 0, 0);
var ext = img.src.substring(img.src.lastIndexOf('.') + 1).toLowerCase();
var dataURL = canvas.toDataURL('image/' + ext);
callback(dataURL);
canvas = null;
};
img.src = url;
}
然鹅 ,ios 使用 wkWebview 对canvas也有跨域问题,比如canvas.toDataURL,这个转base64 方法不行。
所以得另找一个将static 下面的图标转base64 的方法。
我想着可以在uniapp 的vue 文件里面转base64 然后传进html 里面,就用官网提的https://ext.dcloud.net.cn/plugin?id=123
然后。。。没有转成功,图片路径 是‘/static/xxx.png’
....继续琢磨别的 转base64 方法 记录一下