通过wz_jsgraphics在js下画图 _JavaScript

通过wz_jsgraphics在js上画图

setColor( "#HexColor" );

Specifies the color of the drawing "pen". Once set, this color will be used by the subsequently called drawing methods until it will be overridden through another call of setColor(). The value must be enclosed in quotation marks, and should be hexadecimal following the pattern "#rrggbb" (as usual with HTML). Color names available in HTML (for instance "maroon") may be used as well.指定绘图颜色的“笔”。一旦设置，将使用此颜色由所谓的绘图方法，直到后来便）重写通过另一个调用setColor（。值必须用引号，应该十六进制下面的模式“＃rrggbb”（通常为HTML的）。颜色名称在HTML中可用（例如为“栗色”）可作为良好。 jg.setColor("#ff0000");

or with identical result或具有相同的结果

jg.setColor("red");

setStroke( Number );

Specifies the thickness of the drawing "pen" for lines and bounding lines of shapes. Once set, this thickness will be used by the subsequently called drawing methods until it will be overridden through another call of setStroke(). Default line thickness is 1?px, as long as .setStroke() has not yet been invoked.指定绘图厚度的“笔”形状的线条和边界线。一旦设置，这个厚度将在其后所使用的方法称为图纸，直到将覆盖厚度通过另一个电话setStroke（）。默认是1像素线，只要。setStroke（）尚未被调用。

To create dotted lines, setStroke() requires the constant Stroke.DOTTED as argument. Width of dotted lines is always 1 pixel.要创建虚线，setStroke（）需要不断的争论Stroke.DOTTED作为。线条宽度的点永远是1像素。 jg.setStroke(3);

or或

jg.setStroke(Stroke.DOTTED);

drawLine( X1, Y1, X2, Y2 );
<script type="text/javascript"></script>

Line from the first to the second pair of coordinates. Line thickness is either 1?px or the value most recently specified by .setStroke() .从第一行到第二个双坐标。线的厚度是1像素值或最近指定。setStroke（）。

jg.drawLine(20,50,453,40);

drawPolyline( Xpoints, Ypoints );
<script type="text/javascript"></script>

A polyline is a series of connected line segments. Xpoints and Ypoints are arrays which specify the x and y coordinates of each point as follows:阿段折线是一系列连接线。Xpoints和Ypoints是数组的指定X和Y坐标点每如下：

var Xpoints = new Array(x1,x2,x3,x4,x5); 
var YPoints = new Array(y1,y2,y3,y4,y5);

Instead of Xpoints and Ypoints you may of course use other names provided these follow the rules for JavaScript variable names.而不是Xpoints和Ypoints你当然可以使用其他名称提供这些后续的JavaScript变量名的规则。

Line thickness is either 1px or the value most recently specified by .setStroke() .要么是1px线厚度值或最近指定。setStroke（）。

var Xpoints = new Array(10,85,93,60); 
var YPoints = new Array(50,10,105,87); 
jg.drawPolyline(Xpoints,Ypoints);

drawRect( X,?Y,?width,?height );
<script type="text/javascript"></script>

Outline of a rectangle.大纲的一个矩形。 X and Y give the co-ordinates of the left top corner. Line thickness is either 1px or the value most recently specified by .setStroke() . X和Y给予的合作角坐标的左上角。线厚度要么1px或价值最近指定。setStroke（）。

jg.drawRect(20,50,70,140);

fillRect( X,?Y,?width,?height );
<script type="text/javascript"></script>

Filled rectangle.填充矩形。 X and Y give the co-ordinates to the left top corner. X和Y给予协调的左上角。

jg.fillRect(20,50,453,40);

drawPolygon( Xpoints, Ypoints );
<script type="text/javascript"></script>

Polygon. Xpoints and Ypoints are arrays which specify the x and y coordinates of the polygon's corners as follows:多角形。Xpoints和Ypoints是数组的指定x和y坐标的多边形的角落如下：

var Xpoints = new Array(x1,x2,x3,x4,x5); 
var Ypoints = new Array(y1,y2,y3,y4,y5);

The polygon will be automatically closed if the first and last points are not identical.多边形会自动关闭，如果第一个和最后一个点是不相同的。

