我有一个Web应用,它会为每个用户绘制一条折线(跟踪运动),我想加入一些功能,使Web应用用户可以通过改变折线的颜色来“聚焦”于某个用户。首先需要将所有折线都改成红色,然后将选定的折线改为蓝色。我认为最好避免专注于一条线,然后尝试关注另一条线并将它们都设为蓝色。我真的不知道如何实现这一点,但是我有一个当点击名称时返回用户ID的功能。我只需要迭代每个对象(每个用户的折线)以先将它们全部更改为红色,然后将特定的折线更改为蓝色。以下是我的一些代码,如果您能指导我方向,我将不胜感激。谢谢。这是我的代码的精简版本,希望它提供足够的信息。
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();
Users.prototype...
函数放在哪里?是在Users()还是User(id)中?我还没有使用过原型,所以不确定它们的工作方式。我需要把第一个函数(this.polyline...)移到Users()中吗?我在你的代码中添加了this.
,它按预期工作。只是我不确定如何移动所有这些内容。 - mkyong