首页 前端知识 地图添加发光点效果

地图添加发光点效果

2024-09-30 23:09:06 前端知识 前端哥 1001 169 我要收藏
function setLightSpot() {
// 获取两种点位数据
homepageQuery({
type: 1,
}).then((res: AnyObject) => {
if (res.code == 200) {
homepageQuery({
type: 2,
}).then((ret: AnyObject) => {
if (ret.code == 200) {
let features = [];
for (let item of res.data) {
let wkt = parse(item);
let feature = {
type: 'Feature',
properties: {
color: '#FFD86F',
},
geometry: wkt,
};
features.push(feature);
}
for (let item of ret.data) {
let wkt = parse(item);
let feature = {
type: 'Feature',
properties: {
color: '#cc7bff',
},
geometry: wkt,
};
features.push(feature);
}
addLuminousSpot(map, features);
} else {
Message.success(ret.msg);
}
});
} else {
Message.success(res.msg);
}
});
}
// 添加点位图层
function addLuminousSpot(map: any, features: AnyObject[]) {
if (map.getLayer('park-volcanoes')) {
map.removeLayer('park-volcanoes');
map.removeSource('park-volcanoes');
}
map.addLayer({
id: 'park-volcanoes',
type: 'circle',
source: {
type: 'geojson',
data: {
type: 'FeatureCollection',
features,
},
},
paint: {
'circle-radius': 2,
'circle-color': ['get', 'color'],
'circle-opacity': 0.8,
},
});
}
// 删除点位图层
function luminousSpotShow(map: any) {
if (map.getLayer('park-volcanoes')) {
map.removeLayer('park-volcanoes');
map.removeSource('park-volcanoes');
}
}
复制

转载请注明出处或者链接地址:https://www.qianduange.cn//article/18845.html
标签
评论
还可以输入200
共0条数据,当前/页
发布的文章

安装Nodejs后,npm无法使用

2024-11-30 11:11:38

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!