Line thickness is either 1px or the value most recently specified by .setStroke() .要么是1px线厚度值或最近指定。setStroke（）。

var Xpoints = new Array(10,85,93,60); 
var Ypoints = new Array(50,10,105,87); 
jg.drawPolygon(Xpoints, Ypoints);

Instead of Xpoints and Ypoints you may of course use other names provided these follow the rules for variable names.而不是Xpoints和Ypoints你当然可以使用其他名称为提供这些后续变量名的规则。

fillPolygon( Xpoints, Ypoints );
<script type="text/javascript"></script>

Filled Polygon. Parameters as for drawPolygon()填充多边形。（参数为drawPolygon）

jg.fillPolygon(new Array(10,85,93,60), new Array(50,10,105,87)); jg.fillPolygon(new Array(10,85,93,60), new Array(50,10,105,87));

drawEllipse( X,?Y,?width,?height );
<script type="text/javascript"></script>

Outline of an ellipse. Values refer to the bounding rectangle of the ellipse, X and Y give the co-ordinates of the left top corner of that rectangle rather than of its center. Line thickness is either 1px or the value most recently specified by .setStroke() .椭圆大纲1。价值观指的是椭圆的边界矩形，X和Y给予合作的矩形坐标该左上角，而不是它的中心。线厚度要么1px或价值最近指定。 setStroke（）。

jg.drawEllipse(20,50,70,140);
or或
jg.drawOval(20,50,70,140);

fillEllipse( X,?Y,?width,?height );
<script type="text/javascript"></script>

Filled ellipse. Values refer to the bounding rectangle of the ellipse, X and Y give the co-ordinates of the left-top corner of that rectangle rather than of its center.填充椭圆。价值观指的是椭圆的矩形的，X和Y给予该矩形合作左上角坐标的，而不是它的中心。

jg.fillEllipse(20,50,71,141);
or或
jg.fillOval(20,50,71,141);

fillArc( X,?Y,?width,?height,?start-angle,?end-angle );
<script type="text/javascript"></script>

Fills a pie section of an ellipse. Start-angle and end-angle may be integer numbers or decimalpoint values. Like with the other ...Ellipse() functions, X and Y specify the left-top corner of the bounding rectangle.填补了一个椭圆饼节。启动和结束角角可以整数或decimalpoint值。?与其他一样...椭圆（）函数，X和指定矩形左上角。

jg.fillArc(20,20,41,12,270.0,220.0);

setFont( "font-family", "size+unit", Style );

This method can be invoked prior to drawString() to specify or change font-family, -size and -style. Values or font-family and -size may be whatever possible in HTML, and must be enclosed in quotation marks.这种方法可以被调用之前束带（）来指定或更改字体家庭，尺寸和风格。价值或字体的家庭和尺寸可以在任何网页可能，而且必须用引号引起商标。

Available font styles:可用的字体样式：
Font.PLAIN for normal style (not bold, not italic)普通样式（粗体，斜体Font.PLAIN不）
Font.BOLD for bold fonts Font.BOLD大胆的字体
Font.ITALIC for italics Font.ITALIC为斜体
Font.ITALIC_BOLD or Font.BOLD_ITALIC to combine the latters. Font.ITALIC_BOLD或Font.BOLD_ITALIC合并后者。 Example: see drawString() below例如：见drawString()以下

drawString( "Text", X, Y );
<script type="text/javascript"></script>

I've been drawn with the Vectorgraphics Library...

Writes text to the location specified by X and Y. Differently from Java, these coordinates refer to the left top corner of the first line of the text. The string passed to drawString() must be enclosed in quotation marks. (Non-escaped) HTML tags inside the string will be interpreted. For example, "Some?Text<br>more?Text" would indeed create a line break.从Java写的文字与X和Y位置指定不同的，这些坐标是指左侧文本右上角的第一线。字符串传递给束带（）必须包含在引号标记。（非转义） HTML标记的字串内将被解释的例子。因为，“有些文字<br>更多的文字：”的确会产生一个换行符。

jg.setFont("arial","15px",Font.ITALIC_BOLD);
jg.drawString("Some?Text",20,50);

drawStringRect( "Text", X, Y, Width, Alignment );
<script type="text/javascript"></script>

