一操作(指示开始标绘)、第二操作和第三操作(指示结束标绘)。当检测到第一操作时，将操作对象执行第一操作的位置点作为圆心，在检测到第二操作时，确定操作对象执行第一操作的位置点与操作对象执行第二操作的位置点之间的距离，并将确定出的距离作为扇形的半径，在检测到第三操作时，通过操作对象执行第三操作时所处位置点计算圆心角，最后基于确定的半径和计算出的圆心角生成扇形。对于用户而言，以操作对象为鼠标为例，绘制圆的过程为:用户握持鼠标点击HTML5画布中的第一位置点开始绘制，然后拖动鼠标，再用鼠标点击HTML5画布中的第二位置点，然后移动鼠标点击HTML5画布中的第三位置点结束绘制。HTML5画布上生成的扇形的圆心为第一位置点，半径为第一位置点与第二位置点直线的距离，圆心角为通过第三位置点计算出的圆心角。
[0087]第一标绘对象为矩形:矩形的大小通过对角线确定。上述操作对象的操作包括第一操作(指示开始标绘)、第二操作(指示结束标绘)。首先通过第一操作和第二操作确定矩形的一条对角线，并将操作对象执行第一操作时所处的位置点作为矩形的第一个顶点，将操作对象执行第二操作时所处的位置点作为矩形的第二个顶点，然后通过确定出的对角线确定矩形的第三个顶点和第四个顶点，最后连接四个顶点便生成矩形。对于用户而言，以操作对象为鼠标为例，绘制矩形的过程为:用户握持鼠标点击HTML5画布中的第一位置点开始绘制，然后拖动鼠标，再用鼠标点击HTML5画布中的第二位置点结束绘制。画布上生成的矩形即是以第一位置点与第二位置点之间连接的直线为对角线的矩形。
[0088]另外，对于多边形而言，其是由连接操作对象点击的多个点而成的闭合图形。多边形的大小和形状由操作对象多次点击的位置点确定。
[0089]而对于不规则面，与多边形类似，同样是连接操作对象点击的多个点而成的闭合图形。与多边形不同的时，不规则面中连接各点的线为曲线，而多边形中连接各点的线为直线。
[0090]在上述实施例中，第一标绘对象可以为箭头。其中，箭头可以包括箭头主体和箭头头部O
[0091]请参阅图4，示出了当第一标绘对象为箭头时，依据操作对象的操作，以及与第一标绘对象对应的标绘规则将第一标绘对象绘制在HTML5画布中的一种可能的实现方式的流程示意图，可以包括:
[0092]步骤S401:在检测到操作对象的第一操作之后，通过操作对象在执行第一操作时所处的位置点和操作对象当前所处的位置点确定箭头主体的参数。
[0093]步骤S402:利用箭头主体的参数依据预设的计算规则计算箭头头部的参数。
[0094]步骤S403:在检测到操作对象的第二操作之后，基于箭头主体的参数和箭头头部的参数生成第一标绘对象。
[0095]进一步的，动态标绘的箭头可以为简单箭头、空心箭头和曲线箭头。
[0096]其中，简单箭头由一条主线(箭头主体)和由两条交于顶点的短直线(箭头头部)组成，主线通过操作对象的两个点击操作确定。上述箭头主体的参数具体为通过两点确定的主线的长度。箭头头部短线的长度可以通过主线确定，具体的，箭头头部短线的长度可以设定为固定比例的主线长度。短线与主线的夹角可根据比例计算得出，箭头的方向可由主线与水平轴的夹角确定。
[0097]示例性的，操作对象为鼠标，在绘制过程中，用户先用鼠标在HTML5画布中点击一点作为起始点，然后移动鼠标得到第二个点，此时计算箭头方向、箭头头部短线的长度、短线与主线的夹角，得到箭头形状，随着与起始点距离的远近变化，箭头的大小也随之变大或变小，最后点击HTML5画布结束绘制，得到简单箭头。
[0098]空心箭头为直线与简单箭头的结合，在绘制空心箭头时，用户先用鼠标在HTML5画布中点击一点作为起始点，然后移动鼠标得到第二个点，此时计算箭头方向、箭头头部短线的长度、短线与主线的夹角，得到箭头形状，最后点击HTML5画布结束绘制。与简单箭头不同的时，空心箭头把主线扩展成面(即多边形)，箭头头部的短直线同样扩展成面。
[0099]曲线箭头是在空心箭头的基础上，保持箭头的头部形状不变，箭头尾部的多边形随着鼠标的点击和移动形成弯曲的空心曲线，绘制过程与空心箭头类似，区别在于，在绘制时可以通过多次点击，使箭头主体部分形成弯曲的曲线，即，箭头主体的形状通过多次点击操作确定。
[0100]与上述方法相对应，本发明实施例还提供了一种基于HTML5的动态标绘装置，请参阅图5，示出了该装置的结构示意图，该装置可以包括:获取模块501、检测模块502和标绘模块503。其中:
[0101]获取模块501，用于获取第一标绘对象。
[0102]检测模块502，用于检测操作对象在HTML5画布中操作区域的操作。
[0103]标绘模块503，用于依据检测模块502检测的操作对象的操作以及与获取模块501获取的第一标绘对象对应的标绘规则将第一标绘对象绘制在HTML5画布中。
[0104]本发明实施例提供的基于HTML5的动态标绘装置，在获取第一标绘对象之后，通过检测到的操作对象在HTML5画布中操作区域的操作，基于与第一标绘对象对应的标绘规则能够将第一标绘对象绘制在HTML5画布中，从而实现了基于HTML5的动态标绘。
[0105]进一步的，上述实施例中的检测模块502，具体用于检测操作对象在HTML5画布中操作区域中的点击和移动操作。
[0106]在上述实施例中，第一标绘对象可以为线，进一步的，线为直线、曲线或弧线。
[0107]当第一标绘对象为直线时，标绘模块503可以包括:第一标绘子模块。
[0108]第一标绘子模块，用于在检测模块502检测到操作对象的第一操作之后，通过擦除、重绘的方式始终连接第一位置点与操作对象当前的位置点，直至检测到所述操作对象的第二操作为止。
[0109]其中，第一操作用于指示开始标绘，第二操作用于指示结束标绘，第一位置点为操作对象执行第一操作时所处的位置点，操作对象执行第二操作时所处的位置点将作为第二位置点，则第一标绘对象为第一位置点和第二位置点之间连接的直线。
[0110]当第一标绘对象为曲线或弧线时，标绘模块503包括:第二标绘子模块。
[0111]第二标绘子模块，在检测到操作对象的第一操作之后，通过擦除、重绘的方式始终连接第一位置点和操作对象当前的位置点，直至检测到操作对象的第二操作为止；在检测到操作对象的第二操作之后，通过擦除、重绘的方式始终连接第二位置点与操作对象当前的位置点，直至检测到操作对象的第三操作为止。
[0112]其中，第一位置点为所述操作对象执行第一操作时所处的位置点，第二位置点为操作对象执行第二操作时所处的位置点，将操作对象执行第三操作时所处的位置点作为第三位置点，曲线的弧度由第二位置点确定；弧线的弧度由两直线的夹角确定，该两直线分别为连接第一位置点与第二位置点的直线，以及，连接第二位置点与第三位置点的直线，夹角的顶点为第二位置点。
[0113]在上述实施例中，第一标绘对象为面，操作对象的操作至少包括两个操作；
[0114]所述标绘模块包括:第一确定子模块和第一绘制子模块。其中:
[0115]第一确定子模块，用于在检测模块502检测到操作对象的操作之后，通过操作对象的操作确定第一标绘对象的参数。
[0116]其中，第一标绘对象的参数用于确定第一标绘对象的形状和大小。
[0117]第一绘制子模块，用于在第一确定子模块确定出第一标绘对象的参数之后，基于第一标绘对象的参数生成第一标绘对象。
[0118]在上述实施例中，第一标绘对象为箭头，箭头包括箭头主体和箭头头部。
[0119]则标绘模块包括:第二确定模块子、计算子模块和第二绘制子模块。其中:
[0120]第二确定子模块，用于在检测模块502检测到操作对象的第一操作之后，通过操作对象在执行第一操作时所处的位置点和操作对象当前所处的位置点确定箭头主体的参数。
[0121]计算子模块，用于利用第二确定子模块确定出的箭头主体的参数依据预设的计算规则计算箭头头部的参数。
[0122]第二绘制子模块，用于在检测模块502检测到操作对象的第二操作之后，基于第二确定子模块确定出的箭头主体的参数和计算子模块计算出的箭头头部的参数生成第一标绘对象。