82 lines
1.5 KiB
JavaScript
82 lines
1.5 KiB
JavaScript
|
function drawLine(fromX,fromY,toX,toY,style,pointsContainer){
|
||
|
|
var m_diffX;
|
||
|
|
var m_diffY;
|
||
|
|
var pX;
|
||
|
|
var pY;
|
||
|
|
var pointCnt=0; // count the points in current line
|
||
|
|
|
||
|
|
if (toX < fromX) {
|
||
|
|
m_diffX=fromX-toX;
|
||
|
|
} else {
|
||
|
|
m_diffX=toX-fromX;
|
||
|
|
}
|
||
|
|
|
||
|
|
if (toY < fromY) {
|
||
|
|
m_diffY=fromY-toY;
|
||
|
|
} else {
|
||
|
|
m_diffY=toY-fromY;
|
||
|
|
}
|
||
|
|
|
||
|
|
if (m_diffX > m_diffY) {
|
||
|
|
drawHorizontalLine();
|
||
|
|
} else {
|
||
|
|
drawVerticalLine();
|
||
|
|
}
|
||
|
|
|
||
|
|
function drawHorizontalLine(){
|
||
|
|
var i;
|
||
|
|
for (i=toX;i<=fromX;i++){
|
||
|
|
pX=i;
|
||
|
|
if (toY < fromY) {
|
||
|
|
pY=toY+((i-toX)*(m_diffY/m_diffX));
|
||
|
|
} else {
|
||
|
|
pY=toY-((i-toX)*(m_diffY/m_diffX));
|
||
|
|
}
|
||
|
|
drawPoint(pX,pY,style);
|
||
|
|
}
|
||
|
|
for (i=fromX;i<=toX;i++){
|
||
|
|
pX=i;
|
||
|
|
if (toY < fromY) {
|
||
|
|
pY=fromY-((i-fromX)*(m_diffY/m_diffX));
|
||
|
|
} else {
|
||
|
|
pY=fromY+((i-fromX)*(m_diffY/m_diffX));
|
||
|
|
}
|
||
|
|
drawPoint(pX,pY,style);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function drawVerticalLine(){
|
||
|
|
var i;
|
||
|
|
|
||
|
|
for (i=toY;i<=fromY;i++){
|
||
|
|
pY=i;
|
||
|
|
if (toX < fromX) {
|
||
|
|
pX=toX+((i-toY)*(m_diffX/m_diffY));
|
||
|
|
} else {
|
||
|
|
pX=toX-((i-toY)*(m_diffX/m_diffY));
|
||
|
|
}
|
||
|
|
drawPoint(pX,pY,style);
|
||
|
|
}
|
||
|
|
for (i=fromY;i<=toY;i++){
|
||
|
|
pY=i;
|
||
|
|
if (toX < fromX) {
|
||
|
|
pX=fromX-((i-fromY)*(m_diffX/m_diffY));
|
||
|
|
} else {
|
||
|
|
pX=fromX+((i-fromY)*(m_diffX/m_diffY));
|
||
|
|
}
|
||
|
|
drawPoint(pX,pY,style);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
function drawPoint(x,y,style){
|
||
|
|
if ((pointCnt++%3)==0) { // performance, don't draw all points.
|
||
|
|
var point=document.createElement("div");
|
||
|
|
point.setAttribute("class",style);
|
||
|
|
point.style.left=x+"px";
|
||
|
|
point.style.top=y+"px";
|
||
|
|
|
||
|
|
pointsContainer.appendChild(point);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|