本发明涉及计算机技术领域，尤其涉及一种绘制文本的方法及装置。
背景技术：
画布(canvas)元素是超文本标记语言5.0(hypertextmarkuplanguage5.0，简称html5)应用中的一个新元素，它用于在网页上绘制图形。canvas元素自己没有绘图的能力，它是将一个绘图的api展现给客户端，使客户端使用javascript将想要绘制的图形内容绘制到canvas上。另外，通过多种方法也可以将绘制字符、文本，或者将图像等添加到canvas上。
当在一个有限宽度的canvas上绘制文本时，通常是先设置绘制的起点坐标，然后从起点坐标开始由左向右将文本一次性绘制到canvas上，由于canvas本身只支持单行绘制，因此当需要绘制的文本比较长且单行排列的总长度超过canvas的宽度时，则会根据canvas的宽度进行适当的缩小文本以适应canvas的宽度。但是，当文本过长，并将其缩小到可视的范围内时依然不能将完整的文本绘制在canvas中时，对于超出canvas宽度的部分文本则不会在canvas上绘制，而是将超出的部分省略，而且还可能出现在canvas最右边可能出现只显示某个字符的一部分的情况。综上可以看出，现有的在canvas上绘制文本的方法效果差。
技术实现要素：
鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的一种绘制文本的方法及装置。
为解决上述技术问题，一方面，本发明提供了一种绘制文本的方法，该方法包括：
在画布canvas上绘制每一个字符之前，计算当前的剩余宽度，所述剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，所述字符终点横坐标为所述前一个字符的字符起点横坐标与所述前一个字符的字符 宽度之和；
判断所述剩余宽度是否小于待绘制字符的字符宽度；
若所述剩余宽度不小于所述待绘制字符的字符宽度，则在所述前一个字符之后绘制所述待绘制字符；
若所述剩余宽度小于所述待绘制字符的字符宽度，则换行绘制所述待绘制字符。
另一方面，本发明还提供了一种绘制文本的装置，该装置包括：
计算单元，用于在画布canvas上绘制每一个字符之前，计算当前的剩余宽度，所述剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，所述字符终点横坐标为所述前一个字符的字符起点横坐标与所述前一个字符的字符宽度之和；
判断单元，用于判断所述剩余宽度是否小于待绘制字符的字符宽度；
第一绘制单元，用于若所述剩余宽度不小于所述待绘制字符的字符宽度，则在所述前一个字符之后绘制所述待绘制字符；
第二绘制单元，用于若所述剩余宽度小于所述待绘制字符的字符宽度，则换行绘制所述待绘制字符。
借由上述技术方案，本发明提供的绘制文本的方法及装置，能够在画布canvas上绘制每一个字符之前，首先计算canvas的宽度减去前一个字符的字符终点横坐标的差值得到当前canvas的剩余宽度，其中字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和；然后判断canvas当前剩余宽度是否小于待绘制字符的字符宽度，若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符，若剩余宽度小于待绘制字符的字符宽度，则另起一行绘制待绘制的字符。与现有技术相比，本发明能够在canvas上通过逐个绘制字符的方式绘制文本，并在每绘制一个字符之前计算当前canvas的剩余宽度，然后判断剩余宽度是否小于待绘制字符的字符宽度，并根据判断的结果来决定是否进行换行绘制待绘制字符，实现了文本的分行绘制，使绘制不再受到canvas宽度的限制，即使是较长的文本也可以正常和完整的绘制到canvas中，展现出更好的绘制效果。
附图说明
通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：
图1示出了本发明实施例提供的一种绘制文本的方法流程图；
图2示出了本发明实施例提供的另一种绘制文本的方法流程图；
图3示出了本发明实施例提供的一种绘制文本的装置的组成框图；
图4示出了本发明实施例提供的另一种绘制文本的装置的组成框图。
具体实施方式
下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。
为解决现有的在canvas上绘制文本的方法效果差的问题，本发明实施例提供了一种绘制文本的方法，如图1所示，该方法包括：
101、在canvas上绘制每一个字符之前，计算当前的剩余宽度。
在实际canvas的应用场景中，为了使用的便捷性，通常会设置一个通用的canvas，通用的canvas主要是对其属性的规定和设置，包括规定canvas的宽度、绘制的起点坐标等。因此通过javascript在通用canvas上绘制文本之前，首先需要从canvas的属性中获取canvas的起点坐标，然后从canvas的起点坐标开始绘制文本中的字符。
为了使每个字符都能够完整的绘制到canvas中，因此在每绘制一个字符之前首先需要计算当前canvas的剩余宽度。其中剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，且字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和。需要说明的是canvas宽度是从canvas的属性中获取的。
102、判断剩余宽度是否小于待绘制字符的字符宽度。
在通过计算得到canvas当前的剩余宽度之后，就可以判断待绘制字符是否可以被完整绘制到canvas中了。具体的是通过判断当前剩余宽度是否小于待绘制字符的字符宽度来决定是否待绘制的字符可以被完整的绘制到canvas中。
103、若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符。
对于步骤102中的判断，若判断结果为剩余宽度不小于待绘制字符的字符宽度，则表示待绘制的字符能被完整的绘制到canvas中，因此在前一个字符之后绘制待绘制的字符。
104、若剩余宽度小于待绘制字符的字符宽度，则换行绘制待绘制字符。
对于步骤102中的判断，若判断结果为剩余宽度小于待绘制字符的字符宽度，则表示待绘制的字符不能被完整的绘制到canvas中，因此需要换行进行绘制待绘制的字符。
按照上述步骤101到104的步骤逐个绘制文本中的字符，直到文本中所有的字符被绘制完为止。
本实施例提供的绘制文本的方法，能够在画布canvas上绘制每一个字符之前，首先计算canvas的宽度减去前一个字符的字符终点横坐标的差值得到当前canvas的剩余宽度，其中字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和；然后判断canvas当前剩余宽度是否小于待绘制字符的字符宽度，若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符，若剩余宽度小于待绘制字符的字符宽度，则另起一行绘制待绘制的字符。与现有技术相比，本实施例能够在canvas上通过逐个绘制字符的方式绘制文本，并在每绘制一个字符之前计算当前canvas的剩余宽度，然后判断剩余宽度是否小于待绘制字符的字符宽度，并根据判断的结果来决定是否进行换行绘制待绘制字符，实现了文本的分行绘制，使绘制不再受到canvas宽度的限制，即使是较长的文本也可以正常和完整的绘制到canvas中，展现出更好的绘制效果。
进一步的，作为对图1所示实施例的细化及扩展，本发明还提供了另一实施例。如图2所示，该实施例中绘制文本的方法包括：
201、在另一canvas上绘制待绘制字符。
在另一canvas上绘制待绘制字符是为了获取待绘制字符的字符宽度和字符高度，因为只根据字符本身设置的大小，比如字符设置为三号黑体，不能够精确计算出其在canvas中所占的宽度和高度。获取待绘制字符的字符宽度和字符高度是为后面判断待绘制字符是否需要绘制到下一行的必要准备。
需要说明的是另一canvas是在html文档的body节点中添加的一个新canvas，该canvas的宽度和高度足够绘制下要绘制的字符。
202、通过遍历另一canvas上所有像素点的数据，确定待绘制字符的字符宽度以及待绘制字符的字符高度。
当在另一canvas上绘制完待绘制的字符时，遍历另一canvas上所有像素点的数据，即所有像素点的坐标，然后确定待绘制字符的字符宽度和待绘制字符的字符高度。具体的确定过程为：逐行地遍历所有像素点，并在遍历所有像素点时，将与提前设置的绘制待绘制字符的颜色相同的像素点的坐标提取出来；然后将所有提取出的像素点的坐标中横坐标的最大值确定为待绘制字符的字符宽度，将所有提取出的像素点的坐标中纵坐标的最大值确定为待绘制字符的高度。
203、在canvas上绘制每一个字符之前，计算当前的剩余宽度。
剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和。其中字符的字符宽度就是由步骤202的方法得到的，每一个字符的起点横坐标就是上一个字符的终点横坐标，而第一个字符的起点横坐标是canvas的起点坐标的横坐标，其中canvas的起点坐标的获取方式与图1步骤101中获取canvas的起点坐标的获取方式是相同的。
204、判断剩余宽度是否小于待绘制字符的字符宽度。
本步骤的实现方式与图1步骤102的实现方式相同，此处不再赘述。
205、若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符。
本步骤的实现方式与图1步骤103的实现方式相同，此处不再赘述。
206、若剩余宽度小于待绘制字符的字符宽度，则换行绘制待绘制字符。
换行绘制待绘制字符包括：
首先，确定换行后绘制待绘制字符的起点坐标。本实施例中是将canvas的起点坐标的横坐标作为换行后绘制待绘制字符的起点坐标的横坐标，即每一行的起点的横坐标是相同的；而换行后绘制待绘制字符的起点坐标的纵坐标是根据上一行中绘制的所有字符的字符高度来确定的，具体的是将上一行的起点坐标的纵坐标与上一行中绘制的所有字符的字符高度的最大值之和作为换行后绘制待绘制字符的起点坐标的纵坐标，其中第一行的起点坐标的纵坐标是确定的。
然后，从换行后绘制待绘制字符的起点坐标开始，绘制待绘制字符。
进一步的，当字符间存在字符间隔时，图1步骤101以及图2步骤203中涉及到的前一个字符的字符终点横坐标为前一个字符的字符起点横坐标、前一个字符的字符宽度以及字符间隔三者之和。当每行间存在行间距时，图2步骤206中的换行后绘制待绘制字符的起点坐标的纵坐标为上一行的起点坐标的纵坐标、上一行中绘制的所有字符的字符高度的最大值以及行间距三者之和。另外图2步骤206中的换行后的起点坐标的横坐标也可以设置为别的值，并且canvas中每一行的起点的横坐标可以各不相同，在实际的应用中可以根据实际的需要自由设定。
进一步的，作为对上述图1和图2所示方法的实现，本发明实施例另一实施例还提供了一种绘制文本的装置，用于对上述图1和图2所示的方法进行实现。该装置实施例与前述方法实施例对应，为便于阅读，本装置实施例不再对前述方法实施例中的细节内容进行逐一赘述，但应当明确，本实施例中的装置能够对应实现前述方法实施例中的全部内容。如图3所示，该装置包括：计算单元31、判断单元32、第一绘制单元33及第二绘制单元34。
计算单元31，用于在画布canvas上绘制每一个字符之前，计算当前的剩余宽度，剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和；
判断单元32，用于判断剩余宽度是否小于待绘制字符的字符宽度；
第一绘制单元33，用于若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符；
第二绘制单元34，用于若剩余宽度小于待绘制字符的字符宽度，则换行绘制待绘制字符。
进一步的，如图4所示，第二绘制单元34包括：
确定模块341，用于确定换行后绘制待绘制字符的起点坐标；
绘制模块342，用于从换行后绘制待绘制字符的起点坐标开始，绘制待绘制字符。
进一步的，确定模块341用于：
将canvas的起点坐标的横坐标作为换行后绘制待绘制字符的起点坐标的横坐标，根据上一行中绘制的所有字符的字符高度确定换行后绘制待绘制字符的起点坐标的纵坐标。
进一步的，如图4所示，装置进一步包括：
第三绘制单元35，用于在计算当前的剩余宽度之前，在另一canvas上绘制待绘制字符，另一canvas是在超文本标记语言html文档中添加的一个新canvas；
确定单元36，用于通过遍历另一canvas上所有像素点的数据，确定待绘制字符的字符宽度以及待绘制字符的字符高度。
进一步的，当字符间存在字符间隔时，计算单元31中的前一个字符的字符终点横坐标为前一个字符的字符起点横坐标、前一个字符的字符宽度以及字符间隔三者之和。
本实施例提供的绘制文本的装置，能够在画布canvas上绘制每一个字符之前，首先计算canvas的宽度减去前一个字符的字符终点横坐标的差值得到当前canvas的剩余宽度，其中字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和；然后判断canvas当前剩余宽度是否小于待绘制字符的字符宽度，若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符，若剩余宽度小于待绘制字符的字符宽度，则另起一行绘制待绘制的字符。与现有技术相比，本实施例能够在 canvas上通过逐个绘制字符的方式绘制文本，并在每绘制一个字符之前计算当前canvas的剩余宽度，然后判断剩余宽度是否小于待绘制字符的字符宽度，并根据判断的结果来决定是否进行换行绘制待绘制字符，实现了文本的分行绘制，使绘制不再受到canvas宽度的限制，即使是较长的文本也可以正常和完整的绘制到canvas中，展现出更好的绘制效果。
所述绘制文本装置包括处理器和存储器，上述计算单元31、判断单元32、第一绘制单元33及第二绘制单元34等均作为程序单元存储在存储器中，由处理器执行存储在存储器中的上述程序单元来实现相应的功能。
本申请还提供了一种计算机程序产品，当在数据处理设备上执行时，适于执行初始化有如下方法步骤的程序代码：在画布canvas上绘制每一个字符之前，计算当前的剩余宽度，所述剩余宽度为canvas宽度减去前一个字符的字符终点横坐标的差值，所述字符终点横坐标为所述前一个字符的字符起点横坐标与所述前一个字符的字符宽度之和；判断所述剩余宽度是否小于待绘制字符的字符宽度；若所述剩余宽度不小于所述待绘制字符的字符宽度，则在所述前一个字符之后绘制所述待绘制字符；若所述剩余宽度小于所述待绘制字符的字符宽度，则换行绘制所述待绘制字符。
本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方 框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中，计算设备包括一个或多个处理器(cpu)、输入/输出接口、网络接口和内存。
存储器可能包括计算机可读介质中的非永久性存储器，随机存取存储器(ram)和/或非易失性内存等形式，如只读存储器(rom)或闪存(flashram)。存储器是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(pram)、静态随机存取存储器(sram)、动态随机存取存储器(dram)、其他类型的随机存取存储器(ram)、只读存储器(rom)、电可擦除可编程只读存储器(eeprom)、快闪记忆体或其他内存技术、只读光盘只读存储器(cd-rom)、数字多功能光盘(dvd)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitorymedia)，如调制的数据信号和载波。
以上仅为本申请的实施例而已，并不用于限制本申请。对于本领域技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本申请的权利要求范 围之内。