[发明专利]基于Canvas画布的区域图形编辑方法及装置

权利要求书

1.基于Canvas画布的区域图形编辑方法，其特征在于，在Canvas画布上对区域图形进行编辑时，包括以下步骤：

获取所述Canvas画布上每一所述区域图形对应的图形数据组成图形数据集，所述图形数据集中每一所述图形数据按照对应区域图形的层级排序；

监听所述Canvas画布上的鼠标点击事件，获取鼠标点击位置；

清空所述Canvas画布，遍历所述图形数据集，按照所述图形数据集中的图形数据依次重新绘制对应的区域图形，每重新绘制一个所述区域图形判断所述鼠标点击位置是否在该区域图形内，若所述鼠标点击位置在该区域图形内，则将该区域图形作为选中区域图形；

对所述选中区域图形进行编辑操作。

2.根据权利要求1所述的基于Canvas画布的区域图形编辑方法，其特征在于，在“将该区域图形作为选中区域图形”后，包括：绘制下一区域图形时不再判断所述鼠标点击位置是否在该区域图形内。

3.根据权利要求1所述的基于Canvas画布的区域图形编辑方法，其特征在于，将所述选中区域图形对应的图形数据设置选中标记，在重新绘制完所有图形数据对应的区域图形后，将所述选中标记对应的图形数据调整至所述图形数据集的首位。

4.根据权利要求1所述的基于Canvas画布的区域图形编辑方法，其特征在于，当所述编辑操作为移动操作时：

持续监听鼠标移动事件，获取鼠标实时位置；

根据所述鼠标实时位置与所述鼠标点击位置的距离计算移动距离；

根据所述移动距离和所述选中区域图形对应的图形数据计算所述选中区域图形新的图形数据；

清空所述选中区域图形，并根据新的图形数据进行重新绘制。

当鼠标松开时不再监听所述鼠标移动事件。

5.根据权利要求1所述的基于Canvas画布的区域图形编辑方法，其特征在于，当所述编辑操作为删除操作时：清空所述选中区域图形，并删除所述选中区域图形对应的图形数据。

6.根据权利要求1所述的基于Canvas画布的区域图形编辑方法，其特征在于，绘制所述区域图形的方法为：根据所述区域图形对应的图形数据依次获取至少一点位，并根据所述区域图形对应的绘制操作集依次获取对应每一所述点位的绘制操作，根据每一所述点位的绘制操作依次进行绘制。

7.基于Canvas画布的区域图形编辑装置，其特征在于，在Canvas画布上对区域图形进行编辑时，包括以下模块：

获取模块，用于获取所述Canvas画布上每一所述区域图形对应的图形数据组成图形数据集，所述图形数据集中每一所述图形数据按照对应区域图形的层级排序；

监听模块，用于监听所述Canvas画布上的鼠标点击事件，获取鼠标点击位置；

选中模块，用于清空所述Canvas画布，遍历所述图形数据集，按照所述图形数据集中的图形数据依次重新绘制对应的区域图形，每重新绘制一个所述区域图形判断所述鼠标点击位置是否在该区域图形内，若所述鼠标点击位置在该区域图形内，则将该区域图形作为选中区域图形；

操作模块，用于对所述选中区域图形进行编辑操作。

8.一种电子装置，包括存储器和处理器，其特征在于，所述存储器中存储有计算机程序，所述处理器被设置为运行所述计算机程序以执行权利要求1至6任一所述的基于Canvas画布的区域图形编辑方法。

9.一种可读存储介质，其特征在于，所述可读存储介质中存储有计算机程序，所述计算机程序包括用于控制过程以执行过程的程序代码，所述过程包括根据权利要求1至6任一项所述的基于Canvas画布的区域图形编辑方法。