[发明专利]基于wasm的地图矢量渲染方法和装置

说明书

本发明提供了基于wasm的地图矢量渲染方法和装置，包括：创建地图图像图层，该地图图像图层为利用canvas技术创建的；基于wasm渲染方法对地图图像图层进行渲染，得到渲染后的像素数据；将渲染后的像素数据复制到canvas对应的指定存储区；在指定存储区内加载地图图像图层，得到渲染的地图矢量数据，提高了客户端大数据渲染速度和图像加载速度。

技术领域

本发明涉及计算机技术领域，尤其是涉及基于wasm的地图矢量渲染方法和装置。

背景技术

由于web(World Wide Web，全球广域网)应用的跨平台和免安装等优点，地图应用在web端的发展越来越成熟，各种框架层出不穷，各有各的特点，特效和功能都非常丰富，很多新技术也受到了程序员的欢迎，比如webgl(Web Graphics Library，web图形库)、webworker、webassembly(wasm)等，这些技术拓宽了web应用的道路，衍生出了许多大数据矢量渲染的优化方案。

由于目前地图的渲染基本上依赖于javascript的处理能力，javascript语言性能低效，大数据量的渲染效率依然是个比较大的问题，很多功能不得不弱化，在计算一些数据量比较大的场景下并不理想，受限于浏览器的处理能力，需要服务器端渲染切片，再通过http(Hyper Text Transfer Protocol，超文本传输协议)请求获取图像数据并渲染，但这种方式导致整个应用非常臃肿，需要开发和部署独立的切片服务等，考虑到网络带宽和服务器负载等原因，可能渲染效率不是很高。

发明内容

有鉴于此，本发明的目的在于提供基于wasm的地图矢量渲染方法和装置，提高了客户端大数据渲染速度和图像加载速度。

第一方面，本发明实施例提供了一种基于wasm的地图矢量渲染方法，所述方法包括：

创建地图图像图层，所述地图图像图层为利用canvas技术创建的；

基于wasm渲染方法对所述地图图像图层进行渲染，得到渲染后的像素数据；

将所述渲染后的像素数据复制到canvas对应的指定存储区；

在所述指定存储区内加载所述地图图像图层，得到渲染的地图矢量数据。

结合第一方面，本发明实施例提供了第一方面的第一种可能的实施方式，其中，所述方法还包括：

对创建的所述地图图像图层进行初始化，并将初始化的所述地图图像图层传入数据服务地址，以便于对所述地图图像图层进行渲染。

结合第一方面，本发明实施例提供了第一方面的第二种可能的实施方式，其中，所述基于wasm渲染方法对所述地图图像图层进行渲染，得到渲染后的像素数据包括：

获取所述地图图像图层包括的地图矢量数据；

将所述地图矢量数据的经纬度转换为像素坐标；

按照所述地图矢量数据的类型进行渲染处理，得到所述渲染后的像素数据；

其中，所述地图矢量数据的类型包括点、线和面三种类型。

结合第一方面的第二种可能的实施方式，本发明实施例提供了第一方面的第三种可能的实施方式，其中，如果所述地图矢量数据的类型为点类型时，所述按照所述地图矢量数据的类型进行渲染处理的步骤包括：

获取所述点的像素坐标；

根据所述点的像素坐标，查找所述点在所述canvas对应的指定存储区中的位置；

以所述位置为中心，将指定半径范围内的像素点设置为预设颜色。