A text drawn by using drawStringRect() which allows to set the width of the text rectangle and to align the text horizontally (in this case "right")

Like drawString. Allows however to set the width of the text rectangle and to specify the horizontal text-alignment. Text-alignment value must be a string (ie enclosed in quotation marks or apostrophes) and can be either "left", "center", "right" or "justify".像束带。允许但设置该矩形的宽度的文本，并指定水平的文本对齐方式。文本对齐值必须是一个字符串（即包含在撇号或引号），并且可以“左”，“中心” ，“右”或“理由”。

jg.setFont("verdana","11px",Font.BOLD);
jg.drawStringRect("Text",20,50,300,"right");

drawImage( "src", X, Y, width, height );
<script type="text/javascript"></script>

Draws image at the specified location. The "src" parameter specifies the file path. The width and height parameters are optional (may be 0, null or omitted, in which case the image is displayed in its default size), but provide the option to stretch the image (almost) arbitrarily.图像绘制在指定的位置。“src”用户参数指定的文件路径。宽度和高度参数是可选的（可能是0，null或省略，在这种情况下，图像的大小显示在其默认），但提供的选项把图像（几乎）随意。

Optionally, drawImage() accepts a fifth parameter which you can use to insert an eventhandler into the generated image tag. Example:或者，drawImage（）接受了第五个参数，你可以用它来插入。示例一个EventHandler到生成的图片标记：
jg.drawImage('anImg.jpg',8,5,95,70,'onmouseover="YourFunc()"');

jg.drawImage("friendlyDog.jpg", 20,50,100,150); jg.drawImage("friendlyDog.jpg", 20,50,100,150);

paint();

Must be envoked explicitly to draw the internally-generated graphics into the html page. To optimize performance it's recommended to restrain from calling paint() in unnecessarily short intervals.必须envoked明确地绘制图形到HTML页的内部产生。为了优化性能，它的建议，以制止不必要的电话很短的间隔漆（以上）。

Avoid something like:避免类似：
jg.drawEllipse(0, 0, 100, 100); jg.drawEllipse（1，0，100，100）; jg.paint(); jg.paint（）; jg.drawLine(200, 10, 400, 40); jg.drawLine（200，10，400，40）; jg.paint(); jg.paint（）; ... ...

The following will be faster:下面会更快：
jg.drawEllipse(0, 0, 100, 100); jg.drawEllipse（1，0，100，100）; jg.drawLine(200, 10, 400, 40); jg.drawLine（200，10，400，40）; /*...further drawing methods... /*...进一步绘图方法... */ * / jg.paint(); jg.paint（）; jg.paint();

clear();

Any content created by the Graphics JavaScript Library will be deleted (within the canvas the graphics object refers to). The default content of the canvas (content not created by the script) will remain untouched, ie neither be changed nor be deleted. JavaScript的库的图形创建的任何内容将被删除画布（图形对象内指）。默认的画布上的内容（脚本内容并非由）将维持原状，即不得更改或删除。 jg.clear();

Any stuff the script has drawn to "myCanvas" is deleted (assuming that "myCanvas" is the DIV for which 'jg' has been created).任何东西的脚本已经制定的“myCanvas”是删除（假设“myCanvas”是其中的DIV为'约格森米'已被创建）。

setPrintable( true );

By default, printing shapes isn't feasible since default printing settings of browsers usually prevent background colors from being printed. Invoking setPrintable() with the parameter true enables wz_jsgraphics.js to draw printable shapes (at least in Mozilla/Netscape?6+ and IE). However, at the price of a slightly decreased rendering speed (about 10% to 25% slower).默认情况下，印刷可行的形状不是浏览器默认的打印设置的，因为通常防止背景色被打印出来。调用setPrintable（）与参数真正使wz_jsgraphics.js提请至少在打印形状（Mozilla / Netscape中和IE 6 + ）。然而，在价格略有下降绘制速度（约10％至25％速度较慢）。 jg.setPrintable(false);

The parameter false switches wz_jsgraphics.js back to non-printable mode. The benefit from this, however, will be re-optimized rendering performance.虚假的参数开关wz_jsgraphics.js回非打印模式。这得益于然而，将重新优化渲染性能。

简化的画线方法