선 그리기 (Line Drawing)

간단하게 아래와 같은 형식이 존재함.
div 를 조낸 처넣는 것.
역시 중요한 건 선분에 대한 수식이려나.

function LineTo(Ax, Ay, Bx, By)
{
    var bla = ""
    var lineLength = Math.sqrt( (Ax-Bx)*(Ax-Bx)+(Ay-By)*(Ay-By) );
    for( var i=0; i<lineLength; i++ )
    {
        bla += "<div style='position:absolute;left:"+ Math.round( Ax+(Bx-Ax)*i/lineLength  ) +"px;top:"+Math.round( Ay+(By-Ay)*i/lineLength  ) +"px;width:1px;height:1px;background:#000'></div>";
    }

    document.body.innerHTML += bla;
}

아래의 사이트에서 본 것이고, 아래의 사이트에는 더 나아가 이미지를 활용한 방법도 있고.


참고
http://www.p01.org/releases/Drawing_lines_in_JavaScript/