用js绘图 
[ 作者: westfly 添加时间: 2001-4-27 23:24:49 ]
来源:无忧脚本 http://www.51js.com/ <object id=DirectDraw 
classid="CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" 
style="positiion:absolute;top:0;left:0;width:320;height:200" 

<param name="line0001" value="绘图指令1"> 
<param name="line0002" value="绘图指令2"> 
... 
</object> 
绘图指令分类: 
(一)常见形状 
1.矩形类 //rotation是以度为单位的旋转角度 
Rect(x ,y, width, height, rotation) //矩形 
Oval(x ,y, width, height, rotation) //椭圆 
RoundRect(x ,y, width, height, arcWidth, arcHeight, rotation) 
2.弧形类 
Arc(x ,y, width, height, startAngle, arcAngle, rotation) //弧形 
Pie(x ,y, width, height, startAngle, arcAngle, rotation) //饼图 
3.多边形类 
Polygon(nPoints, x1, y1, x2, y2, [x3, y3, ....], rotation) //闭合 
Polyline(nPoints, x1, y1, x2, y2, [xn, yn, ....], rotation) //不闭合 
(二)效果函数 
1.线条效果 
SetLineColor(r, g, b) //设置画线颜色 
SetLineStyle(style) //style=(1:实线;2:虚线;0:隐藏) 
2.填充效果 
SetFillColor(r, g, b, backr, backg, backb) 
SetFillStyle(style) //style=(1:实心;2:透明;3:-;4:|;5:\;6:/;7:+;8:x) 
(三)文字输出函数 
SetFont('字体',width,height,r,g,b) //设置字体 
Text('要输出的文字内容', x,y,z) //输出文字 
控制函数 //定义<object>后在<script></script>里使用。 
引用格式:DirectDraw.FunctionName() 
rotate(x-rotation, y-rotation, z-rotation) //旋转 
scale(x-scale,y-scale,z-scale) //缩放 
translate(x-coordinate,y-coordinate,z-coordinate) //平移 
setIdentity() //复原 
clear() //清除,清除后无法恢复! 

解决方案 »

  1.   

    你会用applet 画吗?道理一样
    可以用servlet生成jpg,gif图参考:
    import  javax.servlet.*;  
    import  javax.servlet.http.*;  
    import  java.io.*;  
    import  java.util.*;  
    import  com.sun.image.codec.jpeg.*;  
    import  java.awt.image.*;  
    import  java.awt.*;  
    public  class  JPEGServlet  extends  HttpServlet  {  
    //Process  the  HTTP  Get  request  
    public  void  doGet(HttpServletRequest  request,  HttpServletResponse  response)  
    throws  ServletException,  IOException  {  
    response.setContentType(  "image/jpeg  ");  
    ServletOutputStream  out  =  response.getOutputStream();  
    BufferedImage  image  =  new  BufferedImage(100,100,  BufferedImage.TYPE_INT_RGB);  
    Graphics  g  =  image.getGraphics();  
    g.setColor(Color.green);  
    g.fillRect(0,  0,  100,  100);  
    g.setColor(Color.red);  
    g.drawOval(0,  0,  100,100);  
    JPEGImageEncoder  encoder  =JPEGCodec.createJPEGEncoder(out);  
    encoder.encode(image);  
    out.close();  
    }  
    //Process  the  HTTP  Post  request  
    public  void  doPost(HttpServletRequest  request,  HttpServletResponse  response)  
    throws  ServletException,  IOException  {  
    doGet(request,response);  
    }  
    //Get  Servlet  information  
    public  String  getServletInfo()  {  
    return    "JPEGServlet  Information  ";  
    }  
    }  
     
    Acme公司有转门的画兔类,你可以去  看看  
     
      

  2.   

    我也刚刚见过<html> 
    <body> 
    <object id='uu' width=624 height=427 left=0 top=0 
    style="positon:abosolute;left:0;top:0;" 
    classid="CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6"> 
    <param Name="Line0001" Value="SetFillColor(255,0,0)"> 
    <param Name="Line0002" Value="SetLineStyle(1)"> 
    <param Name="Line0003" Value="SetFillStyle(14)"> 
    <param Name="Line0004" Value="SetLineColor(20,200,34)"> 
    <param Name="Line0005" Value="PolyLine(5,-60,-80,200,200,230,40,40,50,-60,-80)"> 
    // 你要的这一行。 
    <param Name="Line0006" Value="SetFont('楷体_gb2312',60,80,900)"> 
    <param Name="Line0007" Value="Text('我爱你',-120,-80,90)"> 
    <param Name="Line0008" Value="Arc(-100,-70,200,100,90,180,76)"> 
    <param Name="Line0009" Value="SetFillColor(0,255,255,0,0,255)"> 
    <param Name="Line0010" Value="Oval(100,-70,200,100,0)"> 
    </object> 
    </body> 
    </html>