Canvas не рисует линии
 

Ребята, помогите плиз. Новичок в JS, туплю...

рисую в цикле линии в Canvas, координаты линий находятся в числовом массиве. Почему-то, вот такое линии рисует:
а если передаю в качестве координат массив, то ничего не рисуется:
массив числовой. typeof выдает number

Помогите плиз :help:

Вот:

А массив заполняется в другой функции (x и y числа):

Dmitriy_14,
Новичок в JS, проблема у тебя в индексе.
Вместо:

context.lineTo(masXX[i-1],masYY[i]);

Надо:

context.lineTo(masXX[i],masYY[i]);

Нет, здесь все правильно (линии рисуются из точки, где предыдущая линия была), но попробовал, как вы написали, все-равно не рисует.

Dmitriy_14,
Ты что лестницу рисуешь?
У меня прокатило

var canvas = document.getElementById('canvas2');
    var context = canvas.getContext('2d');
    var XX = [0, 40, 80, 120, 160, 200, 240, 280, 320];
    var YY = [0, 40, 80, 120, 160, 200, 240, 280, 320];

    context.beginPath();

    var i = -1;
    while (++i < XX.length) {
      context.moveTo(XX[i], YY[i]);
      context.lineTo(XX[i], YY[i + 1]);
      context.moveTo(XX[i], YY[i + 1]);
      context.lineTo(XX[i + 1], YY[i + 1]);
    };
    context.stroke();

Dmitriy_14,
Но это НЕ есть хорошо два массива координат иметь. Потому что можно где-то что-то недоглядеть
Лучше ты это..того..класс точек сделай и пихай объект-точку в массив

function Point(x, y) {
         var point = {};
         point.posX = x;
         point.posY = y;
         return point;
      }
 var myPoints = [];
 /*....*/
 myPoints.push(new Point(0, 0));

 Ну короче в таком ключе

Да, делаю рисовалку дерева DOM, для красоты линии к блокам.
Спасибо большое за совет!

Так у тебя рисование снаружи цикла.

Какие еще точки? Две координаты, "двумерный" массив, берешь по токену и рисуешь. Запутали сами себя в трех соснах.

warren buffet,
context.stroke() делает обозначенные контуры видимыми. "Рисуется" всё в цикле

Немного оффтоп, но тем не менее:
если толщина линии - нечетное число пикселей (1, 3, 5, ...), то в lineTo и moveTo надо прибавить 0.5 ко всем координатам. Тогда линия будет четкая. А если не прибавить, то размытая.

это как раз для тех случаев, когда "подытоживаем" функцией stroke()