<html> 
<head> 
<style> 
*{margin:0;padding:0;} 
</style> 
<script> 
function a(x,y,color) 
{document.write("<img border='0' style='position: absolute; left: "+x+"; top: "+y+";background-color: "+color+"' src='px.gif' width=1 height=1>")} 
</script> 
</head> 
<body onmouseup = 'alert(rule(event.clientX,event.clientY));'> 
<script> 
function line(x1,y1,x2,y2,color) 

var tmp; 
if(x1>=x2) 

  tmp=x1; 
  x1=x2; 
  x2=tmp; 
  tmp=y1; 
  y1=y2; 
  y2=tmp; 

for(var i=x1;i<=x2;i++) 

  x = i; 
  y = (y2 - y1) / (x2 - x1) * (x - x1) + y1; 
  a(x,y,color); 


function rule(x,y) 

x = x; 
y = y; 
r1 = y - 100 - (300-100)/(500-400)*(x-400); 
r2 = y - 300; 
r3 = y - 300 - (100-300)/(400-300)*(x-300); 
if (r1>0&&r2<0&&r3>0) 


  return "在三角形内!"; 

else 
{return "不在三角形内!";} 

line(400,100,500,300,"ff0000"); 
line(500,300,300,300,"ff0000"); 
line(300,300,400,100,"ff0000"); 
</script> 
</body> 
</html>
看下这个

解决方案 »

  1.   

    下面的rule方法没有明白他是什么意思。
    上面的line方法有问题的
    它是用x坐标来循环的,但是如果两个点x坐标相同的话呢?也就是当我要绘制水平线的时候,这个函数就绘不出来也
      

  2.   

    扫描算法:把所有点的坐标存到数组中,然后找出y轴相同的两点坐标,该两点坐标的从x1到x2画线,这样一行一行地找下去,不过效率不是很高~~~~
      

  3.   

    按照YH_Random提供的算法写的代码如下,测试成功。结贴了哈<html>
    <head><title></title></head>
    <body>
    <script language="javascript">// Author:贺渊凌 gibbon_ho 
    function drawDot(x,y,color)
    {
        var newObj = document.createElement("IMG");
        document.body.appendChild(newObj);
        with(newObj)
        {
            border=0;
            style.position='absolute';
            style.pixelLeft=(x);
            style.pixelTop=(y);
            style.backgroundColor=color;
            style.pixelWidth=1;
            style.pixelHeight=1;
        }
    };
    function drawLine(x1,y1,x2,y2,color)
    {
        if(x1==x2 && y1==y2)return;
        var w = x2-x1;
        var h = y2-y1;
        var length = Math.round(Math.sqrt(Math.pow(w,2)+Math.pow(h,2)));    for(var i=0;i<=length;i++)
        {        drawDot(Math.round(x1+w*i/length),Math.round(y1+h*i/length),color);    }
        
        return (w>0)?(Math.asin(h/length)):(Math.PI-Math.asin(h/length));
    };
    function sequence(x1,y1,x2,y2,x3,y3)//从y值高到低
    {
        var h1,h2,h3,temp;
        h1 = {
            x:x1,
            y:y1
        };
        h2 = {
            x:x2,
            y:y2
        };
        h3 = {
                x:x3,
                y:y3
            };
        if(h1.y>h2.y)
        {
            temp = h2;
            h2 = h1;
            h1 = temp;
        }
        if(h2.y>h3.y)
        {
            temp = h3;
            h3 = h2;
            h2 = temp;
        }
        if(h1.y>h2.y)
        {
            temp = h2;
            h2 = h1;
            h1 = temp;
        }
        
        return [h3,h2,h1];};
    function drawTriangle(x1,y1,x2,y2,x3,y3,color,fill)
    {  
        if(fill)
        {
            var data = sequence(x1,y1,x2,y2,x3,y3);
            var hx = getX(data[0].x,data[0].y,data[2].x,data[2].y,data[1].y);
            fillHorizTriangle(data[0].x,data[0].y,hx,data[1].x,data[1].y,color);
            fillHorizTriangle(data[2].x,data[2].y,hx,data[1].x,data[1].y,color);
        }
        else
        {
            drawLine(x1,y1,x2,y2,color);
            drawLine(x2,y2,x3,y3,color);
            drawLine(x3,y3,x1,y1,color);
        }
    };function getX(x1,y1,x2,y2,y)
    {
        if(y1==y2)return null;
        
        var w=(x2-x1);
        var h=(y2-y1);
        
        return Math.round(x1+(y-y1)*w/h);
        
    };
    function fillHorizTriangle(x1,y1,x21,x22,y2,color)
    {    if(y1==y2)return null;
        var h = Math.abs(y1-y2);
        var bottom = Math.min(y1,y2);
        for(var i=0;i<=h;i++)
        {
            var x_1 = getX(x1,y1,x21,y2,bottom+i);
            var x_2 = getX(x1,y1,x22,y2,bottom+i);
            drawLine(x_1,bottom+i,x_2,bottom+i,color);
        }
    };
    function drawArrow(x1,y1,x2,y2,color,r,fill)
    {
        var radian = drawLine(x1,y1,x2,y2,color);   
        var radianArrow1 = radian+Math.PI+0.25;
        var radianArrow2 = radian+Math.PI-0.25;
        var xa1 = x2+r*Math.cos(radianArrow1);
        var ya1 = y2+r*Math.sin(radianArrow1);
        var xa2 = x2+r*Math.cos(radianArrow2);
        var ya2 = y2+r*Math.sin(radianArrow2);
        if(fill)
        {
            drawTriangle(x2,y2,xa1,ya1,xa2,ya2,color,true);
        }
        else
        {
            drawLine(x2,y2,xa1,ya1,color);
            drawLine(x2,y2,xa2,ya2,color); 
        }
    };drawArrow(400,400,500,100,"#000000",30,true);
    drawArrow(400,400,400,200,"#000000",30,true);
    drawArrow(400,400,300,100,"#000000",15,true);
    drawArrow(400,400,200,400,"#000000",30,true);
    drawArrow(400,400,200,600,"#000000",15,true);
    drawArrow(400,400,400,800,"#000000",30,true);
    drawArrow(400,400,700,600,"#000000",15,true);
    drawArrow(400,400,500,400,"#000000",30,true);
    </script>
    </body>
    </html>