数码资讯
HTML5画布API方法详解
选购提示
关注价格、性能、续航、售后和真实使用场景，理性比较后再下单。
本文主要介绍了HTML5画布API的详细解释。本文列出了大多数的方法在画布的API，并给出了这些方法的中文注释。
* canvas.getcontext（二维的）
你可以直接在画布画不，你已经用这种方法得到的二维空间图
下面。
*（调用上下文。）
表示新路径绘制的开始。
* context.ispointinpath（x，y）
确定一个点是否在路径上。该方法在坐标系统转换后不适用。
* context.moveto（x，y）
这相当于从绘图板上抬起画笔，离开绘图板的刷尖，然后定位笔尖。
（x，y）坐标，并在这个新位置开始一个新的绘图。
* context.lineto（x，y）
画笔的笔尖不离开画板，笔尖从当前坐标移动到绘图板上。
（x，y）坐标，绘制线段。
*（上下文。笔画）
在绘图画布，一些绘图操作必须调用该方法，使绘画里面
显示容量。
*（上下文。保存）
这种方法节省了画布的当前状态，无论对画布的任何变化后。
只要你把画布状态做这些改变之前，你可以稍后再拨
的context.restore（）方法是恢复到保存的状态。通常在一个新的图纸
在画布的原始状态应该是修改之前或在保存（没有任何图纸或变更）
），每次一个新的图纸或修改操作完成，这是恢复到原来的state.this
该样品有利于今后的拉拔操作。
事实上，画布的2D绘图环境上下文的许多属性和一些方法和形式。
状态，每个属性的值被改变（或者使用一些方法来改变绘图状态），
绘图状态更改。如果每次更改后保存，则属性的多个状态将为
以堆栈的形式保存，并按堆栈顺序多次调用还原（）。
法律回到了相应的保全状态。
* context.translate（x，y）
此方法将当前坐标的原点移动到（x，y）。
*（上下文恢复）
恢复的画布状态到最后的拯救。
*（上下文。closepath）
这个命令是非常类似的行为来
函数，区别在于目的地是
自动假定为
路径起源。然而，这closepath还通知
当前形状已闭合或形成的画布
完全包容区。这对将来有用。
填充与笔划。
在这一点上，你可以自由地继续
在你的路径段来创建额外的子路径。或者你
可以调用在任何时间开始了清晰的路径
列表完全。
*（上下文填充）；
填充样式后填充关闭路径。调用此方法后不需要再次调用。
的context.stroke（）方法。
* context.fillrect（x，y，宽度，高度）
矩形（宽度、高度）的面积在（x，y）上画和填充。
你不需要打电话给context.stroke（）方法，使用该方法后再。
* context.strokerect（x，y，宽度，高度）
宽度和长度（宽度，高度）的矩形轮廓是在（x，y）上画的。
* context.clearrect（x，y，宽度，高度）
清洁位置（矩形的左上角）是（x，y，），大小是（宽度，高度）。
矩形区域。
从矩形区域中删除任何内容并重置它
它原来的透明颜色。
在画布中清除矩形的能力是
使用HTML5画布API创建动画和游戏。通过
反复绘制和清除部分的画布，它
有可能呈现出动画的幻觉，还有很多。
这方面的例子已经存在于网络上。然而，对
创建流畅的动画，你需要
利用剪辑功能，甚至可能是次要的。
缓冲画布，以减少由闪烁引起的闪烁
频繁画布清除。
*（上下文。DrawImage）
该方法有三个重载，可以在画布上绘制。
页面中的img标签，在JS的图像对象，和一个视频帧。
公牛；context.drawimage（IMG，x，y）
图像绘制图像img在（x，y）。当画布的尺寸大于图像
绘制整个图像；当图像大于画布时，冗余部分被切断。
公牛；context.drawimage（IMG，X，Y，W，H）
长和宽的矩形区域（W，H）是画在（x，y）的图像img.image
尺寸将改为（W，H）。
公牛；context.drawimage（IMG，imgx，imgy，imgw，imgh、CX、CY，
连续波，CH）
一个img图像作为绘制对象，和IMG的位置卡（imgx，imgy）
）的面积（imgw，imgh）绘制在画布上的位置（cx，cy）。
绘制（CW，CH）的大小的区域。
如果图像上的剪辑区域超出图像的范围，则会引发异常。
公牛；context.drawimage（视频，VX，VY，大众，VH，CX，CY，CW，CH）
一个视频对象作为绘画对象，和视频上的位置（VX，VY）
一个框架（大众，VH），在画布上的立场是在（CX，CY）绘制。
（CW，CH）的面积。
此外，对绘制图像的第一个参数（）也可以是另一个帆布。
* context.getimagedata（x，y，宽度，高度）
此方法从画布位置（x，y）获得大小（宽度，高度）。
一个像素区域，返回值是一个数据object.imagedata有宽度，
三高度和数据的属性。
数据属性是一个像素数组，数组中有四个连续的元素表示一个图像。
反过来，四个连续的元素，包括颜色和透明度的RGBA四连续元素信息。
素数必须属于一个像素，第一个元素的位置不是随机的。
像素数组在画布区域中指定，从上到下，从左到右。
扫描得到。像素数组中的元素的数目是宽度*高度* 4。
位置的像素信息。
如果在本地文件中打开浏览器，则使用此方法的网页不正常。
工作时，通常会产生一个安全错误（安全错误）。
web服务器，然后请求访问来解决这个问题。
HTML必须来自同一个域名。然而，IE9可以通过本地文件访问。
一个例子如下：
复制代码代码如下所示：
获取像素区域
context.getimagedata VaR数据=（0, 0, 3，3）； / / 3
网格
VaR的宽度= imagedata.width；
像素区域/位置中的特定像素
变量x＝2；
var＝2；
像素数组索引中的绿色对应元素
无功pixelredindex =（（Y-1）*（宽×4））+（（X-1）* 4）；
无功pixelgreenindex = pixelredindex + 1；
无功pixelblueindex = pixelredindex + 2；
无功pixelalphaindex = pixelredindex + 3；
VaR像素= imagedata.data； / / canvaspixelarray
红色=像素pixelredindex } { var；
绿色=像素pixelgreenindex } { var；
蓝色=像素pixelblueindex } { var；
VaRα=像素pixelalphaindex } {；
* context.createimagedata（W，H）
产生一个数据对象（W，H），一个数据对象的意义
从getimagedata获得数据对象（）。
* context.putimagedata（影像数据，X，Y，X1，Y1，W，H）
在画布上绘制一个数据对象（x，y），最后四个参数是可用的
选择参数以设置修剪矩形的位置和大小。
* context.createlineargradient（X1，Y1，x2，y2）
线性梯度（x1，y1）之间产生，（x2，y2）等：
复制代码代码如下所示：
无功gradientname = context.createlineargradient（- 5，- 50，
5，50）；
* Gradient.addColorStop（胶印，颜色）
在渐变中，渐变的颜色设置在不同的位置。
是您想要应用于笔划中的颜色吗
偏置位置。偏移位置是
0和1，代表沿梯度线多远
颜色应该达到：
GradientName.addColorStop（1，552200#）；
颜色可以作为一个功能的RGBA（R，G，B，A）在CSS产生透明的渐变，如：
复制代码代码如下所示：
50%色透明梯度
GradientName.addColorStop（0.2，'rgba（0, 0, 0，0.5））；
* context.createradialgradient（x0，y0，R0，X1，Y1，R1）
径向梯度的区域在两个圆之间产生。前三个参数
代表一个圆心在（x0，y0）半径R0，并
最后三个参数代表第二个圆中心。
（x1，y1）在半径为R1。渐变绘制在
两个圆之间的面积。
* context.createpattern（IMG，'repeatpattern）
使用图像img产生路径重复型repeatpattern
strokeStyle风格或填充的填充颜色风格的repeatpattern值可以
拿一个重复，repeat-x，纵向平铺和no-repeat.such作为：
复制代码代码如下所示：
context.strokestyle = context.createpattern（砾石，
重复；
IMG的参数也可以另一个帆布或视频
* context.scale（xmultiple，ymultiple）
这两个参数指定对象在x和y方向上绘制的缩放时间，大于1。
对于放大，在0和1之间减小，如果负值为负，则可以实现反射和翻转的效果。
。
* context.rotate（角度）
在旋转绘图环境中使用，以当前点的坐标作为旋转的中心，用弧度。
为单位，结合Math.PI.When角参数是积极的使用，它是顺时针旋转。
逆时针方向旋转负值。
* context.transform（scaleX，skewy，skewx、ScaleY、运，
横向张）
此函数用于控制绘图对象的大小、剪切和位置。它是一个变换矩阵。
ScaleX和ScaleY是缩放，X和Y坐标，respectively.skewy是控制
上下文的垂直剪切，其值可以是正的或负的浮点数或任意大小的整数。
Y = y + skewy××进行ordinate.skewx是水平切割的控制下
一个值，可以是正的或负的浮点，也可以是任意大小的整数，相当于一个横坐标。
x = x + y skewx *最后两参数等效翻译（x，y）
两个参数的影响。
* context.settransform（scaleX，skewy，skewx，ScaleY，
转移，横向张）
此方法类似于转换，但将使用转换方法。
将变换、尺度和旋转相结合，产生复杂的复杂变换。
效应u3002the settransform方法适用于从语境的原始状态，而不会
结合以前的转变。所以context.settransform（1, 0, 0，1，）
0, 0）将上下文的转换状态恢复到其原始值。
* filltext（文本，X，Y，maxwidth）
在填充内容文本绘制文本（x，y）的坐标。Maxwidth是一个可选的参考
数字，用于限制所有文本的宽度和文本间距的总和，如果所有和空格隔开。
单个文本字符的宽度和字符间距的宽度被压缩，因为宽度超过这个值。
单字符变得苗条小。它可以结合context.font，
context.fillstyle，context.textalign，和其他属性绘制填充文本。
* stroketext（文本，X，Y，maxwidth）
绘制路径内容的文本作为文本在（x，y）的坐标。Maxwidt是一个可选的参考
数字，用于限制所有文本的宽度和文本间距的总和，如果所有和空格隔开。
单个文本字符的宽度和字符间距的宽度被压缩，因为宽度超过这个值。
单字符变得苗条小。它可以结合context.font，
context.textalign，context.linewidth，context.strokestyle，等。
属性绘制路径文本。
例如:
复制代码代码如下所示：
VaR的字体大小= 100；
context.font =字号+PX宋体；
而（context.measuretext（你好世界！）。宽度> 140）
{
字体大小；
context.font =字号+PX宋体；
}
context.filltext（你好世界！
context.filltext（字体大小+字号+PX
* context.measuretext（文本）
该方法是基于当前字体，TextAlign值计算，并textbaseline
文本占用的区域的大小。文本参数是用于绘制的文本内容。
一个textmetrics对象返回。目前，只有一个textmetrics对象
宽度属性可以在将来提供更多的属性。
* context.rect（X，Y，W，H）
在W的点（x，y）上画宽，矩形。当前点被忽略。
x（y）成为新的当前点。
* context.arc（x，y，半径，startangle，EndAngle，
逆时针）
画出弧，x，y是圆弧的中心坐标，半径是圆弧的半径。
StartAngle，EndAngle是起点和终点的弧度，分别按弧度。
皮皮；math.pi值是0，弧度是逆时针右水平；
绘制圆弧的方向是可选参数，布尔值为正，逆时针为false。
以顺时针方向，默认为false。用这种方法可以省略使用LineTo方法
当该方法绘制一个圆时，下一条路径从圆弧的末端绘制。
。
* context.arcto（X1，Y1，X2，Y2，半径）
当前点（x1，y1），形成一个线L1（x1，y1），（x2，y2），另一个
线L2，当前点（x2，y2），形成第三线L3。如果X1（Y1）的起源，
L1和L2是坐标轴，与L1和L2相切，半径为半径，并且具有线段L3。
在同一象限圆O1，的设置和L1的切点为P1，和L2点是p2.p1圆O1
的两圆弧线（x1，y1）近弧与P2（对圆短圆）。
弧线是画出的弧线。
此外，当前点（X1，Y1）也将画一弧线线段连接
因为路径绘制连续的线段，当前点（x1，y1）之间是先绘制和收紧。
然后拉弧，切点P2成为下一个当前点。
这种方法通常用来画圆角矩形。
* context.quadraticcurveto（X1，Y1，x2，y2）
两贝塞尔线段绘制在当前坐标（x2，y2）。
（x1，y1）控制。（X1，Y1）不在曲线段。
HTML5画布API中曲线的其他选项包括
的beziercurveto，北极，和弧功能。这些曲线
取额外的控制点、半径或角度
确定曲线的特征。
* context.beziercurveto（cp1x，cp1y，cp2x，cp2y，x，y）
控制点之间绘制（cp1x，cp1y）和（cp2x，cp2y）之间目前的点（x，y）
控制弯曲度的三贝塞尔曲线。
*（上下文。剪辑）
此方法基于上次绘制的封闭路径创建一个剪辑区域。
（剪辑区域）剪辑区域相当于一个掩码，而后面的内容仅是一个掩码。
将显示在剪辑区域中的部分。
* context.ispointinpath（x，y）
检查坐标（x，y）是否在绘制路径内。返回值是真的还是
假。
* canvas.todataurl（类型、参数）
这种方法可以将画布变成一个图像，而图像是基于Base64 code.as
没有指定两个参数，并且不使用参数调用该方法，转换的图像格式为PNG格式。
。
类型：指定要转换的图像格式，如图像PNG、图像JPEG等。
Bull; args: optional parameters.For example, if type is image/jpeg, then args can be
0到0.1之间的值来指定图像的质量。
例如，下面的代码使画布中的内容在新的浏览器窗口中绘制
口或制表符打开：
复制代码代码如下所示：
VaR的画布document.getelementbyid（myCanvas）；
Window.open（canvas.todataurl（图像/格式））；
* canvas.getcontext（二维的）
你可以直接在画布画不，你已经用这种方法得到的二维空间图
下面。
*（调用上下文。）
表示新路径绘制的开始。
* context.ispointinpath（x，y）
确定一个点是否在路径上。该方法在坐标系统转换后不适用。
* context.moveto（x，y）
这相当于从绘图板上抬起画笔，离开绘图板的刷尖，然后定位笔尖。
（x，y）坐标，并在这个新位置开始一个新的绘图。
* context.lineto（x，y）
画笔的笔尖不离开画板，笔尖从当前坐标移动到绘图板上。
（x，y）坐标，绘制线段。
*（上下文。笔画）
在绘图画布，一些绘图操作必须调用该方法，使绘画里面
显示容量。
*（上下文。保存）
这种方法节省了画布的当前状态，无论对画布的任何变化后。
只要你把画布状态做这些改变之前，你可以稍后再拨
的context.restore（）方法是恢复到保存的状态。通常在一个新的图纸
在画布的原始状态应该是修改之前或在保存（没有任何图纸或变更）
），每次一个新的图纸或修改操作完成，这是恢复到原来的state.this
该样品有利于今后的拉拔操作。
事实上，画布的2D绘图环境上下文的许多属性和一些方法和形式。
状态，每个属性的值被改变（或者使用一些方法来改变绘图状态），
绘图状态更改。如果每次更改后保存，则属性的多个状态将为
以堆栈的形式保存，并按堆栈顺序多次调用还原（）。
法律回到了相应的保全状态。
* context.translate（x，y）
此方法将当前坐标的原点移动到（x，y）。
*（上下文恢复）
恢复的画布状态到最后的拯救。
*（上下文。closepath）
这个命令是非常类似的行为来
函数，区别在于目的地是
自动假定为
路径起源。然而，这closepath还通知
当前形状已闭合或形成的画布
完全包容区。这对将来有用。
填充与笔划。
在这一点上，你可以自由地继续
在你的路径段来创建额外的子路径。或者你
可以调用在任何时间开始了清晰的路径
列表完全。
*（上下文填充）；
填充样式后填充关闭路径。调用此方法后不需要再次调用。
的context.stroke（）方法。
* context.fillrect（x，y，宽度，高度）
矩形（宽度、高度）的面积在（x，y）上画和填充。
你不需要打电话给context.stroke（）方法，使用该方法后再。
* context.strokerect（x，y，宽度，高度）
宽度和长度（宽度，高度）的矩形轮廓是在（x，y）上画的。
* context.clearrect（x，y，宽度，高度）
清洁位置（矩形的左上角）是（x，y，），大小是（宽度，高度）。
矩形区域。
从矩形区域中删除任何内容并重置它
它原来的透明颜色。
在画布中清除矩形的能力是
使用HTML5画布API创建动画和游戏。通过
反复绘制和清除部分的画布，它
有可能呈现出动画的幻觉，还有很多。
这方面的例子已经存在于网络上。然而，对
创建流畅的动画，你需要
利用剪辑功能，甚至可能是次要的。
缓冲画布，以减少由闪烁引起的闪烁
频繁画布清除。
*（上下文。DrawImage）
该方法有三个重载，可以在画布上绘制。
页面中的img标签，在JS的图像对象，和一个视频帧。
公牛；context.drawimage（IMG，x，y）
图像绘制图像img在（x，y）。当画布的尺寸大于图像
绘制整个图像；当图像大于画布时，冗余部分被切断。
公牛；context.drawimage（IMG，X，Y，W，H）
长和宽的矩形区域（W，H）是画在（x，y）的图像img.image
尺寸将改为（W，H）。
公牛；context.drawimage（IMG，imgx，imgy，imgw，imgh、CX、CY，
连续波，CH）
一个img图像作为绘制对象，和IMG的位置卡（imgx，imgy）
）的面积（imgw，imgh）绘制在画布上的位置（cx，cy）。
绘制（CW，CH）的大小的区域。
如果图像上的剪辑区域超出图像的范围，则会引发异常。
公牛；context.drawimage（视频，VX，VY，大众，VH，CX，CY，CW，CH）
一个视频对象作为绘画对象，和视频上的位置（VX，VY）
一个框架（大众，VH），在画布上的立场是在（CX，CY）绘制。
（CW，CH）的面积。
此外，对绘制图像的第一个参数（）也可以是另一个帆布。
* context.getimagedata（x，y，宽度，高度）
此方法从画布位置（x，y）获得大小（宽度，高度）。
一个像素区域，返回值是一个数据object.imagedata有宽度，
三高度和数据的属性。
数据属性是一个像素数组，数组中有四个连续的元素表示一个图像。
反过来，四个连续的元素，包括颜色和透明度的RGBA四连续元素信息。
素数必须属于一个像素，第一个元素的位置不是随机的。
像素数组在画布区域中指定，从上到下，从左到右。
扫描得到。像素数组中的元素的数目是宽度*高度* 4。
位置的像素信息。
如果在本地文件中打开浏览器，则使用此方法的网页不正常。
工作时，通常会产生一个安全错误（安全错误）。
web服务器，然后请求访问来解决这个问题。
HTML必须来自同一个域名。然而，IE9可以通过本地文件访问。
一个例子如下：
复制代码代码如下所示：
获取像素区域
context.getimagedata VaR数据=（0, 0, 3，3）； / / 3
网格
VaR的宽度= imagedata.width；
像素区域/位置中的特定像素
变量x＝2；
var＝2；
像素数组索引中的绿色对应元素
无功pixelredindex =（（Y-1）*（宽×4））+（（X-1）* 4）；
无功pixelgreenindex = pixelredindex + 1；
无功pixelblueindex = pixelredindex + 2；
无功pixelalphaindex = pixelredindex + 3；
VaR像素= imagedata.data； / / canvaspixelarray
红色=像素pixelredindex } { var；
绿色=像素pixelgreenindex } { var；
蓝色=像素pixelblueindex } { var；
VaRα=像素pixelalphaindex } {；
* context.createimagedata（W，H）
产生一个数据对象（W，H），一个数据对象的意义
从getimagedata获得数据对象（）。
* context.putimagedata（影像数据，X，Y，X1，Y1，W，H）
在画布上绘制一个数据对象（x，y），最后四个参数是可用的
选择参数以设置修剪矩形的位置和大小。
* context.createlineargradient（X1，Y1，x2，y2）
线性梯度（x1，y1）之间产生，（x2，y2）等：
复制代码代码如下所示：
无功gradientname = context.createlineargradient（- 5，- 50，
5，50）；
* Gradient.addColorStop（胶印，颜色）
在渐变中，渐变的颜色设置在不同的位置。
是您想要应用于笔划中的颜色吗
偏置位置。偏移位置是
0和1，代表沿梯度线多远
颜色应该达到：
GradientName.addColorStop（1，552200#）；
颜色可以作为一个功能的RGBA（R，G，B，A）在CSS产生透明的渐变，如：
复制代码代码如下所示：
50%色透明梯度
GradientName.addColorStop（0.2，'rgba（0, 0, 0，0.5））；
* context.createradialgradient（x0，y0，R0，X1，Y1，R1）
径向梯度的区域在两个圆之间产生。前三个参数
代表一个圆心在（x0，y0）半径R0，并
最后三个参数代表第二个圆中心。
（x1，y1）在半径为R1。渐变绘制在
两个圆之间的面积。
* context.createpattern（IMG，'repeatpattern）
使用图像img产生路径重复型repeatpattern
strokeStyle风格或填充的填充颜色风格的repeatpattern值可以
拿一个重复，repeat-x，纵向平铺和no-repeat.such作为：
复制代码代码如下所示：
context.strokestyle = context.createpattern（砾石，
重复；
IMG的参数也可以另一个帆布或视频
* context.scale（xmultiple，ymultiple）
这两个参数指定对象在x和y方向上绘制的缩放时间，大于1。
对于放大，在0和1之间减小，如果负值为负，则可以实现反射和翻转的效果。
。
* context.rotate（角度）
在旋转绘图环境中使用，以当前点的坐标作为旋转的中心，用弧度。
为单位，结合Math.PI.When角参数是积极的使用，它是顺时针旋转。
逆时针方向旋转负值。
* context.transform（scaleX，skewy，skewx、ScaleY、运，
横向张）
此函数用于控制绘图对象的大小、剪切和位置。它是一个变换矩阵。
ScaleX和ScaleY是缩放，X和Y坐标，respectively.skewy是控制
上下文的垂直剪切，其值可以是正的或负的浮点数或任意大小的整数。
Y = y + skewy××进行ordinate.skewx是水平切割的控制下
一个值，可以是正的或负的浮点，也可以是任意大小的整数，相当于一个横坐标。
x = x + y skewx *最后两参数等效翻译（x，y）
两个参数的影响。
* context.settransform（scaleX，skewy，skewx，ScaleY，
转移，横向张）
此方法类似于转换，但将使用转换方法。
将变换、尺度和旋转相结合，产生复杂的复杂变换。
效应u3002the settransform方法适用于从语境的原始状态，而不会
结合以前的转变。所以context.settransform（1, 0, 0，1，）
0, 0）将上下文的转换状态恢复到其原始值。
* filltext（文本，X，Y，maxwidth）
在填充内容文本绘制文本（x，y）的坐标。Maxwidth是一个可选的参考
数字，用于限制所有文本的宽度和文本间距的总和，如果所有和空格隔开。
单个文本字符的宽度和字符间距的宽度被压缩，因为宽度超过这个值。
单字符变得苗条小。它可以结合context.font，
context.fillstyle，context.textalign，和其他属性绘制填充文本。
* stroketext（文本，X，Y，maxwidth）
绘制路径内容的文本作为文本在（x，y）的坐标。Maxwidt是一个可选的参考
数字，用于限制所有文本的宽度和文本间距的总和，如果所有和空格隔开。
单个文本字符的宽度和字符间距的宽度被压缩，因为宽度超过这个值。
单字符变得苗条小。它可以结合context.font，
context.textalign，context.linewidth，context.strokestyle，等。
属性绘制路径文本。
例如:
复制代码代码如下所示：
VaR的字体大小= 100；
context.font =字号+PX宋体；
而（context.measuretext（你好世界！）。宽度> 140）
{
字体大小；
context.font =字号+PX宋体；
}
context.filltext（你好世界！
context.filltext（字体大小+字号+PX
* context.measuretext（文本）
该方法是基于当前字体，TextAlign值计算，并textbaseline
文本占用的区域的大小。文本参数是用于绘制的文本内容。
一个textmetrics对象返回。目前，只有一个textmetrics对象
宽度属性可以在将来提供更多的属性。
* context.rect（X，Y，W，H）
在W的点（x，y）上画宽，矩形。当前点被忽略。
x（y）成为新的当前点。
* context.arc（x，y，半径，startangle，EndAngle，
逆时针）
画出弧，x，y是圆弧的中心坐标，半径是圆弧的半径。
StartAngle，EndAngle是起点和终点的弧度，分别按弧度。
皮皮；math.pi值是0，弧度是逆时针右水平；
绘制圆弧的方向是可选参数，布尔值为正，逆时针为false。
以顺时针方向，默认为false。用这种方法可以省略使用LineTo方法
当该方法绘制一个圆时，下一条路径从圆弧的末端绘制。
。
* context.arcto（X1，Y1，X2，Y2，半径）
当前点（x1，y1），形成一个线L1（x1，y1），（x2，y2），另一个
线L2，当前点（x2，y2），形成第三线L3。如果X1（Y1）的起源，
L1和L2是坐标轴，与L1和L2相切，半径为半径，并且具有线段L3。
在同一象限圆O1，的设置和L1的切点为P1，和L2点是p2.p1圆O1
的两圆弧线（x1，y1）近弧与P2（对圆短圆）。
弧线是画出的弧线。
此外，当前点（X1，Y1）也将画一弧线线段连接
因为路径绘制连续的线段，当前点（x1，y1）之间是先绘制和收紧。
然后拉弧，切点P2成为下一个当前点。
这种方法通常用来画圆角矩形。
* context.quadraticcurveto（X1，Y1，x2，y2）
两贝塞尔线段绘制在当前坐标（x2，y2）。
（x1，y1）控制。（X1，Y1）不在曲线段。
HTML5画布API中曲线的其他选项包括
的beziercurveto，北极，和弧功能。这些曲线
取额外的控制点、半径或角度
确定曲线的特征。
* context.beziercurveto（cp1x，cp1y，cp2x，cp2y，x，y）
控制点之间绘制（cp1x，cp1y）和（cp2x，cp2y）之间目前的点（x，y）
控制弯曲度的三贝塞尔曲线。
*（上下文。剪辑）
此方法基于上次绘制的封闭路径创建一个剪辑区域。
（剪辑区域）剪辑区域相当于一个掩码，而后面的内容仅是一个掩码。
将显示在剪辑区域中的部分。
* context.ispointinpath（x，y）
检查坐标（x，y）是否在绘制路径内。返回值是真的还是
假。
* canvas.todataurl（类型、参数）
这种方法可以将画布变成一个图像，而图像是基于Base64 code.as
没有指定两个参数，并且不使用参数调用该方法，转换的图像格式为PNG格式。
。
类型：指定要转换的图像格式，如图像PNG、图像JPEG等。
Bull; args: optional parameters.For example, if type is image/jpeg, then args can be
0到0.1之间的值来指定图像的质量。
例如，下面的代码使画布中的内容在新的浏览器窗口中绘制
口或制表符打开：
复制代码代码如下所示：
VaR的画布document.getelementbyid（myCanvas）；
Window.open（canvas.todataurl（图像/格式））；
声明：本文内容用于数码产品信息整理与选购参考，具体价格、库存、售后政策以官方渠道和电商页面实时信息为准。