jCanvas Properties 属性 - caleb531/jcanvas-docs GitHub Wiki
Properties 属性
These are descriptions of every jCanvas property, their supported methods, and their possible values. Default property values are listed first.
这些是每个jCanvas属性的描述，它们支持的方法，及它们可能的值。默认属性值优先列出。
align 对齐
Description: The horizontal alignment of the text to be drawn
描述：要绘制的文本的水平对齐方式
Methods: drawText()
Values: 'center', 'left', 'right', 'start','end'
值：居中，左，右，起始，终止
arrowAngle 箭头角度
Description: The measure of the angle formed from the left tip of the arrow to the right tip
描述：角度的大小，从箭头的左末端到箭头的右末端形成的角
Methods: drawLine(), drawQuadratic(),drawBezier()
Values: 90, any number
值：90，任意数字
arrowRadius 箭头半径
Description: The length of each tip of an arrow
描述：箭头每个末端的长度
Methods: drawLine(), drawQuadratic(), drawBezier()
Values: 0, any number
值：0，任意数字
autosave 自动保存
Description: If transforming the canvas (with a method such as scaleCanvas()) automatically saves the canvas state. Please note that this also applies to usage of the mask property.
描述：是否在对画布变形（使用诸如scaleCanvas()等的方法）时，自动保存画布状态，请注意，本参数也会应用到mask属性的使用上。
Methods: All drawing methods
方法：所有的绘图方法
Values: true, false
baseline 基线
Description: The vertical alignment of the text to be drawn
描述：要绘制文本的竖直对齐
Methods: drawText()
Values: 'middle', 'top', 'hanging','alphabetic', 'ideographic', 'bottom'
值：居中，顶，悬线，（拉丁等）字母，表义文字（中日韩），底
bringToFront 置于顶级（拿到最前边）
Description: If a draggable layer will come to the front (above all other layers) when dragged
描述：当一个可拖拽层被拖拽时，它是否会跑到最前边（在所有其它层之上）
Methods: All drawing methods
方法：所有的绘图方法
Values: false, true
ccw 逆时针
Description: If an arc is drawn in the counterclockwise direction
描述：是否以逆时针方向绘制圆弧
Methods: drawArc()
Values: false, true
closed 闭合
Description: If a path is closed before it is filled/stroked
描述：一个路径在被填充或描边之前，是否被闭合
Methods: drawArc(), drawLine(),drawQuadratic(), drawBezier()
Values: false, true
compositing 混合模式（是路径混合模式不是颜色的）
Description: How shapes are drawn on top of one another. For examples of the possible values, visit Mozilla's examples page
描述：形状如何绘制到其它形状的上边，访问链接以获取可能的值（W3SCHOOLS上也有，点击查看这一页，而且是图片跟文字的，很容易理解）
Methods: All drawing methods
方法：所有的绘图方法
Values: 'source-over', 'source-in', 'source-out', 'source-atop', 'lighter','destination-over', 'destination-in','destination-out', 'destination-atop','copy', 'xor'
值：这没办法翻译了，看下边的教程图吧，图上先画蓝方块，后画红圆。
concavity 凹陷
Description: How much a polygon's sides project in or out (the default is 0, so nothing projects)
描述：多边形的边，向里或向外伸出多少（默认0，所以不伸出去）
Methods: drawPolygon()
Values: 0, any integer
值：0，任意整数
cornerRadius 角半径
Description: The radius of a rectangle's corners
描述：矩形角的半径
Methods: drawRect()
Values: 0, any number
值：0，任意数字
cropFromCenter 从中心修剪
Description: If the sx and sy properties (for an image's cropping region) lie at the center point of the region
描述：（图像修剪区域用的）sx及sy属性是否位于区域的中心点处
Methods: drawImage()
Values: true, false
crossOrigin 跨域调用（允许别的网站调用本网站上的资源）
Description: Corresponds to the crossOrigin property on images and patterns
描述：对应图像（image）及样式（pattern）元素上的crossOrigin属性
Methods: drawImage(), createPattern()
Values: '', 'anonymous', 'use-credentials'
值：空，匿名，使用证书
cursors 鼠标形状
Description: Displays a specific cursor when a particular layer event fires.
描述：当一个特定的层有事件触发时，显示为一种指定的鼠标指针形状
Methods: All drawing methods
方法：所有绘图方法
Values: An object where the keys are event names and the values are valid CSS cursor values. For examples of each cursor value, visit Mozilla’s example page
值：一个对象，其中键是事件名称，值是可用的CSS鼠标样式值。例如，每种鼠标形状请参照Mozilla的示例页面。
data 数据
Description: An object that can store any user-defined data for a jCanvas layer
描述：一个对象，用来保存jCanvas层的任意的由用户定义的数据
Methods: All drawing methods
方法：所有绘图方法
Values: null, any object
值：null，任意对象
disableEvents 禁用事件
Description: Temporarily disables a layer's events from firing
描述：临时禁用一个层的事件触发
Methods: All drawing methods
方法：所有绘图方法
Values: false, true
dragGroups 拖拽组
Description: The names of any groups that will be dragged when the target layer is dragged
描述：任意组的名字，当目标层被拖拽时，组也会被拖拽
Methods: All drawing methods
方法：所有绘图方法
Values: null, an array of one or more group names
值：null，一个或多个组名字的数组
draggable 可拖拽
Description: If a layer can be dragged
描述：是否层可以被拖拽
Methods: All drawing methods
方法：所有绘图方法
Values: false, true
end终止角度
Description: The end angle on an arc
描述：圆弧的终止角度
Methods: drawArc()
Values: 360, any number
值：360，任意值
endArrow 尾箭头
Description: Indicates if the given path drawing will have an arrow placed at its end point
描述：代表给定的路径绘制，是否在结尾处有一个箭头
Methods: drawLine(), drawQuadratic(),drawBezier()
Values: false, true
fillStyle 填充样式
Description: The fill color of a shape or path
描述：图形或路径的填充颜色
Methods: All drawing methods
方法：所有绘图方法
Values: 'transparent', any valid color string
值：透明，任何可用的颜色值字符串
flipArcText 翻转弧形文本
Description: Indicates if the arc text is to be flipped such that it would be readable if curved upward like a smile (normally, the text would be upside-down in that case)
描述：代表弧线文本是否被翻转，这样就可以读到，弧线是否为向上的笑容式的曲线（通常，文本会以颠倒的形式显示）
Methods: drawText() (only when a radius is supplied, implying arc text)
方法：drawText()（仅当提供了radius属性时，可以用到弧形文本上）
Values: false, true
值：false和true
fn 回调函数
Description: A callback function
描述：一个回调函数
Methods: draw()
Values: null, any function
值：null，任意函数
font 字体设置
Description: The font of the text to be drawn
描述：要绘制的文本的字体设置
Methods: drawText()
Values: '12pt sans-serif', any valid font string
值：任意可用的字体设置字符中
fontFamily 字体类型
Description: The font family of the text to be drawn
描述：要绘制的文本的字体类型
Methods: drawText()
Values: 'sans-serif', any valid font family string
值：任意可用的字体类型字符串
fontSize 字号
Description: The font size of the text to be drawn
描述：要绘制的文本的字号
Methods: drawText()
Values: '12pt', any number (or a string of a number with units)
值：12点，任意数字（或者是一个字符串，由一个数字和单位组成）
fontStyle 字体样式
Description: The font style of the text to be drawn
描述：要绘制的文本的字体样式
Methods: drawText()
Values: 'normal', 'bold', 'italic', 'bold italic'
值：普通，加粗，倾斜，加粗并倾斜
fromCenter 从中心（绘制）
Description: If the x and y properties lie at the center of a shape (rather than the top-left corner)
描述：x及y属性是否位于图形的中心（而不是左上角）
Methods: drawArc(), drawEllipse(),drawRect(), drawImage(), drawText(),setPixels()
Values: true, false
groups 组
Description: An array of group names associated with a layer
描述：与某一个层相关的所有组的名字数组
Methods: All drawing methods
方法：所有绘图方法
Values: null, any array of strings
值：null，任何字符串数组
height 高
Description: The height of a shape
描述：图形的高
Methods: clearCanvas(), drawEllipse(),drawRect(), drawImage()
Values: null, any number
值：null，任意数字
imageSmoothing 图象平滑
Description: If the browser automatically smooths rendered canvas images
描述：浏览器是否自动平滑渲染画布上的图像
Methods: drawImage(), drawPattern()
Values: true, false
inDegrees 使用角度值
Description: If angles are measured in degrees or radians
描述：角度的衡量（单位）使用角度还是弧度
Methods: drawArc(), drawPolygon()
Values: true, false
intangible 无形/触摸不到
Description: Indicates if the user can "click through" the layer as if it didn't exist. Note that the layer will still respond to mechanical events, just not mouse events.
描述：代表用户是否可以穿越点击某个层，就像这个层不存在似的。注意，这个层仍然会响应机械事件，只是不响应鼠标事件。
Methods: All drawing methods
方法：所有绘图方法
Values: 0
值：false, true
intersects 交集
Description: A read-only layer property which is true if the cursor coordinates lie within the layer and false when they do not
描述：一个只读的属性，如果指针坐标位于层内的时候为true，否则为false
Methods: All drawing methods
方法：所有绘图方法
Values: false
layer 层
Description: If the jCanvas drawing to be drawn should also be added as a layer
描述：要绘制的内容是否以层的形式添加上去
Methods: All drawing methods
方法：所有的绘制方法
Values: false, true
lineHeight 行高
Description: The line height of a text drawing, the value of which is a multiple of the default line height
描述：要绘制的文本的行高，值为默认行高的倍数
Methods: drawText()
Values: 1, any number
值：1，任意数字
load 调用
Description: A callback function to run once an image has loaded
描述：图象完成调用时，只运行一次的回调函数
Methods: pattern(), drawImage()
Values: null, any function
值：null，任意函数
mask 遮罩
Description: Whether the current shape is used to mask future shapes
描述：当前图形是否用于遮挡后续图形
Methods: All drawing methods
方法：所有的绘制方法
Values: false, true
maxWidth 最大宽度
Description: The maximum width for any line of text in a text drawing
描述：绘制文本时，文本每一行的最大宽度
Methods: drawText()
Values: null, any number
值：null，任意数字
miterLimit 边线限制
Description: The distance between the inner and outer corner of two lines. For an example, see Mozilla's demo page
描述：两条线的里角与外角的距离，点击链接以查看示例
Methods: All drawing methods
方法：所有的绘制方法
Values: 10, any number
值：10，任意值
name 名称
Description: The name associated with a layer
描述：与层相关的名称
Methods: All drawing methods
方法：所有绘图方法
Values: '', any string
值：空，任意字符串
opacity 不透明度
Description: The opacity of a drawing
描述：绘图的不透明度
Methods: All drawing methods
方法：所有绘图方法
Values: 1, any number from 0 to 1
值：1，任意在0到1之间的数字
r1 第1半径
Description: The start radius of a radial gradient
描述：径向过渡的起始半径
Methods: gradient()
Values: null, any number
值：null，任意数字
r2 第2半径
Description: The end radius of a radial gradient
描述：径向过渡的终止半径
Methods: gradient()
Values: null, any number
值：null，任意数字
radius 半径
Description: The radius of a circle or polygon
描述：圆或多边形的半径
Methods: drawArc(), drawPolygon()
Values: 0, any number
值：0，任意数字
repeat 重复
Description: How a pattern is repeated
描述：样式如何重复
Methods: pattern()
Values: 'repeat', 'repeat-x', 'repeat-y', 'no-repeat'
值：重复，横向重复，纵向重复，不重复
respectAlign 某方向对齐
Description: Ensures that the text's (x, y) coordinates are in line with either the left or right margin (depending of the value of the align property)
描述：确定文本的(x,y)坐标与左边缘或右边缘一致（取决于align属性的值）
Methods: drawText()
Values: true, false
restrictDragToAxis 拖拽与轴线对齐
Description: Restricts the dragging of a layer to the specified axis
描述：限制层的拖拽与指定轴对齐
Methods: pattern()
Values: null, 'x', 'y'
rotate 旋转角
Description: The angle at which a polygon is rotated
描述：多边形旋转时的角度
Methods: clearCanvas(), drawRect(),drawArc(), drawEllipse(), drawImage(),drawPolygon()
Values: 0, any number
值：0，任意数字
rounded 圆角
Description: If the corners of a path is rounded
描述：路径的转角是否是圆角
Methods: drawLine(), drawQuadratic(),drawBezier()
Values: 0, any number
值：0，任意数字
sHeight 修剪高度
Description: The height of an image's crop region
描述：图像的修剪区的高度
Methods: drawImage()
Values: null, any number
值：null，任意数字
sWidth 修剪宽度
Description: The width of an image's crop region
描述：图像的修剪区的宽度
Methods: drawImage()
Values: null, any number
值：null，任意数字
scale 缩放度
Description: A multiple of the canvas width and height (used for scaling)
描述：（用于缩放的）画布宽高的倍数
Methods: scaleCanvas(), all methods
方法：scaleCanvas()，所有方法
Values: 1, any number
值：1，任意数字
scaleX 宽缩放度
Description: A multiple of the canvas width (used for scaling)
描述：（用于缩放的）画布宽度的倍数
Methods: scaleCanvas(), all shape methods,drawImage()
方法：scaleCanvas()，所有的形状方法，drawImage()
Values: 1, any number
值：1，任意数字
scaleY 高缩放度
Description: A multiple of the canvas width (used for scaling)
描述：（用于缩放的）画布高度的倍数
Methods: scaleCanvas(),
方法：为什么跟上两个都不一样…………
Values: 1, any number
值：1，任意数字
shadowBlur 阴影模糊度
Description: The blur radius of a shadow
描述：阴影的模糊半径
Methods: All drawing methods
方法：所有的绘图方法
Values: 0, any number
值：0，任意数字
shadowColor 阴影颜色
Description: The color of a shadow
描述：阴影颜色
Methods: All drawing methods
方法：所有绘图方法
Values: 'transparent', any valid color string
值：透明，任何可用的颜色字符串
shadowStroke 阴影笔触
Description: Whether a shape's stroke adds to a shape's shadow
描述：形状的笔触是否会被添加到形状的阴影上
Methods: All drawing methods
方法：所有绘图方法
Values: false, true
shadowX 阴影横向偏移
Description: The x-offset of a shadow
描述：阴影的x偏移
Methods: All drawing methods
方法：所有绘图方法
Values: 0, any number
值：0，任意数字
shadowY 阴影纵向偏移
Description: The y-offset of a shadow
描述：阴影的y偏移
Methods: All drawing methods
方法：所有绘图方法
Values: 0, any number
值：0，任意数字
sides 边数
Description: How many sides a polygon will have
描述：多边形有几个边
Methods: drawPolygon()
Values: 3, any number greater than 2
值：3，任意大于2的数字
source 资源
Description: The source of the image to be drawn
描述：要绘制的图像的资源路径
Methods: drawImage(), pattern()
Values: '', any string, image DOM element, or canvas DOM element
值：空，任何字符串，图像的DOM元素，或画布的DOM元素
spread 扩散
Description: The distance a slice is from its defined (x, y) coordinates. This distance is a multiple of the slice's radius, with a value ranging from 0 to 1.
描述：扇形从其定义的x,y坐标处计算的距离，这个距离是扇形半径的倍数，值限制到从0到1。
Methods: drawSlice()
Values: 0, any number between 0 and 1
值：0，任意在0到1之间的数字
start 起始角度
Description: The start angle on an arc
描述：圆弧的起始角度
Methods: drawArc()
Values: 0, any number
值：0，任意数字
startArrow 首箭头
Description: Indicates if the given path drawing will have an arrow placed at its start point
描述：代表给定路径的绘制过程是否在起始点处有一个箭头。
Methods: drawLine(), drawQuadratic(),drawBezier()
Values: false, true
strokeCap 笔触端点
Description: The type of cap for any stroke
描述：任意笔触的端点类型
Methods: All drawing methods
方法：所有绘图方法
Values: 'butt', 'square', 'round'
值：平的（不加端点），方形，圆形，加了端点的线比正常的线两头各长一点点
strokeDash 笔触虚线
Description: An array consisting of one or two numbers. The first number represents the length of each dash. The second number represents the spacing between each dash. If only one number is given, the implied second number is equal to the first.
描述：一个包含一个或两个数字的数组，第一个数字代表每段虚线的长度，第二个数字代表每个虚线之间的空白。如果只有一个数字，那么意味着第二个数等于第一个。
Methods: All drawing methods
方法：所有绘图方法
Values: null, an array of one of two numbers
值：null，任意一个有一个或两个数字的数组
strokeDashOffset 笔触虚线偏移
Description: The offset of the dash-space alternation
描述：虚线与空白交替的偏移量
Methods: All drawing methods
方法：所有绘图方法
Values: 0
strokeJoin 笔触接点
Description: The type of cap between connected strokes
描述：相连的笔触的端点类型
Methods: All drawing methods
方法：所有绘图方法
Values: 'miter', 'bevel', 'round'
值：尖角，斜角，圆角
strokeStyle 笔触样式
Description: The stroke color of a shape or path
描述：形状或路径的笔触颜色
Methods: All drawing methods
方法：所有绘图方法
Values: 'transparent', any valid color string
值：透明，任意可用的颜色字符串
strokeWidth 笔触宽度（线宽）
Description: The stroke width of a shape or path
描述：形状或路径的笔触宽度
Methods: All drawing methods
方法：所有绘图方法
Values: 1, any number
值：1，任意数字
sx 修剪区起始点的横坐标
Description: The x position of an image's crop region
描述：图像修剪区域的x位置
Methods: drawImage()
Values: 0, any number
值：0，任意数字
sy 修剪区起始点的纵坐标
Description: The y position of an image's crop region
描述：图像修剪区域的y位置
Methods: drawImage()
Values: 0, any number
值：0，任意数字
text 文本（内容）
Description: The text to be drawn
描述：要绘制的文本
Methods: drawText()
Values: '', any string
值：空，任意字符串
translateX 横向平移量
Description: The number of pixels by which a shape or canvas is translated on the x-axis
描述：x轴方向上，图形或画布被平移的像素量
Methods: All drawing methods
方法：所有的绘图方法
Values: 0, any number
值：0，任意数字
translateY 纵向平移量
Description: The number of pixels by which a shape or canvas is translated on the y-axis
描述：y轴方向上，图形或画布被平移的像素量
Methods: All drawing methods
方法：所有的绘图方法
Values: 0, any number
值：0，任意数字
type 类型
Description: The type of a layer
描述：层的类型
Methods: All drawing methods
方法：所有的绘图方法
Values: null, 'rectangle', 'arc', 'circle','ellipse', 'polygon', 'line', 'vector','quadratic', 'bezier', 'image', 'text','function'
值：null，矩形，圆弧，圆，椭圆，多边形，线，向量，二次曲线，贝塞尔曲线，图像，文本，函数
updateDragX 横向拖拽更新
Description: A callback function that modifies the x-value of a layer while it’s being dragged; receives layer and x as arguments; must return a new x-value
描述：一个回调函数，它会修改一个被拖拽层的x值，接收layer及x作为参数，必须返回一个新的x值
Methods: All drawing methods
方法：所有绘图方法
Values: null, any function
值：null，或任意函数
updateDragY 纵向拖拽更新
Description: A callback function that modifies the y-value of a layer while it’s being dragged; receives layer and y as arguments; must return a new y-value
描述：一个回调函数，它会修改一个被拖拽层的y值，接收layer及y作为参数，必须返回一个新的y值
Methods: All drawing methods
方法：所有绘图方法
Values: null, any function
值：null，或任意函数
visible 可见性
Description: If a jCanvas layer is drawn on the canvas
描述：一个jCanvas层是否已绘制于画布上
Methods: All drawing methods
方法：所有的绘图方法
Values: true, false
width 宽
Description: The width of a shape
描述：图形的宽
Methods: clearCanvas(), drawEllipse(),drawRect(), drawImage()
Values: null, any number
值：null，任意数字
x 横坐标
Description: The x position on the canvas for a shape
描述：图形在画布上的x位置
Methods: All drawing methods except drawLine(),drawQuadratic(), and drawBezier()
方法：所有的绘图方法，除了后边这3个
Values: 0, any number
值：0，任意数字