Cambiar polilínea color dinámicamente

Question

Tengo una aplicación web que dibujará una polilínea para cada usuario (seguimiento del movimiento) y me gustaría incorporar algunas funciones que permitan al usuario de la aplicación web 'enfocarse' en un determinado usuario cambiando el color de la polilínea. Tendrá primero que cambiar todas las polilíneas a rojo, y luego cambiar la polilínea seleccionada a azul. Creo que esto es lo mejor para evitar enfocarse en una línea, luego tratar de enfocarse en otra y tener ambas azules. Realmente no estoy seguro de cómo implementar esto, pero tengo una funcionalidad que devuelve una identificación de usuario cuando se presiona el nombre. Solo necesito iterar sobre cada objeto (la polilínea de cada usuario) para cambiarlos primero a rojo, luego cambiar el específico a azul. Aquí hay algunos códigos a continuación. Si pudieras señalarme en la dirección correcta, te lo agradecería. Gracias. Esta es una versión condensada de mi código, así que espero que brinde suficiente información.

function User(id) { 
this.id = id; 

this.locations = []; 

this.mark = 0; 

this.getId = function() { 
    return this.id; 
}; 

this.addLocation = function(latitude, longitude) { 
    this.locations[this.locations.length] = new google.maps.LatLng(latitude, longitude);   
}; 
var polyline; 
this.drawPolyline = function(loc) { 
     polyline = new google.maps.Polyline({ 
     map: map, 
     path: loc, 
     strokeColor: "#FF0000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
     }); 
    polyline.setMap(map); 
}; 

this.removePolyline = function() { 
    if (polyline != undefined) { 
     polyline.setMap(null); 
     } 
    } 
this.get_user_info = function(user_id) { 

var datastr = 'id=' + user_id; 
$.ajax({  
    type: "POST", 
    url: 'user_api.php', 
    data: datastr,  
    dataType: 'json',     
    success: function(data){ 
     var phone_id = data[0]; 
     var leftDiv = document.createElement("div"); //Create left div 
     leftDiv.id = "left"; //Assign div id 
     leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes 
     leftDiv.style.background = divColor; 
     //user_name = document.createTextNode(fullName + ' '); //Set user name   
     a = document.createElement('a'); 
     a.href ="javascript:setFocus('" + phone_id + "');"; 
     a.innerHTML = fullName + ' '; 
     leftDiv.appendChild(a); 
     } 
    }); 
    } 
} 

function setFocus(phone_id) { 
    alert(phone_id); 
} 
function Users() { 
this.users = {}; 

this.createUser = function(id) { 
    this.users[id] = new User(id); 
    return this.users[id]; 
}; 

this.getUser = function(id) { 
    return this.users[id];  
}; 

this.removeUser = function(id) { 
    var user = this.getUser(id); 
    delete this.users[id]; 
    return user; 
}; 
} 

var users = new Users(); 

Answer 1

Actualmente no se está almacenando la polilínea en el interior del objeto-usuario, primero debe hacerlo para que la línea accesible después:

this.drawPolyline = function(loc) { 
     this.polyline = new google.maps.Polyline({//<--note the this 
     map: map, 
     path: loc, 
     strokeColor: "#FF0000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
     }); 
    this.polyline.setMap(map); 
}; 

ahora usted será capaz de higlight una línea:

Users.prototype.highlightLine=function(id) 
{ 
    for(var k in this.users) 
    { 
    this.users[k].polyline.setOptions({strokeColor:(id===k)?'blue':'red'}); 
    } 
} 

//use it 
users.highlightLine(5)//will highlight the line for user with id 5