网站首页 > 知识剖析 正文
在vue项目中使用maptalks已经是好几年了,中间也遇到很多的困惑,主要是感觉文档不是很全,可能是我阅读的不够仔细,比如更新marker点的图标等方法都是在作者的github上找到的,如:
marker.updateSymbol({
markerWidth:{[[14,18],[18,120]]},
markerHeight:{[14,24],[18,160]},
markerFile:require('@/assets/img/marker.png')
}),
marker.setZIndex(100)
这样就可以更新落点的样式了,但是有时候落点的图标并没有加载出来,控制台会出现no img found for http://10.167.54.80:8080/#//xxxxx.png的警告,出现的原因是因为:更新的图片过大,我用的图标是30x30,大小为1.45kb,换成72X74的,大小为4.2kb就会报这个问题
解决方法 (亲测有效)
1:把图片的尺寸改小,到底适应多大的图片没有亲测过,
2:换成大图片后图片的路径不对,变成了 http://10.xxx.xxx.xx:8080/#//xxxxx.png,
那就动态修改路径,如点击获取当前marker
let markerImg=type==='你的判断'?window.location.origin+require('@/assets/big.png'):require('@/assets/small.png')
marker.updateSymbol({
markerWidth:{[[14,18],[18,120]]},
markerHeight:{[14,24],[18,160]},
markerFile:markerImg
}),
这样就可以了。
暂时没有搞懂加载大图标时会出现这样的问题,有空读下源码可能会找到答案!有兴趣的朋友可以多多交流和探讨!
- 上一篇: Web安全概览
- 下一篇: 如何让浏览器更快地加载网络资源?
猜你喜欢
- 2024-11-24 浏览器跨域问题以及常用解决方案
- 2024-11-24 14个前端小知识,我猜你每天都会遇到
- 2024-11-24 跨域问题的4种解决方案
- 2024-11-24 什么是跨域?跨域解决方法
- 2024-11-24 构建rancher自定义ui的前端镜像
- 2024-11-24 你应该知道的前端小知识,初学者,确定不点进来看看吗?
- 2024-11-24 15个前端小知识
- 2024-11-24 记一场纯JS赛——DiceCTF2021 Web题解
- 2024-11-24 如何基于 Elasticsearch 实现排序沉底或前置
- 2024-11-24 如何查找网站源IP地址
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)