帮忙啊，画线末尾加个小图片！！！

kangbo818 2009-04-14 03:19:10

js两点连线函数drawLine，在线末连接一张小图片，我代码中加上了，但位置显示不对，如下代码：



//定义点的绝对坐标

function drawDot(x,y)

{

    var dot = "<table border='0' cellspacing=0 cellpadding=0><tr><td style='position: absolute; left: "+(x)+"; top: "+(y)+";background-color:#ff66ff' width=2 height=2></td></tr></table>";

    return dot;

}



//两点连线

function drawLine(x1,y1,x2,y2)

{

    

    var index;

    var line_length = Math.floor(Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1))); 

    var theta = Math.atan((x2-x1)/(y2-y1));

    var line = "<table border='0' cellspacing=0 cellpadding=0>";

    if(((y2-y1)<0 && (x2-x1)>0) || ((y2-y1)<0 && (x2-x1)<0))

    {

        theta = Math.PI + theta;

    }

    var dx = Math.sin(theta);

    var dy = Math.cos(theta);

    for(index = 0;index < line_length;index++){

        line += drawDot(x1 + index*dx,y1 + index*dy);    

    }

    line += '<img id="picture" src="image/1.jpg">';

    line += "<tr><td style='position: absolute; left: "+(x2)+"; top: "+(y2)+";background-color:#ff66ff'>";

    

    line +="</td></tr></table>";

    return line;

}

...全文

110 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

kangbo818 2009-04-14

打赏
举报

不怎么对，但我搞定了，多谢

ayound 2009-04-14

打赏
举报



  //定义点的绝对坐标

function drawDot(x,y)

{

    var dot = "<table border='0' cellspacing=0 cellpadding=0><tr><td style='position: absolute; left: "+(x)+"; top: "+(y)+";background-color:#ff66ff' width=2 height=2></td></tr></table>";

    return dot;

}



//两点连线

function drawLine(x1,y1,x2,y2)

{

    

    var index;

    var line_length = Math.floor(Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1))); 

    var theta = Math.atan((x2-x1)/(y2-y1));

    var line = "<table border='0' cellspacing=0 cellpadding=0>";

    if(((y2-y1)<0 && (x2-x1)>0) || ((y2-y1)<0 && (x2-x1)<0))

    {

        theta = Math.PI + theta;

    }

    var dx = Math.sin(theta);

    var dy = Math.cos(theta);

    for(index = 0;index < line_length;index++){

        line += drawDot(x1 + index*dx,y1 + index*dy);    

    }

    line += '<img id="picture" style="position:absolute;left:' + index*dx + ';top:' + y1 + index*dy + '" src="image/1.jpg">';

    line += "<tr><td style='position: absolute; left: "+(x2)+"; top: "+(y2)+";background-color:#ff66ff'>";

    

    line +="</td></tr></table>";

    return line;

}