本发明属于信息处理技术领域，具体涉及一种利用字体库基于canvas实现字体显示的方法。
背景技术：
在采用html5开发和使用前端的执行程序过程中，均会使用到字体。目前，html5开发和使用执行程序过程中，存在以下问题：开发端在开发执行程序的过程中，常常需要采用一些已授权的第三方字体显示汉字、字母或特殊符号。并且，从开发端来讲，采用这些已授权的第三方字体时，显示效果更优。而用户端在运行执行程序时，由于用户端系统环境互不相同，因此，用户端系统环境的字体库并不相同，当用户端字体库中并不存在相应的字体时，只能采用默认的系统字体显示执行程序中的汉字、字母或特殊符号，由此导致汉字、字母或特殊符号的显示效果与开发端差异明显，对此必然影响用户的体验。
为解决以上问题，通常采用以下方法解决：
在执行程序开发过程中，将已授权的字体库嵌入到执行程序中。然而，由于字体库体积比较大，必然会加大整个执行程序的体积。
技术实现要素：
针对现有技术存在的缺陷，本发明提供一种利用字体库基于canvas实现字体显示的方法，可有效解决上述问题。
本发明采用的技术方案如下：
本发明提供一种利用字体库基于canvas实现字体显示的方法，包括以下
步骤1，确定本次开发的执行程序需要使用的所有字符，并通过所需的字体库显示字符，由此得到字符集合；
步骤2，确定每张字符图片需要配置的字符数量；
步骤3，根据字符集合中的字符总数量以及每张字符图片需要的字符数量，将字符集合划分为m个字符子集合，分别为：字符子集合p1,字符子集合p2,...,字符子集合pm，其中，每个字符子集合的字符数量，等于对应的字符图片需配置的字符数量；
对于任意的字符子集合pi，其中，i＝1,2,...,m，采用以下方法，生成对应的一张字符图片tui:
步骤3.1，分析字符子集合pi中各个字符的尺寸，得到尺寸最大的字符，表示为字符zmax；字符zmax的宽度表示为lmax，字符zmax的高度表示为hmax；
步骤3.2，设字符子集合pi中共有f个字符，分别表示为字符f1,字符f2,...,字符ff；
步骤3.3，令j＝1；
步骤3.4，canvas模块从字符子集合pi中读取出字符fj，对字符fj的背景进行处理，使字符fj的背景尺寸为宽度lmax＊高度hmax，并且，字符fj的背景为透明，从而得到字符fj对应的图片数据对象imagedataj，因此，图片数据对象imagedataj为矩形，其尺寸为宽度lmax＊高度hmax，图片数据对象imagedataj包括字符fj笔画像素以及透明背景；
步骤3.5，canvas模块将图片数据对象imagedataj按渲染规则渲染到画布的当前位置；其中，渲染规则为：预定义每行渲染的图片数据对象的数量，首先进行第1行的渲染，即：将图片数据对象imagedata1渲染到画布的第1行第1列位置；然后，图片数据对象imagedata2渲染到画布的第1行第2列位置，从显示上来看，图片数据对象imagedata2紧贴于图片数据对象imagedata1的后面，依此类推，当将第1行渲染结束后，再进行第2行的渲染；如此循环，完成在对应位置渲染相应的图片数据对象，使各个图片数据对象在画布按矩阵形式排列；
步骤3.6，html5脚本计算得到字符fj的字符编码codej，然后，建立图片数据对象集合vi；所述图片数据对象集合vi采用key:value形式记录每个图片数据对象，其中，图片数据对象imagedataj对应一个key:value记录，key为字符编码codej，value为图片数据对象imagedataj，通过字符编码codej，可查找到图片数据对象imagedataj；
步骤3.7，判断j是否等于f，如果等于，表明已完成对f个字符的渲染和记录操作，执行步骤3.8；否则，令j＝j 1，返回步骤3.3，对下一个字符进行操作；
步骤3.8，将画布上排列的f个图片数据对象imagedataj生成一张字符图片tui，该字符图片tui对应一个字符子集合pi和一个图片数据对象集合vi，同时，字符图片tui对应的字符尺寸为宽度lmax＊高度hmax；
步骤4，在开发执行程序的过程中，当需要使用特定的目标字符z0时，根据目标字符z0查找各个字符子集合，查找到包含目标字符z0的字符子集合，表示为字符子集合p0；
然后，根据字符子集合p0定位到对应的图片数据对象集合v0和字符图片tu0；再根据目标字符z0的字符编码code0查找图片数据对象集合v0，定位到key为字符编码code0的图片数据对象imagedata0，进而实现在字符图片tu0中定位到图片数据对象d0；
然后，根据字符尺寸，即：宽度lmax＊高度hmax，从字符图片tu0对应位置取出宽度lmax＊高度hmax的矩形区域，取出的矩形区域即为图片数据对象imagedata0；
对取出的图片数据对象imagedata0进行预处理后，被执行程序调用，并显示到被执行程序的调用位置。
优选的，步骤3.6中，字符编码为unicode码。
优选的，步骤4中，对取出的图片数据对象imagedata0进行预处理，包括调节图片数据对象imagedata0的色彩以及尺寸。
本发明提供的一种利用字体库基于canvas实现字体显示的方法具有以下优点：
(1)开发端在开发执行程序的过程中，嵌入到执行程序的字符并非传统意义的字符，而是以图片数据对象imagedata形式呈现的字符，当用户端运行该执行程序时，既使用户端系统环境没有安装对应的字体库，字符显示效果仍然保持与开发端需要呈现的效果一致，进而提高用户的使用体验；
(2)由于用户端不需要安装额外的字体库，降低了用户使用执行程序的步骤；
(3)由于执行程序中不需要嵌入特定的字体库，显著降低了执行程序的体积。
附图说明
图1为本发明提供的一种利用字体库基于canvas实现字体显示的方法的流程示意图。
具体实施方式
为了使本发明所解决的技术问题、技术方案及有益效果更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本发明，并不用于限定本发明。
本发明提供一种利用字体库基于canvas实现字体显示的方法，具有以下特点：在开发端需要采用已有第三方授权的字体情况下，无需将整个字体库嵌入到执行程序，只需要将执行程序中所使用到的所有文符去重，去空格后，计算出需要的字符尺寸，按照字符尺寸，将字符整合成一张或者多张字符图片，每张字符图片对应一个字符子集，在使用时，直接加载对应的字符图片中的图片数据对象，然后将图片数据对象放入执行对象的对应位置，即实现对字符的调用显示。
与现有的技术相比较，优点主要体现在：
(1)执行程序无需嵌入整个字体库，即能实现采用特定字体字符的效果；
(2)用户端既使没有安装特定字体库，字符显示效果仍然保持与开发端需要呈现的效果一致，进而提高用户的使用体验。
本发明提供一种利用字体库基于canvas实现字体显示的方法，参考图1，包括以下步骤：
步骤1，确定本次开发的执行程序需要使用的所有字符，并通过所需的字体库显示字符，由此得到字符集合；
例如，本次开发的某个执行程序需要使用到8000个字符，则采用所需的字体和统一的字号，显示字符，得到字符集合。其中，字体为开发者采用的已授权的第三方字体，采用此种字体，对该执行程序的显示效果最优。
步骤2，确定每张字符图片需要配置的字符数量；
例如，每张字符图片需要配置的字符数量为800个字符。
步骤3，根据字符集合中的字符总数量以及每张字符图片需要的字符数量，将字符集合划分为m个字符子集合，分别为：字符子集合p1,字符子集合p2,...,字符子集合pm，其中，每个字符子集合的字符数量，等于对应的字符图片需配置的字符数量；
因此，本次开发的某个执行程序需要使用到8000个字符，每张字符图片需要配置的字符数量为800个字符时，共将8000个字符分为10个字符子集合。
对于任意的字符子集合pi，其中，i＝1,2,...,m，采用以下方法，生成对应的一张字符图片tui:
步骤3.1，分析字符子集合pi中各个字符的尺寸，得到尺寸最大的字符，表示为字符zmax；字符zmax的宽度表示为lmax，字符zmax的高度表示为hmax；
本发明中，对于某个字符子集合pi，其对应的800个字符的字号均相等，本发明此步骤字符尺寸并不是字号。本发明中，字符包括各种文字、英文字母、标点符号以及特殊符号等。因此，在相同的字号下，各种字符的尺寸并不相等，例如，对于字符“！”与文字“特”，很明显，字符“！”的宽度，小于文字“特”的宽度。因此，为了保证对应的800个字符均呈现最佳显示效果，首先从800个字符中查找到尺寸最大的字符，其最小外接矩形，即为该字符的尺寸。
步骤3.2，设字符子集合pi中共有f个字符，分别表示为字符f1,字符f2,...,字符ff；
步骤3.3，令j＝1；
步骤3.4，canvas模块从字符子集合pi中读取出字符fj，对字符fj的背景进行处理，使字符fj的背景尺寸为宽度lmax＊高度hmax，并且，字符fj的背景为透明，从而得到字符fj对应的图片数据对象imagedataj，因此，图片数据对象imagedataj为矩形，其尺寸为宽度lmax＊高度hmax，图片数据对象imagedataj包括字符fj笔画像素以及透明背景；
也就是说，对于对应的800个字符，采用本步骤的处理，首先使每个字符对应的图片数据对象imagedata的尺寸相等，均为宽度lmax＊高度hmax。例如，对于字符“！”，在不改变其字号的前提下，扩充其背景所占的像素，即可实现图片数据对象imagedata的尺寸调整功能。
步骤3.5，canvas模块将图片数据对象imagedataj按渲染规则渲染到画布的当前位置；其中，渲染规则为：预定义每行渲染的图片数据对象的数量，首先进行第1行的渲染，即：将图片数据对象imagedata1渲染到画布的第1行第1列位置；然后，图片数据对象imagedata2渲染到画布的第1行第2列位置，从显示上来看，图片数据对象imagedata2紧贴于图片数据对象imagedata1的后面，依此类推，当将第1行渲染结束后，再进行第2行的渲染；如此循环，完成在对应位置渲染相应的图片数据对象，使各个图片数据对象在画布按矩阵形式排列；
步骤3.6，html5脚本计算得到字符fj的字符编码codej，作为一种具体实现方式，可采用unicode码作为字符编码。通过字符编码，实现对字符含义的唯一标识作用。
然后，建立图片数据对象集合vi；所述图片数据对象集合vi采用key:value形式记录每个图片数据对象，其中，图片数据对象imagedataj对应一个key:value记录，key为字符编码codej，value为图片数据对象imagedataj，通过字符编码codej，可查找到图片数据对象imagedataj；
步骤3.7，判断j是否等于f，如果等于，表明已完成对f个字符的渲染和记录操作，执行步骤3.8；否则，令j＝j 1，返回步骤3.3，对下一个字符进行操作；
步骤3.8，将画布上排列的f个图片数据对象imagedataj生成一张字符图片tui，该字符图片tui对应一个字符子集合pi和一个图片数据对象集合vi，同时，字符图片tui对应的字符尺寸为宽度lmax＊高度hmax；
因此，对于前述800个字符，最终得到以下内容：
一个字符子集合，字符子集合内排列的字符，具有字符含义；
一张字符图片，包含该800个字符对应的图片数据对象imagedata，其中，一个字符对应一个统一尺寸的图片数据对象imagedata；
一个图片数据对象集合，实现字符编码与字符图片中图片数据对象imagedata的对应关系；
步骤4，在开发执行程序的过程中，当需要使用特定的目标字符z0时，根据目标字符z0查找各个字符子集合，查找到包含目标字符z0的字符子集合，表示为字符子集合p0；
然后，根据字符子集合p0定位到对应的图片数据对象集合v0和字符图片tu0；再根据目标字符z0的字符编码code0查找图片数据对象集合v0，定位到key为字符编码code0的图片数据对象imagedata0，进而实现在字符图片tu0中定位到图片数据对象d0；
然后，根据字符尺寸，即：宽度lmax＊高度hmax，从字符图片tu0对应位置取出宽度lmax＊高度hmax的矩形区域，取出的矩形区域即为图片数据对象imagedata0；
对取出的图片数据对象imagedata0进行预处理后，被执行程序调用，并显示到被执行程序的调用位置。其中，步骤4中，对取出的图片数据对象imagedata0进行预处理，包括调节图片数据对象imagedata0的色彩以及尺寸。
由此可见，本发明提供的利用字体库基于canvas实现字体显示的方法，具有以下优点：
(1)开发端在开发执行程序的过程中，嵌入到执行程序的字符并非传统意义的字符，而是以图片数据对象imagedata形式呈现的字符，当用户端运行该执行程序时，既使用户端系统环境没有安装对应的字体库，字符显示效果仍然保持与开发端需要呈现的效果一致，进而提高用户的使用体验；
(2)由于用户端不需要安装额外的字体库，降低了用户使用执行程序的步骤；
(3)由于执行程序中不需要嵌入特定的字体库，显著降低了执行程序的体积。
以上所述仅是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也应视本发明的保护范围。
1.一种利用字体库基于canvas实现字体显示的方法，其特征在于，包括以下步骤：
步骤1，确定本次开发的执行程序需要使用的所有字符，并通过所需的字体库显示字符，由此得到字符集合；
步骤2，确定每张字符图片需要配置的字符数量；
步骤3，根据字符集合中的字符总数量以及每张字符图片需要的字符数量，将字符集合划分为m个字符子集合，分别为：字符子集合p1,字符子集合p2,...,字符子集合pm，其中，每个字符子集合的字符数量，等于对应的字符图片需配置的字符数量；
对于任意的字符子集合pi，其中，i＝1,2,...,m，采用以下方法，生成对应的一张字符图片tui:
步骤3.1，分析字符子集合pi中各个字符的尺寸，得到尺寸最大的字符，表示为字符zmax；字符zmax的宽度表示为lmax，字符zmax的高度表示为hmax；
步骤3.2，设字符子集合pi中共有f个字符，分别表示为字符f1,字符f2,...,字符ff；
步骤3.3，令j＝1；
步骤3.4，canvas模块从字符子集合pi中读取出字符fj，对字符fj的背景进行处理，使字符fj的背景尺寸为宽度lmax＊高度hmax，并且，字符fj的背景为透明，从而得到字符fj对应的图片数据对象imagedataj，因此，图片数据对象imagedataj为矩形，其尺寸为宽度lmax＊高度hmax，图片数据对象imagedataj包括字符fj笔画像素以及透明背景；
步骤3.5，canvas模块将图片数据对象imagedataj按渲染规则渲染到画布的当前位置；其中，渲染规则为：预定义每行渲染的图片数据对象的数量，首先进行第1行的渲染，即：将图片数据对象imagedata1渲染到画布的第1行第1列位置；然后，图片数据对象imagedata2渲染到画布的第1行第2列位置，从显示上来看，图片数据对象imagedata2紧贴于图片数据对象imagedata1的后面，依此类推，当将第1行渲染结束后，再进行第2行的渲染；如此循环，完成在对应位置渲染相应的图片数据对象，使各个图片数据对象在画布按矩阵形式排列；
步骤3.6，html5脚本计算得到字符fj的字符编码codej，然后，建立图片数据对象集合vi；所述图片数据对象集合vi采用key:value形式记录每个图片数据对象，其中，图片数据对象imagedataj对应一个key:value记录，key为字符编码codej，value为图片数据对象imagedataj，通过字符编码codej，可查找到图片数据对象imagedataj；
步骤3.7，判断j是否等于f，如果等于，表明已完成对f个字符的渲染和记录操作，执行步骤3.8；否则，令j＝j 1，返回步骤3.3，对下一个字符进行操作；
步骤3.8，将画布上排列的f个图片数据对象imagedataj生成一张字符图片tui，该字符图片tui对应一个字符子集合pi和一个图片数据对象集合vi，同时，字符图片tui对应的字符尺寸为宽度lmax＊高度hmax；
步骤4，在开发执行程序的过程中，当需要使用特定的目标字符z0时，根据目标字符z0查找各个字符子集合，查找到包含目标字符z0的字符子集合，表示为字符子集合p0；
然后，根据字符子集合p0定位到对应的图片数据对象集合v0和字符图片tu0；再根据目标字符z0的字符编码code0查找图片数据对象集合v0，定位到key为字符编码code0的图片数据对象imagedata0，进而实现在字符图片tu0中定位到图片数据对象d0；
然后，根据字符尺寸，即：宽度lmax＊高度hmax，从字符图片tu0对应位置取出宽度lmax＊高度hmax的矩形区域，取出的矩形区域即为图片数据对象imagedata0；
对取出的图片数据对象imagedata0进行预处理后，被执行程序调用，并显示到被执行程序的调用位置。
2.根据权利要求1所述的一种利用字体库基于canvas实现字体显示的方法，其特征在于，步骤3.6中，字符编码为unicode码。
3.根据权利要求1所述的一种利用字体库基于canvas实现字体显示的方法，其特征在于，步骤4中，对取出的图片数据对象imagedata0进行预处理，包括调节图片数据对象imagedata0的色彩以及尺寸。
技术总结