[发明专利]一种基于网页的九切图绘制方法

权利要求书

1.一种基于网页的九切图绘制方法，其特征在于包含以下步骤：

（1）通过javascript语言把原始图片绘制在Html5的Canvas画布上，并读取所述原始图片的首行、首列、尾行和尾列的像素值；

（2）根据步骤（1）读取的原始图片像素值来判断所述原始图片是否为九切图，若是九切图，则进入步骤（3）；若是非九切图，则跳过后续步骤，结束绘制；

（3）确定所述原始图片缩放与非缩放区域：分析步骤（1）读取的原始图片像素值，确定原始九切图各个区域位置和大小；

（4）确定目标图片大小：根据实际情况自定义目标图片的宽度和高度；

（5）判断目标图片是放大还是缩小并进行绘制：将步骤（4）中自定义好的目标图片的宽度和高度分别与所述原始图片宽度和高度进行比较，计算所述目标图片宽度和高度占所述原始图片宽度和高度的百分比，从而确定所述目标图片是缩小还是放大；若是放大，则直接进入九切图绘制步骤；若是缩小，则先放大，使其大于所述原始图片大小的最小值，然后进入九切图绘制步骤，再进行等比例缩小，最后显示在网页上。

2.如权利要求1所述的一种基于网页的九切图绘制方法，其特征在于，所述步骤（2）的九切图判断标准为，根据所述原始图片首行和首列的像素值是否只存在黑色和透明，尾行和尾列的像素值是否全为黑色、全为透明或者只存在黑色和透明进行判断，若是则为九切图，若不是则为非九切图；所述黑色的RGBA值为#000255，所述透明的RGBA值为#0000。

3.如权利要求1所述的一种基于网页的九切图绘制方法，其特征在于，所述步骤（3）确定九切图9个区域位置和大小的方法是，以所述Canvas画布的左上角为起始点，所述九切图9个区域的位置用坐标x和坐标y表示，x表示各区域所在位置与所述起始点的水平距离；y表示各区域所在位置与所述起始点的垂直距离；所述九切图9个区域的大小用width和height表示，width表示区域的宽度；height表示区域的高度；所述九切图9个区域分为水平垂直都不缩放区域（1、3、7、9），水平缩放、垂直不缩放区域（2、8），水平不缩放、垂直缩放区域（4、6）和水平垂直都缩放区域（5）四种。

4.如权利要求1所述的一种基于网页的九切图绘制方法，其特征在于，所述步骤（5）的九切图绘制，以所述Canvas画布上的所述目标图片的画笔的位置是否小于所述原始图片的高和宽作为双循环条件，所述位置用x、y二维坐标表示；根据所述目标图片的首行第二个像素值是否为黑色，首列第二个像素值是否为黑点，来判断所述目标图片的优先绘制区域；根据所述9个区域各自占所述目标图片总区域的百分比，对所述9个区域进行缩放。

5.如权利要求1或4所述的一种基于网页的九切图绘制方法，其特征在于，所述九切图绘制具体实现步骤为：

（1）初始化参数，所述参数主要包括所述原始图片大小，所述目标图片大小，所述Canvas画布大小及其起始点，所述原始图片首行、首列、尾行、尾列的像素值，所述缩放和非缩放区域的位置和大小；

（2）判断所述目标图片大小是否小于所述原始图片大小，若是则以所述目标图片大小乘以固定放大因子，直到所述目标图片大小大于所述原始图片大小的最小值；若不是则进入步骤（3）；

（3）判断是否为特殊九切图，若是，则重新计算水平和垂直缩放的长度，再进行步骤

（4），若不是则直接进入步骤（4），所述特殊九切图为只含所述垂直水平都缩放、垂直缩放水平不缩放、垂直不缩放水平缩放和垂直水平都不缩四种区域中部分区域的九切图；

（4）判断所述Canvas画布的画笔当前位置，用坐标点x、y表示，判断y是否小于当前图片的高度，若不是，则表示所述当前图像绘制完成，进行步骤（5）；若是，则判断x是否小于所述当前图片宽度，若不是，则跳出该循环；若是，则根据所述当前图片首列第二个和首行第二个像素值是黑点还是透明，确定优先绘制区域，并进行循环判断并依次绘制，直到y不小于前图片的高度时，跳出循环，表示绘制完成，进行步骤（5）；所述当前图片为绘制过程中中间图片；

（5）判断所述当前图片的大小是否大于所述目标图片大小，若是，则用所述Canvas画布等比例缩小到所述目标图片大小，绘制在网页上；若不是，则直接绘制在网页上。

6.如权利要求5所述的一种基于网页的九切图绘制方法，其特征在于，所述步骤（2）的固定放大因子为1.5。