openlayers3线段添加闪烁_openlayers 添加标记点击弹窗 定位图标闪烁

环境vue3.0 ,地图为公用组件，将添加图标标记的方法放在公共地图的初始化方法里

同一时间弹窗和定位标识都只有一个，因而我把弹窗和定位标记的dom预先写好放到了页面

//矢量标注样式设置函数，设置image为图标ol.style.Icon

function createLabelStyle(feature, icon, scale, opacity) {

return (new ol.style.Style({

image: new ol.style.Icon({

opacity: opacity,

src: icon,

scale: scale // 标注图标大小

}),

text: new ol.style.Text({

textAlign: "center", // 位置

textBaseline: "middle", // 基准线

font: "normal 12px 微软雅黑", // 文字样式

text: feature.get("name"),

fill: new ol.style.Fill({

// 文本填充样式(即文字颜色)

color: "#333"

}),

stroke: new ol.style.Stroke({

color: "#Fff",

width: 1

})

})

}));

}

// 添加标注

function draw(arr, icon, scale, opacity) {

var me = this;

/*********************显示地标**************************/

// 设置标识范围

var maxX = 99;

var minX = 78;

var maxY = 36;

var minY = 26;

//创建空的矢量容器

var vectorSource = new ol.source.Vector({});

// 设置要素点

for (let i = 1; i <= arr.length; i++) {

let t1 = Math.random() * (maxX - minX + 1) + minX;

let t2 = Math.random() * (maxY - minY + 1) + minY;

//创建图标特性

var iconFeature = new ol.Feature({

geometry: new ol.geom.Point([t1, t2], "XY"),

name: