我目前正在每隔 x 秒动态更新标记,这里数据更新和放置标记,但这里的问题是数据何时根据图标更新,图像未在我放置的位置更新
0== red
1== green
2== orange
here this.markerIcon = this.mapData[i].OrderState; this is my icon color status
下面是我获取动态数据的代码
if(this.mapData!=null && this.mapData.length>0){
for (var i = 0; i < this.mapData.length;i++){
this.latlng = {lat: parseFloat(this.mapData[i].latitude), lng: parseFloat(this.mapData[i].longitude)};
this.markerName = this.mapData[i].Name;
this.markerIcon = this.mapData[i].OrderState;
if (this.markerStore.hasOwnProperty(this.mapData[i].DriverId)) {
if (this.markerIcon === "0") {
this.iconDisplay = this.red;
} else if (this.markerIcon === "1") {
this.iconDisplay = this.green;
} else if ( this.markerIcon === "2") {
this.iconDisplay = this.orange;
} else if (this.markerIcon === "3") {
this.iconDisplay = this.building;
}
this.markerStore[this.mapData[i].DriverId].setPosition(this.latlng);
} else {
if (this.markerIcon === "0") {
this.iconDisplay = this.red;
} else if (this.markerIcon === "1") {
this.iconDisplay = this.green;
} else if ( this.markerIcon === "2") {
this.iconDisplay = this.orange;
} else if (this.markerIcon === "3") {
this.iconDisplay = this.building;
}
var marker = new google.maps.Marker({
position: this.latlng,
map:this.mapObject,
icon:this.iconDisplay
});
this.markerStore[this.mapData[i].DriverId] = marker;
}
}
}
}
});
当我按下重新加载页面时,图标颜色发生了变化,我不知道出了什么问题
Json数据:
{
"Data": [
{
"DriverId": "138",
"Name": "A",
"OrderState": "1",
"latitude": "35.20714666666667",
"longitude": "55.32000000001"
},
{
"DriverId": "4",
"Name": "T",
"OrderState": "2",
"latitude": "35.7828333333337",
"longitude": "58.764833333334"
},
{
"DriverId": "7",
"Name": "AL",
"OrderState": "2",
"latitude": "35.677546666666665",
"longitude": "85.27641833333334"
},
{
"DriverId": "111",
"Name": "Waseem.",
"OrderState": "0",
"latitude": "25.199691666666663",
"longitude": "55.249858333333336"
},
{
"DriverId": "5",
"Name": "D",
"OrderState": "0",
"latitude": "35.19730666666667",
"longitude": "65.56744999999999"
},
{
"DriverId": "137",
"Name": "G",
"OrderState": "1",
"latitude": "36.240411666666667",
"longitude": "65.27219333333334"
}
],
"ErrorCode": "201 - Success",
"Message": "Success",
"Status": true
}
这里基于订单状态值 im 在标记图像中更改 0 == 红色和 1 == 绿色和 2 == 橙色每 10 秒更新一次数据,0 也可能变为 1 或 2
最佳答案
如果标记存在而不是替换数组中的元素,则删除旧标记并添加新标记。
if (this.mapData[i].DriverId in this.markerStore) {
this.markerStore[this.mapData[i].DriverId].setMap(null);
}
// create here the new one as you did before
关于javascript - 每 x 秒刷新一次数据后无法动态更新图标图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49690904/