[发明专利]一种基于HTMLcanvas的焦点框绘制方法及装置

摘要

本发明涉及Web前端开发技术领域，尤其涉及一种基于HTML canvas的焦点框绘制方法及装置，用以保证避免绘制代码的同时，实现节省存储空间及运行内存、提升处理速度。在本申请中，基于选定的一焦点框图片，从中为待绘制焦点框的焦点元素确定至少一局部图片，根据焦点元素的位置确定各个局部图片的位置，并在确定的位置处绘制相应的局部图片，以得到该焦点元素的焦点框。该方案降低了焦点框绘制的复杂度，且灵活兼容个性化焦点框并实现多种类型的焦点框绘制；另外，无需绘制存储各个尺寸的焦点框，避免大量绘制代码。且每一类型焦点框仅使用一张焦点框图片，保证存储焦点框图片不会过多，节省了存储空间，保证了处理速度及内存。

主权项

一种基于HTML canvas的焦点框绘制方法，其特征在于，所述方法包括：在用户界面开启之后，确定一焦点框图片，所述焦点框图片为包含模板焦点框的矩形图片；从所述焦点框图片中确定至少一个包含至少部分模板焦点框的局部图片；根据待绘制焦点框的焦点元素在所述用户界面的位置坐标，计算所述局部图片中模板焦点框的边界与所述焦点元素的边界重合时所述局部图片在所述用户界面的位置坐标；在计算出的位置坐标处绘制相应的局部图片。