Здравствуйте всем. Ситуация такая. Есть 2 массива, содержащие объекты DOM. Мне нужно их соединить линиями. Лини, в зависимости от условия, должны быть разного цвета. Все хорошо соединяет, только цветом отрисовывает только одним. Помогите пожалуйста разобраться, что не так:
var canvas = document.getElementById('field');
var ctx = canvas.getContext("2d");
var elem_error, before_error;
ctx.beginPath();
ctx.lineWidth = 1;
for(var i=0; i<array0.length; i++) {
if(array0[i].node_type == 'active') {
//ctx.clearRect(array0[i].x2, array0[i].y2, 1000, 1000);
ctx.fillStyle = "#00a83c";
ctx.strokeStyle = "#00a83c";
}else if(array0[i].node_type != 'active') {
ctx.fillStyle = "#138CCB";
ctx.strokeStyle = "#138CCB";
}
for(var j=0; j<array1.length; j++) {
if(!array0[i].is_error && !array1[j].is_error) {
if(array0[i].node_ip.test(array1[j].node_ip)) {
ctx.save();
ctx.moveTo(array0[i].x2, array0[i].y2);
ctx.lineTo(array1[j].x1, array1[j].y1);
ctx.restore();
ctx.save();
ctx.translate(array1[j].x1, array1[j].y1);
if(array1[j].x1 != array0[i].x1) {
var a, b, sinus, cosinus, tangens, alpha;
a = array1[j].y1 - array0[i].y2;
b = array1[j].x1 - array0[i].x2;
tangens = Math.tan(b/a);
alpha = Math.atan(tangens);
//alert(alpha);
ctx.rotate(alpha);
}
ctx.moveTo(0, 0);
ctx.lineTo(-2, -6);
ctx.lineTo(2, -6);
ctx.lineTo(0, 0);
ctx.restore();
}
}else{
elem_error = array0[i];
before_error = array1[j];
}
}
}
//alert(before_error.node_level);
ctx.stroke();
ctx.fill();
ctx.closePath();
Отрисовывает только цветом #138CCB.
Пробовал clearRect - не получается ((
