javaScript+vml画线

<SCRIPT LANGUAGE="JavaScript">
  var x,y,a,b; 
  function drawline(fromX,fromY,toX,toY){  
  var strElement=   "<v:Line id='line_"+fromX+"_"+fromY+"_"+toX+"_"+toY+"' from='" + fromX + "," + fromY + "' to='" + toX + "," + toY + "' strokecolor='red'></v:Line>";  
  var newPoint = document.createElement(strElement);  
  document.getElementById("map").appendChild(newPoint);    
  }
  function draw(){
    if(x==undefined&&b==undefined){x=window.event.x;y=window.event.y;return false;}
    a=window.event.x;b=window.event.y;
    drawline(x,y,a,b)
    x=a;y=b;
  }
  function draws(){
  if(x==undefined&&b==undefined){return false;}
  if(x==window.event.x&&b==window.event.y){return false;}
  if(document.getElementById("TempLine")){document.getElementById("TempLine").outerHTML=""}
  var strElement=   "<v:Line id='TempLine' from='" + x + "," + y + "' to='" + window.event.x + "," + window.event.y + "' strokecolor='red'></v:Line>";  
  var newPoint = document.createElement(strElement);  
  document.getElementById("map").appendChild(newPoint);    
  }
</SCRIPT>  
<html xmlns:v="urn:schemas-microsoft-com:vml">  
<HEAD>  
<META http-equiv="Content-Type" content="text/html;Charset=gb2312">  
<title>vml实例</title>  
<STYLE>  
v\:*{behavior:url(#default#VML);}/*声明V为VML变量*/  
</STYLE>  
</HEAD>  
<BODY>
<table border="1" align="center">
  <tr>
    <td><div id="map" style="width:600px;height:500px;background-color:#cccccc;position:relative;" onmousedown="draw();" onmousemove="draws()"></div></td>
  </tr>
</table>
</body>  
</html>

你可能感兴趣的:(JavaScript)