CN117112950B - 电子地图中对象的渲染方法、装置、终端及存储介质 - Google Patents
电子地图中对象的渲染方法、装置、终端及存储介质 Download PDFInfo
- Publication number
- CN117112950B CN117112950B CN202311357485.5A CN202311357485A CN117112950B CN 117112950 B CN117112950 B CN 117112950B CN 202311357485 A CN202311357485 A CN 202311357485A CN 117112950 B CN117112950 B CN 117112950B
- Authority
- CN
- China
- Prior art keywords
- thread
- rendering
- electronic map
- vector
- texture image
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000009877 rendering Methods 0.000 title claims abstract description 118
- 238000000034 method Methods 0.000 title claims abstract description 61
- 230000002452 interceptive effect Effects 0.000 claims abstract description 9
- 238000004590 computer program Methods 0.000 claims description 16
- 239000000463 material Substances 0.000 claims description 13
- 238000013507 mapping Methods 0.000 claims description 7
- 230000000694 effects Effects 0.000 abstract description 10
- 238000012545 processing Methods 0.000 description 17
- 230000008569 process Effects 0.000 description 13
- 230000006870 function Effects 0.000 description 11
- 238000004364 calculation method Methods 0.000 description 10
- 238000010586 diagram Methods 0.000 description 9
- 230000002093 peripheral effect Effects 0.000 description 6
- 238000013473 artificial intelligence Methods 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 230000004044 response Effects 0.000 description 3
- 238000013475 authorization Methods 0.000 description 2
- 230000005540 biological transmission Effects 0.000 description 2
- 238000004040 coloring Methods 0.000 description 2
- 238000012790 confirmation Methods 0.000 description 2
- 239000007787 solid Substances 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000004891 communication Methods 0.000 description 1
- 230000001419 dependent effect Effects 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 239000000284 extract Substances 0.000 description 1
- 239000004744 fabric Substances 0.000 description 1
- 230000002349 favourable effect Effects 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 230000005055 memory storage Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000000717 retained effect Effects 0.000 description 1
- 230000001131 transforming effect Effects 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/26—Visual data mining; Browsing structured data
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/29—Geographical information databases
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/50—Information retrieval; Database structures therefor; File system structures therefor of still image data
- G06F16/54—Browsing; Visualisation therefor
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/50—Information retrieval; Database structures therefor; File system structures therefor of still image data
- G06F16/56—Information retrieval; Database structures therefor; File system structures therefor of still image data having vectorial format
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/46—Multiprogramming arrangements
- G06F9/50—Allocation of resources, e.g. of the central processing unit [CPU]
- G06F9/5005—Allocation of resources, e.g. of the central processing unit [CPU] to service a request
- G06F9/5027—Allocation of resources, e.g. of the central processing unit [CPU] to service a request the resource being a machine, e.g. CPUs, Servers, Terminals
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F2209/00—Indexing scheme relating to G06F9/00
- G06F2209/50—Indexing scheme relating to G06F9/50
- G06F2209/5018—Thread allocation
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Software Systems (AREA)
- Remote Sensing (AREA)
- Processing Or Creating Images (AREA)
Abstract
本申请公开了一种电子地图中对象的渲染方法、装置、终端及存储介质,涉及计算机技术领域。所述方法包括:在客户端中运行有用于渲染显示电子地图的第一线程,和用于在不干扰第一线程的情况下执行任务的第二线程的情况下,通过第二线程生成至少一个对象对应的矢量纹理图像,矢量纹理图像用于指示至少一个对象分别对应的矢量纹理,矢量纹理用于以有向距离值来表征纹理;通过第二线程生成至少一个对象对应的几何数据,以及将矢量纹理图像和几何数据发送给第一线程;通过第一线程基于矢量纹理图像和几何数据,在电子地图中渲染显示至少一个对象。本申请实施例可应用于地图领域,能够在不增加客户端的主线程运行开销的情况下,提高对象的渲染效果。
Description
技术领域
本申请实施例涉及计算机技术领域,特别涉及一种电子地图中对象的渲染方法、装置、终端及存储介质。
背景技术
随着计算机技术的不断进步和发展,电子地图为人们的生活和出行带来了极大的便捷,电子地图的文字渲染对用户体验有着重要影响。
在相关技术中,采用直接贴图的方式对电子地图中的文字进行渲染,然而该方式是在后端(如服务器)生成纹理图像,以供前端(如客户端)渲染,因此会增加网络开销,在一定程度上影响电子地图所在网页的首屏时间。
发明内容
本申请实施例提供了一种电子地图中对象的渲染方法、装置、终端及存储介质,能够在不增加客户端的主线程运行开销的情况下,提高电子地图中对象的渲染效果,以及降低纹理图像的传输对电子地图所在网页的首屏时间的影响。所述技术方案包括下内容。
根据本申请实施例的一个方面,提供了一种电子地图中对象的渲染方法,所述方法由客户端执行,所述客户端中运行有第一线程和第二线程,所述第一线程用于渲染显示电子地图,所述第二线程用于在不干扰所述第一线程的情况下执行任务;所述方法包括:
通过所述第二线程生成至少一个对象对应的矢量纹理图像,所述矢量纹理图像用于指示所述至少一个对象分别对应的矢量纹理,所述矢量纹理用于以有向距离值来表征纹理;
通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,所述几何数据用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置,以及所述对象在所述电子地图中的渲染显示位置;
通过所述第二线程将所述矢量纹理图像和所述几何数据发送给所述第一线程;
通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象。
根据本申请实施例的一个方面,提供了一种电子地图中对象的渲染装置,所述装置中运行有第一线程和第二线程,所述第一线程用于渲染显示电子地图,所述第二线程用于在不干扰所述第一线程的情况下执行任务;所述装置包括:
纹理生成模块,用于通过所述第二线程生成至少一个对象对应的矢量纹理图像,所述矢量纹理图像用于指示所述至少一个对象分别对应的矢量纹理,所述矢量纹理用于以有向距离值来表征纹理;
数据生成模块,用于通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,所述几何数据用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置,以及所述对象在所述电子地图中的渲染显示位置;
数据发送模块,用于通过所述第二线程将所述矢量纹理图像和所述几何数据发送给所述第一线程;
对象渲染模块,用于通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象。
根据本申请实施例的一个方面,提供了一种终端设备,所述终端设备包括处理器和存储器,所述存储器中存储有计算机程序,所述计算机程序由所述处理器加载并执行以实现上述电子地图中对象的渲染方法。
根据本申请实施例的一个方面,提供了一种计算机可读存储介质,所述可读存储介质中存储有计算机程序,所述计算机程序由处理器加载并执行以实现上述电子地图中对象的渲染方法。
根据本申请实施例的一个方面,提供了一种计算机程序产品,该计算机程序产品包括计算机程序,该计算机程序存储在计算机可读存储介质中。终端设备的处理器从计算机可读存储介质读取该计算机程序,处理器执行该计算机程序,使得该终端设备执行上述电子地图中对象的渲染方法。
本申请实施例提供的技术方案可以包括如下有益效果。
通过基于矢量纹理图像进行电子地图中对象的渲染,渲染出的对象天然反锯齿、反失真,且于矢量纹理图像易于实现对象的描边效果,从而有利于提高电子地图中对象的渲染效果。同时,通过第二线程在不干扰第一线程渲染电子地图的情况下,执行矢量纹理图像和几何数据这些计算耗时较高的任务,相比于直接将这些任务放在第一线程中执行,有效避免了增加客户端的主线程运行开销。同时,由于这些任务可在客户端实现,而无需从服务器获取这些任务的执行结果,从而有效缩短了电子地图所在网页的首屏时间。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本申请一个实施例提供的方案实施环境的示意图;
图2是本申请一个实施例提供的电子地图中对象的渲染方法的流程图;
图3是本申请一个实施例提供的矢量纹理图像的获取方法的流程图;
图4是本申请一个实施例提供的地图文字的渲染方法的示意图;
图5是本申请一个实施例提供的电子地图的示意图;
图6是本申请一个实施例提供的电子地图中对象的渲染装置的框图;
图7是本申请另一个实施例提供的电子地图中对象的渲染装置的框图;
图8是本申请一个实施例提供的终端设备的框图。
具体实施方式
在对本申请实施例进行介绍说明之前,首先对本申请中涉及的相关名词进行解释说明。
1、SDF(Signed Distance Field,有向距离场)
其用于表征点距离物体表面的最小距离。本申请实施例中的SDF可用于表征对象(如文字)内的像素点距离对象边缘的最短距离,如将每个像素点所存储的颜色值换成该像素点距离对象轮廓的最短距离。
2、WebGL(Web Graphics Library)
其是一种JavaScript(Java语言脚本,以下可简称JS)应用程序接口,可用于在任何兼容的Web浏览器中渲染交互式2D和3D图形,而无需使用插件。
3、CesiumJS
其是一种开源JavaScript库,可用于创建具有最佳性能、精度、视觉质量和易用性的世界级3D地球仪和电子地图,其使用WebGL来进行硬件加速图形,被使用时不需要任何插件支持。
4、Web Worker(网络工作者)
其是Web端代码在浏览器主线程之外的worker线程中运行的一种应用程序接口,可用于在后台线程中运行JavaScript,也即Web Worker线程可以在不干扰用户界面的情况下执行任务。
5、Tile
其是指对地球表面(如电子3D地球仪)按网格切分成的一个一个格子。每个Tile近似为一个正方形的区域,实际上,每个Tile的4条边长度都不一样,因为Tile是按经纬度大小一样宽来切割的,但是纬度越高,相同经度表示的距离就越短。
为使本申请的目的、技术方案和优点更加清楚,下面将结合附图对本申请实施方式作进一步地详细描述。
请参考图1,其示出了本申请一个实施例提供的方案实施环境的示意图。该方案实施环境可以包括:终端设备10和服务器20。
上述终端设备10可以是诸如智能手机、平板电脑、笔记本电脑、台式计算机、智能音箱、智能手表、智能家电、多媒体播放设备、PC(Personal Computer,个人计算机)、智能机器人、车载终端、可穿戴设备等电子设备。终端设备10中可以安装目标应用程序的客户端,该目标应用程序可以是诸如浏览器类应用程序、地图类应用程序(如Web在线地图应用)、导航类应用程序、购物类应用程序、社交娱乐类应用程序、直播类应用程序,以及任何具有电子地图显示功能的应用程序,本申请实施例对此不作限定。
上述服务器20用于为终端设备10中的目标应用程序(如地图类应用程序)的客户端提供后台服务。例如,该服务器20可以是上述目标应用程序(如地图类应用程序)的后台服务器。上述服务器20可以是独立的物理服务器,也可以是多个物理服务器构成的服务器集群或者分布式系统,还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN(Content Delivery Network,内容分发网络)、以及大数据和人工智能平台等基础云计算服务的云服务器,本申请实施例对此不作限定。
在一个示例中,上述目标应用程序的客户端中运行有第一线程和第二线程,该第一线程用于渲染显示电子地图,该第二线程用于在不干扰第一线程的情况下执行任务。
上述第一线程可以是指客户端对应的主线程,其可以包括以下至少一种:JavaScript线程和UI(User Interface,用户界面)线程。其中,JavaScript线程用于执行目标应用程序对应JavaScript,以实现对应的功能,UI线程用于渲染显示用户界面,如用户界面中所需渲染显示的电子地图,以及电子地图中的对象。本申请实施例对电子地图中的对象不作限定,其可以是指文字、图像、线条、图形等。其中,电子地图可以是指利用计算机技术以数字方式存储和查阅的地图,其也可以被称之为数字地图。示例性地,电子地图可以是以地图数据库为基础,在适当尺寸的网页上显示的地图。本申请实施例电子地图的样式不作限定,如其可以以地球仪的形式展示,还可以以平铺的形式展示。
上述第二线程可用于在第一线程的后台执行任务,以避免对第一线程造成干扰,以及为第一线程分担计算量,以实现电子地图渲染的提速。第二线程可以在不干扰第一线程的情况下执行第一线程对应的部分JavaScript,以完成JavaScript对应的相关任务。
可选地,本申请实施例中的第二线程可以被实现为Web Worker线程。客户端可利用Web Worker技术,开启多Web Worker线程,该Web Worker线程即为第二线程。
示例性地,主线程可先使用new Worker()函数创建一个worker对象(即WebWorker线程),该函数接收一个JavaScript文件的URL(Uniform Resource Location,统一资源定位符)作为参数,该JavaScript文件就是Web Worker线程所需执行的脚本。主线程再使用postMessage()函数向worker对象发送待渲染的至少一个对象,从而使得该worker对象执行JavaScript文件,以完成对至少一个对象的处理。
主线程可使用onmessage()函数监测worker对象所返回的处理结果。在获取处理结果后,主线程可使用terminate()函数停止worker对象的执行。可选地,在有需求的情况下,主线程可以创建多个Web Worker线程,也可以从已创建的多个Web Worker线程中调用某一个Web Worker线程,本申请实施例对此不作限定。
示例性地,以地图文字渲染场景为例,浏览器主线程(即第一线程)在网页中渲染显示电子地图的过程中,接收到待渲染的地图文字,诸如道路名、限速牌、指向标等对应的文字。浏览器主线程调用Web Worker线程(即第二线程),并通过Web Worker线程得到地图文字对应的矢量纹理图像和几何数据,Web Worker线程将矢量纹理图像和几何数据返回给浏览器主线程,浏览器主线程根据矢量纹理图像和几何数据,在电子地图中渲染显示地图文字。
下面,将通过方法实施例对本申请提供的技术方案进行介绍说明。
请参考图2,其示出了本申请一个实施例提供的电子地图中对象的渲染方法的流程图,该方法各步骤的执行主体可以是图1所示方案实施环境中的终端设备10,如终端设备10中的客户端,该方法可以包括如下几个步骤(201~204)。
步骤201,通过第二线程生成至少一个对象对应的矢量纹理图像,该矢量纹理图像用于指示至少一个对象分别对应的矢量纹理,矢量纹理用于以有向距离值来表征纹理。
上述对象可以是指电子地图中待被渲染显示的对象,本申请实施例对该对象的类型不作限定,诸如文字、图像、符号、数字等。可选地,上述至少一个对象中的各个对象的类型相同。例如,上述至少一个对象可以是指某个文本中的多个文字,该多个文字按照在文本中的顺序被依次排序。
在一个示例中,该至少一个对象的获取过程可以如下:客户端通过第一线程获取至少一个对象,再通过第一线程调用第二线程,以及将至少一个对象发送给第二线程。
可选地,该至少一个对象可以是客户端对应的服务器根据电子地图的展示情况发送给客户端的,也可以是客户端根据电子地图的展示情况所获取的,本申请实施例对此不作限定。示例性地,响应于用户用于滑动电子地图、缩放电子地图、开启电子地图、切换电子地图等操作,客户端获取电子地图当前显示范围内的待需要渲染显示的至少一个对象,如响应于用户开启电子地图,客户端可将电子地图所需在当前网页中显示的地图文字确定为至少一个对象。又例如,响应于用户滑动电子地图,客户端可将滑动后的电子地图,相比于滑动前的电子地图所需要增加显示的至少一个地图文字确定为至少一个对象。该地图文字可以是指电子地图中所需显示的文字,诸如道路名、限速牌、指向标等对应的文字。可选地,电子地图中的对象可以是由采集人员通过采集设备采集得到的。例如,上述地图文字可以是由采集人员通过采集设备采集得到,并被存储在地图数据库中,在电子地图的渲染过程中,客户端可以从地图数据库调用地图文字。
可选地,上述至少一个对象可以是经过筛选后的对象,也即具有矢量纹理图像和几何数据的对象无需再次通过第二线程处理,第一线程可以直接调用该对象的矢量纹理图像和几何数据。
在一个示例中,该至少一个对象可以以区域为单位进行获取,如将电子地图划分成多个区域,针对每个区域获取一组对象,再分别对每个组对象进行处理,如此可以有效提高对象的处理效率,进而提高对象的渲染效率。
可选地,客户端可依次对每组对象进行处理。或者,客户端可调用多个第二线程同时对每组对象进行处理,从而进一步提高对象的渲染效率,本申请实施例对此不作限定。
可选地,第一线程可以重新创建一个第二线程,以将至少一个对象发送给该第二线程,也可以直接调用一个第二线程,以将至少一个对象发送给该第二线程,本申请实施例对此不作限定。第二线程在接收到至少一个对象后,在不干扰第一线程的情况下执行脚本,以生成至少一个对象对应的矢量纹理图像。本申请实施例中的第一线程和第二线程与上述实施例介绍相同,本申请实施例未说明的内容可参考上述实施例,这里不再赘述。
在一个可行示例中,对于至少一个对象,第一线程先确定需要生成的纹理图像的类型,若第一线程确定需要生成矢量纹理图像,则可调用第二线程生成至少一个对象对应的矢量纹理图像;若第一线程确定需要生成非矢量纹理图像(如计算量小于阈值的纹理图像),则可调用第二线程生成至少一个对象对应的矢量纹理图像,也可以自己生成至少一个对象对应的矢量纹理图像,本申请实施例对此不作限定。
上述矢量纹理图像可以由至少一个对象分别对应的矢量纹理拼接得到。矢量纹理可用于指示对象的纹理,该纹理可指示出对象的轮廓、形状、纹路、外观等。有向距离值是指具有方向的距离值,如对于对象对应的某个像素点,若其对应的有向距离值为正,则表明该像素点位于对象内部的某个位置;若其对应的有向距离值为0,则表明该像素点位于对象的轮廓上;若其对应的有向距离值为负,则表明该像素点位于对象外的某个位置。可选地,本申请实施例对有向距离值的获取方法不作限定,如其可以包括以下至少之一:欧式距离、曼哈顿距离、切比雪夫距离、余弦相似度。
在一个示例中,参考图3,步骤201还可以包括如下几个子步骤。
步骤201a,通过第二线程生成至少一个对象对应的有向距离场;其中,有向距离场用于以有向距离值来指示对象所包括的各个像素点。
本申请实施例中的有向距离场可用于表征对象(如文字)所包括的像素点距离对象边缘的最短距离,因此可通过第二线程对对象所包括的像素点与对象轮廓之间的距离进行遍历,以生成对象对应的有向距离场。
示例性地,有向距离场的获取过程可以包括如下内容。
1、对于至少一个对象中的每个对象,通过第二线程获取对象对应的像素点集,像素点集中的各个像素点属于对象。
可选地,该像素点集中包括两类像素点,一类为轮廓像素点,另一类为对象内像素点。其中,轮廓像素点是指位于对象轮廓上的像素点,如文字轮廓(包括内轮廓和外轮廓)上的像素点。对象内像素点是指位于对象内部的像素点,如位于文字轮廓之内的像素点。
2、对于像素点集中的各个像素点,通过第二线程获取像素点到对象的轮廓的最短距离。
可选地,该最短距离为有向距离值,对于轮廓像素点,由于其本身就在对象轮廓上,因此于轮廓像素点的最短距离为0。对于对象内像素点,可第二线程获取其与各个轮廓像素点之间的有向距离值,再将最小的有向距离值确定为该对象内像素点对应的最短距离。该最短距离可以为负或正,以表示其位于对象内。
3、通过第二线程根据各个像素点分别对应的最短距离,生成对象对应的有向距离场。
可选地,对于各个像素点,通过第二线程将像素点的颜色值切换为像素点对应的最短距离,生成对象对应的有向距离场,也即对象对应的各个像素点以最短距离来表征,而不是颜色值。
步骤201b,通过第二线程基于至少一个对象对应的有向距离场,生成矢量纹理图像。
可选地,第二线程还需将有向距离场映射为第一线程所能用于渲染的数据,如将各个像素点对应的最短距离映射为0-255之间的颜色值,以使得第一线程能够基于这些颜色值进行对象渲染。
示例性地,步骤201b还可以包括如下内容。
1、对于至少一个对象中的每个对象,通过第二线程将对象对应的有向距离场映射为灰度图像,该灰度图像在各个通道下的值相同。
该灰度图像可用于指示对象的矢量纹理。可选地,将有向距离场对应的各个最短距离映射为0-255之间的颜色值,并将像素点在各个通道下的值(如R值、G值和B值)均设置为该颜色值,即可得到灰度图像。
2、通过第二线程依次对至少一个对象对应的灰度图像进行拼接,得到矢量纹理图像。
3、通过第二线程对至少一个对象对应的灰度图像进行缓存。
可选地,通过第二线程将各个对象分别对应的灰度图像缓存至数据库中,在对下一批对象进行处理时,可以先对数据库进行遍历,以确定下一批对象中是否存在相同的对象,若存在,则可以将其从下一批对象中剔除,以避免对该对象进行重复处理,从而有效降低第二线程的计算量。同时,该被删除的对象的矢量纹理可直接从矢量纹理图像中获取,从而有利于提高对象的渲染效率。
可选地,下一批对象对应的矢量纹理可以依次被添加在上述矢量纹理图像中,也可以单独被生成一个矢量纹理图像,本申请实施例对此不作限定。
由于相比于普通的纹理图像,矢量纹理图像的计算更复杂,其需要占用大量计算资源,因此矢量纹理图像的获取非常耗时,如果直接通过第一线程来生成矢量纹理图像,会增加第一线程的计算压力,以及会阻塞第一线程执行原生JavaScript,影响到电子地图所在网页的首屏时间,因此本申请采用第二线程来获取矢量纹理图像,以确保第一线程的执行,从而达到不影响电子地图所在网页的首屏时间的同时,提高对象的渲染效果的目的。
在一个示例中,上述步骤201a之前,还可以包括如下内容:通过第二线程对至少一个对象进行去重,得到去重对象集,该去重对象集中不存在相同的对象,去重对象集用于获取矢量纹理图像。
本申请实施例中的去重可以是指对于相同的多个对象,仅保留其中一个对象的过程。在得到去重对象集之后,再通过第二线程对去重对象集中的各个对象进行处理,以生成至少一个对象对应的矢量纹理图像。在矢量纹理图像的后续使用过程中,对于相同的多个对象,均可采用被保留下的对象在量纹理图像中的矢量纹理。如此可以有效降低第二线程的计算量,进一步提高对象的渲染效率。
步骤202,通过第二线程基于矢量纹理图像,生成至少一个对象对应的几何数据,该几何数据用于指示对象对应的矢量纹理在矢量纹理图像中的位置,以及对象在电子地图中的渲染显示位置。
可选地,矢量纹理在矢量纹理图像中的位置可以以二维坐标表示,如该矢量纹理的中心在矢量纹理图像中的坐标。或者,矢量纹理在矢量纹理图像中的位置可以以二维坐标和尺寸来表示,如该矢量纹理的中心在矢量纹理图像中的坐标,以及该矢量纹理的长和宽,本申请实施例对此不作限定。
渲染显示位置用于指示对象将被渲染显示的位置。示例性地,该渲染显示位置可以是指对象的中心在电子地图中的坐标。例如,对于电子地图,地图文字的渲染显示位置可以基于地图文字的地理位置来确定,电子地图中对应的地理位置在电子地图中对应的坐标,即可为地图文字的渲染显示位置。
在一个示例中,对象对应的几何数据的获取过程可以包括如下内容。
1、对于至少一个对象中的每个对象,通过第二线程获取对象对应的第一位置信息,该第一位置信息用于指示对象在电子地图中的渲染显示位置。
可选地,将对象的中心在电子地图中的坐标确定为第一位置信息。
2、通过第二线程获取对象对应的第二位置信息,该第二位置信息用于指示对象对应的矢量纹理在矢量纹理图像中的位置。
可选地,将对象对应的矢量纹理的中心在矢量纹理图像中的坐标确定为第二位置信息。
3、通过第二线程基于第一位置信息和第二位置信息,以数据对的形式生成对象对应的几何数据。
可选地,以数据对的形式,对对象对应的第一位置信息和第二位置信息进行关联存储,以作为该对象对应的几何数据。
可选地,客户端还可通过第二线程基于矢量纹理图像,获取对象的矢量纹理在矢量纹理图像中所占的尺寸数据,以及通过第二线程获取对象的尺寸数据,客户端将这些尺寸数据与第一位置信息和第二位置信息进行关联存储,得到对象对应的几何数据,如此有利于对象的准确渲染。
步骤203,通过第二线程将矢量纹理图像和几何数据发送给第一线程。
可选地,第二线程在处理完成至少一个对象之后,将处理结果(即矢量纹理图像和几何数据)返回给第一线程,而第一线程会对第二线程进行监测,从而及时获取第二线程所返回的纹理图像。
可选地,第一线程在获取处理结果后,可停止第二线程的执行,以及将下一批对象发送给该第二线程执行。
步骤204,通过第一线程基于矢量纹理图像和几何数据,在电子地图中渲染显示至少一个对象。
在本申请实施例中,渲染任务由第一线程实现,计算比较耗时的计算任务可以由第二线程实现,如此可降低第一线程的执行压力,提高第一线程的性能。
可选地,在对象的渲染过程中,本申请实施例中的矢量纹理图像可用于确定对象的外观(如文字的着色或渲染),几何数据可用于确定对象的结构和位置(如文字的外观和位置)。
在一个示例中,步骤204还可以包括如下内容。
1、通过第一线程基于矢量纹理图像生成至少一个对象对应的纹理渲染素材。
可选地,对于各个对象,通过第一线程根据对象的几何数据(主要是第二位置信息),确定对象在纹理图像中对应的矢量纹理。通过第一线程以该矢量纹理为纹理生成对象对应的纹理渲染素材,该纹理渲染素材用于确定对象的外观。
2、通过第一线程基于几何数据,生成至少一个对象的几何实体。
可选地,对于各个对象,通过第一线程基于几何数据(主要是尺寸数据),构建对象的几何实体,该几何实体用于确定对象的结构。再通过第一线程基于几何数据(主要是第一位置信息),对各个对象分别对应的几何实体进行拼接,即可得到至少一个对象的几何实体。
3、通过第一线程对纹理渲染素材和几何实体进行结合,得到至少一个对象对应的最小渲染单元。
可选地,通过第一线程基于纹理渲染素材,对几何实体进行渲染(如填充、着色等),即可得到至少一个对象对应的最小渲染单元。
4、通过第一线程将最小渲染单元添加进电子地图,该电子地图刷新后渲染显示至少一个对象。
可选地,通过第一线程按基于几何数据(主要是第一位置信息),将最小渲染单元添加在电子地图中对应的位置,该电子地图刷新(如电子地图所在网页刷新)后即可渲染显示出该至少一个对象。
在一些可行示例中,矢量纹理图像和几何数据对集可由服务器来实现。例如,客户端通过第一线程生成数据获取请求,并将该数据获取请求发送至服务器,服务器在接收到数据获取请求之后,开启线程生成至少一个对象对应的矢量纹理图像和几何数据,然后将该至少一个对象对应的矢量纹理图像和几何数据发送给客户端,客户端的第一线程根据该至少一个对象对应的矢量纹理图像和几何数据,在电子地图中渲染显示至少一个对象。如此可有效降低客户端的运行压力。
综上所述,本申请实施例提供的技术方案,通过基于矢量纹理图像进行电子地图中对象的渲染,渲染出的对象天然反锯齿、反失真,且于矢量纹理图像易于实现对象的描边效果,从而有利于提高电子地图中对象的渲染效果。同时,通过第二线程在不干扰第一线程渲染电子地图的情况下,执行矢量纹理图像和几何数据这些计算耗时较高的任务,相比于直接将这些任务放在第一线程中执行,有效避免了增加客户端的主线程运行开销。同时,由于这些任务可在客户端实现,而无需从服务器获取这些任务的执行结果,从而有效缩短了电子地图所在网页的首屏时间。
另外,通过先对至少一个对象进行去重,再进行矢量纹理图像和几何数据的获取,可有效降低第二线程的计算量,进而提高对象的渲染效率。同时,对对象的灰度图像(即矢量纹理)进行缓存,可避免后续对该对象进行重复处理,进一步降低了第二线程的计算量,进而提高了对象的渲染效率。
在一些实施例中,参考图4,以上述对象为电子地图中所需渲染显示的地图文字为例,对本申请实施例提供的技术方案进行说明,该过程可以包括如下内容。
浏览器(即客户端)进行地图文字标记渲染的过程可以包括两个部分:浏览器的Web Worker线程(对应上述第二线程)执行的部分和浏览器主线程(对应上述第一线程)执行的部分。
浏览器的Web Worker线程执行的部分可以包括如下内容。
步骤W1,Web Worker线程401获取当前Tile(网格)中要渲染的地图文字。
例如,以道路名为例,浏览器的主线程402获取当前Tile中所有道路分别对应的道路名,并从各个道路名中提取出地图文字。主线程402再将地图文字发送给Web Worker线程401。该当前Tile可以是指终端设备中当前所显示的电子地图对应的Tile。
步骤W2,Web Worker线程401对地图文字进行去重,得到去重文字集合,该去重文字集合中不存在相同的地图文字。
例如,Web Worker线程401对所有待渲染显示的地图文字,按照单文字粒度进行去重,从而得到去重文字集合,如此避免地图文字的重复计算。
步骤W3,Web Worker线程401逐个生成去重文字集合中各个地图文字的SDF。
例如,对于某个地图文字,先获取该地图文字对应的各个像素点的SDF,再将各个像素点的SDF确定为各个像素点的颜色值,从而得到该地图文字的SDF。
步骤W4,Web Worker线程401基于SDF生成矢量纹理图像。
例如,对于某个地图文字中的各个像素点,Web Worker线程401将像素点的SDF映射到0-255之间的颜色值,并将各个像素点的R值、G值和B值都赋值该颜色值,从而得到该地图文字的矢量纹理(即灰度图像),Web Worker线程401将每个地图文字的矢量纹理逐个进行拼接,合成该当亲Tile最终要使用的矢量纹理图像。可选地,Web Worker线程401同时记录下每个地图文字的矢量纹理在该矢量纹理图像中的第二位置信息,以及记录每个地图文字的大小和每个地图文字对应的矢量纹理的大小。
步骤W5,Web Worker线程401对该当前Tile中的各个地图文字的矢量纹理进行缓存。
可选地,当再次有Tile含有相同的地图文字时,可避免了重复获取矢量纹理的过程。
步骤W6,Web Worker线程401根据地图文字在电子地图选中所处的地理位置,以及第二位置信息,生成该地图文字对应的几何数据。
可选地,Web Worker线程401还将每个地图文字的大小和每个地图文字对应的矢量纹理的大小,与该几何数据进行关联存储。
Web Worker线程401在生成地图文字的矢量纹理图像和几何数据之后,将矢量纹理图像和几何数据返回给主线程402。
主线程402在拿到矢量纹理图像和几何数据之后,其对应的执行过程可以包括如下内容。
步骤M1,主线程402基于矢量纹理图像生成地图文字的纹理渲染素材。
例如,若以CesiumJS为例,则是创建appearance类(对应纹理渲染素材),以及将该appearance类中material属性的fabric设置为矢量纹理图像。
可选地,还可以利用Three(是一个基于WebGL的JavaScript的3D库)来实现地图文字的渲染,本申请实施例对此不作限定。
步骤M2,主线程402基于几何数据和纹理渲染素材生成最小渲染单元。
例如,以CesiumJS为例,将当前Tile中要渲染的地图文字对应的几何数据,生成geometryinstance类(对应集合实体),再将其与步骤M1中的appearance类相结合,即可生成CesiumJS的最小渲染单元primitive。
步骤M3,主线程402将最小渲染单元渲染到当前场景(即电子地图)。
例如,以CesiumJS为例,将步骤M2中生成的最小渲染单元primitive加入scene类中,浏览器刷新后就可以把当前Tile中所有的地图文字渲染出来。
示例性地,参考图5,该用户界面中显示有电子地图的第一部分,对于Tile 501,其需要被渲染显示的地图文字有“Xx道路限速60”,浏览器通过Web Worker401生成这些地图文字对应的矢量纹理图像和几何数据,浏览器通过主线程402根据这些地图文字对应的矢量纹理图像和几何数据,在电子地图中渲染显示这些地图文字。
SDF计算、纹理矢量生成和几何数据生成这些耗时的操作都在Web Worker401线程中被执行,而主线程402并不受影响,从而使得用户拖动电子地图时不会有任何卡顿。
综上所述,本申请实施例提供的技术方案,通过基于矢量纹理图像进行地图文字的渲染,有利于提高地图文字的渲染渲染效果。同时,通过Web Worker在不干扰主线程渲染电子地图的情况下,执行矢量纹理图像和几何数据这些计算耗时较高的任务,相比于直接将这些任务放在主线程中执行,有效避免了对主线程造成影响。同时,由于这些任务可在客户端实现,而无需从服务器获取这些任务的执行结果,从而有效缩短了电子地图所在网页的首屏时间。
下述为本申请装置实施例,可以用于执行本申请方法实施例。对于本申请装置实施例中未披露的细节,请参照本申请方法实施例。
参考图6,其示出了本申请一个实施例提供的电子地图中对象的渲染装置的框图。该装置具有实现上述方法示例的功能,所述功能可以由硬件实现,也可以由硬件执行相应的软件实现。该装置可以是上文介绍的终端设备,也可以设置在终端设备中。装置中运行有第一线程和第二线程,第一线程用于渲染显示电子地图,第二线程用于在不干扰第一线程的情况下执行任务。如图6所示,该装置600包括:纹理生成模块601、数据生成模块602、数据发送模块603和对象渲染模块604。
纹理生成模块601,用于通过所述第二线程生成至少一个对象对应的矢量纹理图像,所述矢量纹理图像用于指示所述至少一个对象分别对应的矢量纹理,所述矢量纹理用于以有向距离值来表征纹理。
数据生成模块602,用于通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,所述几何数据用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置,以及所述对象在所述电子地图中的渲染显示位置。
数据发送模块603,用于通过所述第二线程将所述矢量纹理图像和所述几何数据发送给所述第一线程。
对象渲染模块604,用于通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象。
在一些实施例中,如图7所示,所述纹理生成模块601还包括:距离场生成子模块601a和纹理生成子模块601b。
距离场生成子模块601a,用于通过所述第二线程生成所述至少一个对象对应的有向距离场;其中,所述有向距离场用于以有向距离值来指示所述对象所包括的各个像素点。
纹理生成子模块601b,用于通过所述第二线程基于所述至少一个对象对应的有向距离场,生成所述矢量纹理图像。
在一些实施例中,所述距离场生成子模块601a,用于:
对于所述至少一个对象中的每个对象,通过所述第二线程获取所述对象对应的像素点集,所述像素点集中的各个像素点属于所述对象;
对于所述像素点集中的各个像素点,通过所述第二线程获取所述像素点到所述对象的轮廓的最短距离;
通过所述第二线程根据所述各个像素点分别对应的最短距离,生成所述对象对应的有向距离场。
在一些实施例中,所述距离场生成子模块601a,还用于对于各个所述像素点,通过所述第二线程将所述像素点的颜色值切换为所述像素点对应的最短距离,生成所述对象对应的有向距离场。
在一些实施例中,所述纹理生成子模块601b,用于:
对于所述至少一个对象中的每个对象,通过所述第二线程将所述对象对应的有向距离场映射为灰度图像,所述灰度图像在各个通道下的值相同;
通过所述第二线程依次对所述至少一个对象对应的灰度图像进行拼接,得到所述矢量纹理图像;
通过所述第二线程对所述至少一个对象对应的灰度图像进行缓存。
在一些实施例中,所述数据生成模块602,用于:
对于所述至少一个对象中的每个对象,通过所述第二线程获取所述对象对应的第一位置信息,所述第一位置信息用于指示所述对象在所述电子地图中的渲染显示位置;
通过所述第二线程获取所述对象对应的第二位置信息,所述第二位置信息用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置;
通过所述第二线程基于所述第一位置信息和所述第二位置信息,以数据对的形式生成所述对象对应的几何数据。
在一些实施例中,如图7所示,所述装置600还包括:对象去重模块605。
对象去重模块605,用于通过所述第二线程对所述至少一个对象进行去重,得到去重对象集,所述去重对象集中不存在相同的对象,所述去重对象集用于获取所述矢量纹理图像。
在一些实施例中,所述对象渲染模块604,用于:
通过所述第一线程基于所述矢量纹理图像生成所述至少一个对象对应的纹理渲染素材;
通过所述第一线程基于所述几何数据,生成所述至少一个对象的几何实体;
通过所述第一线程对所述纹理渲染素材和所述几何实体进行结合,得到所述至少一个对象对应的最小渲染单元;
通过所述第一线程将所述最小渲染单元添加进所述电子地图,所述电子地图刷新后渲染显示所述至少一个对象。
在一些实施例中,如图7所示,所述装置600还包括:对象获取模块606和线程调用模块607。
对象获取模块606,用于通过所述第一线程获取所述至少一个对象。
线程调用模块607,用于通过所述第一线程调用所述第二线程,以及将所述至少一个对象发送给所述第二线程。
综上所述,本申请实施例提供的技术方案,通过基于矢量纹理图像进行电子地图中对象的渲染,渲染出的对象天然反锯齿、反失真,且于矢量纹理图像易于实现对象的描边效果,从而有利于提高电子地图中对象的渲染效果。同时,通过第二线程在不干扰第一线程渲染电子地图的情况下,执行矢量纹理图像和几何数据这些计算耗时较高的任务,相比于直接将这些任务放在第一线程中执行,有效避免了增加客户端的主线程运行开销。同时,由于这些任务可在客户端实现,而无需从服务器获取这些任务的执行结果,从而有效缩短了电子地图所在网页的首屏时间。
需要说明的是,上述实施例提供的装置,在实现其功能时,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将设备的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。另外,上述实施例提供的装置与方法实施例属于同一构思,其具体实现过程详见方法实施例,这里不再赘述。
请参考图8,其示出了本申请一个实施例提供的终端设备的结构框图。该终端设备可以是上文介绍的终端设备,该终端设备800可用于实施上述电子地图中对象的渲染方法,具体来讲。
通常,终端设备800包括有:处理器801和存储器802。
可选地,处理器801可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器801可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(FieldProgrammable Gate Array,现场可编程门阵列)、PLA(Programmable Logic Array,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器801也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central ProcessingUnit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中,处理器801可以在集成有GPU(Graphics Processing Unit,图像处理器),GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中,处理器801还可以包括AI(Artificial Intelligence,人工智能)处理器,该AI处理器用于处理有关机器学习的计算操作。
可选地,存储器802可以包括一个或多个计算机可读存储介质,该计算机可读存储介质可以是非暂态的。存储器802还可包括高速随机存取存储器,以及非易失性存储器,比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中,存储器802中的非暂态的计算机可读存储介质用于存储计算机程序,所述计算机程序,且经配置以由一个或者一个以上处理器执行,以实现上述电子地图中对象的渲染方法。
在一些实施例中,终端设备800还可选包括有:外围设备接口803和至少一个外围设备。处理器801、存储器802和外围设备接口803之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口803相连。具体地,外围设备包括:射频电路804、显示屏805、音频电路806和电源807中的至少一种。
本领域技术人员可以理解,图8中示出的结构并不构成对终端设备800的限定,可以包括比图示更多或更少的组件,或者组合某些组件,或者采用不同的组件布置。
在一些实施例中,还提供了一种计算机可读存储介质,所述存储介质中存储有计算机程序,所述计算机程序在被终端设备的处理器执行时以实现上述电子地图中对象的渲染方法。
可选地,该计算机可读存储介质可以包括:ROM( Read-Only Memory,只读存储器)、RAM(Random-Access Memory,随机存储器)、SSD(Solid State Drives,固态硬盘)或光盘等。其中,随机存取记忆体可以包括ReRAM(Resistance Random Access Memory,电阻式随机存取记忆体)和DRAM(Dynamic Random Access Memory,动态随机存取存储器)。
在一些实施例中,还提供了一种计算机程序产品,所述计算机程序产品包括计算机程序,所述计算机程序存储在计算机可读存储介质中。终端设备的处理器从所述计算机可读存储介质中读取所述计算机程序,所述处理器执行所述计算机程序,使得所述终端设备执行上述电子地图中对象的渲染方法。
需要说明的是,本申请实施例在收集用户的相关数据之前以及在收集用户的相关数据的过程中,都可以显示提示界面、弹窗或输出语音提示信息,该提示界面、弹窗或语音提示信息用于提示用户当前正在搜集其相关数据,使得本申请仅仅在获取到用户对该提示界面或者弹窗发出的确认操作后,才开始执行获取用户相关数据的相关步骤,否则(即未获取到用户对该提示界面或者弹窗发出的确认操作时),结束获取用户相关数据的相关步骤,即不获取用户的相关数据。换句话说,本申请所采集的所有用户数据,处理严格根据相关国家法律法规的要求,获取个人信息主体的知情同意或单独同意都是在用户同意并授权的情况下进行采集的,并在法律法规及个人信息主体的授权范围内,开展后续数据使用及处理行为且相关用户数据的收集、使用和处理需要遵守相关国家和地区的相关法律法规和标准。例如,本申请中涉及到的矢量纹理图像、几何数据、地图文字、对象等都是在充分授权的情况下获取的。
应当理解的是,在本文中提及的“多个”是指两个或两个以上。“和/或”,描述关联对象的关联关系,表示可以存在三种关系,例如,A和/或B,可以表示:单独存在A,同时存在A和B,单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。另外,本文中描述的步骤编号,仅示例性示出了步骤间的一种可能的执行先后顺序,在一些其它实施例中,上述步骤也可以不按照编号顺序来执行,如两个不同编号的步骤同时执行,或者两个不同编号的步骤按照与图示相反的顺序执行,本申请实施例对此不作限定。
以上所述仅为本申请的示例性实施例,并不用以限制本申请,凡在本申请的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本申请的保护范围之内。
Claims (9)
1.一种电子地图中对象的渲染方法,其特征在于,所述方法由客户端执行,所述客户端中运行有第一线程和第二线程,所述第一线程用于渲染显示电子地图,所述第二线程用于在不干扰所述第一线程的情况下执行任务;所述方法包括:
对于至少一个对象中的每个对象,通过所述第二线程获取所述对象对应的像素点集,所述像素点集中的各个像素点属于所述对象,所述对象包括以下至少之一:文字、图像、符号、数字;
对于所述像素点集中的各个像素点,通过所述第二线程获取所述像素点到所述对象的轮廓的最短距离;
对于各个所述像素点,通过所述第二线程将所述像素点的颜色值切换为所述像素点对应的最短距离,生成所述对象对应的有向距离场;其中,所述有向距离场用于以有向距离值来指示所述对象所包括的各个像素点;
通过所述第二线程将所述对象对应的有向距离场映射为灰度图像,所述灰度图像在各个通道下的值相同;
通过所述第二线程依次对所述至少一个对象对应的灰度图像进行拼接,得到矢量纹理图像,所述矢量纹理图像用于指示所述至少一个对象分别对应的矢量纹理,所述矢量纹理用于以有向距离值来表征纹理;
通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,所述几何数据用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置,以及所述对象在所述电子地图中的渲染显示位置;
通过所述第二线程将所述矢量纹理图像和所述几何数据发送给所述第一线程;
通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象。
2.根据权利要求1所述的方法,其特征在于,所述通过所述第二线程将所述对象对应的有向距离场映射为灰度图像之后,还包括:
通过所述第二线程对所述至少一个对象对应的灰度图像进行缓存。
3.根据权利要求1所述的方法,其特征在于,所述通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,包括:
对于所述至少一个对象中的每个对象,通过所述第二线程获取所述对象对应的第一位置信息,所述第一位置信息用于指示所述对象在所述电子地图中的渲染显示位置;
通过所述第二线程获取所述对象对应的第二位置信息,所述第二位置信息用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置;
通过所述第二线程基于所述第一位置信息和所述第二位置信息,以数据对的形式生成所述对象对应的几何数据。
4.根据权利要求1所述的方法,其特征在于,所述通过所述第二线程获取所述对象对应的像素点集之前,还包括:
通过所述第二线程对所述至少一个对象进行去重,得到去重对象集,所述去重对象集中不存在相同的对象,所述去重对象集用于获取所述矢量纹理图像。
5.根据权利要求1所述的方法,其特征在于,所述通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象,包括:
通过所述第一线程基于所述矢量纹理图像生成所述至少一个对象对应的纹理渲染素材;
通过所述第一线程基于所述几何数据,生成所述至少一个对象的几何实体;
通过所述第一线程对所述纹理渲染素材和所述几何实体进行结合,得到所述至少一个对象对应的最小渲染单元;
通过所述第一线程将所述最小渲染单元添加进所述电子地图,所述电子地图刷新后渲染显示所述至少一个对象。
6.根据权利要求1所述的方法,其特征在于,所述通过所述第二线程获取所述对象对应的像素点集之前,还包括:
通过所述第一线程获取所述至少一个对象;
通过所述第一线程调用所述第二线程,以及将所述至少一个对象发送给所述第二线程。
7.一种电子地图中对象的渲染装置,其特征在于,所述装置中运行有第一线程和第二线程,所述第一线程用于渲染显示电子地图,所述第二线程用于在不干扰所述第一线程的情况下执行任务;所述装置包括:
纹理生成模块,用于对于至少一个对象中的每个对象,通过所述第二线程获取所述对象对应的像素点集,所述像素点集中的各个像素点属于所述对象,所述对象包括以下至少之一:文字、图像、符号、数字;对于所述像素点集中的各个像素点,通过所述第二线程获取所述像素点到所述对象的轮廓的最短距离;对于各个所述像素点,通过所述第二线程将所述像素点的颜色值切换为所述像素点对应的最短距离,生成所述对象对应的有向距离场;其中,所述有向距离场用于以有向距离值来指示所述对象所包括的各个像素点;通过所述第二线程将所述对象对应的有向距离场映射为灰度图像,所述灰度图像在各个通道下的值相同;通过所述第二线程依次对所述至少一个对象对应的灰度图像进行拼接,得到矢量纹理图像,所述矢量纹理用于以有向距离值来表征纹理;
数据生成模块,用于通过所述第二线程基于所述矢量纹理图像,生成所述至少一个对象对应的几何数据,所述几何数据用于指示所述对象对应的矢量纹理在所述矢量纹理图像中的位置,以及所述对象在所述电子地图中的渲染显示位置;
数据发送模块,用于通过所述第二线程将所述矢量纹理图像和所述几何数据发送给所述第一线程;
对象渲染模块,用于通过所述第一线程基于所述矢量纹理图像和所述几何数据,在所述电子地图中渲染显示所述至少一个对象。
8.一种计算机设备,其特征在于,所述计算机设备包括处理器和存储器,所述存储器中存储有计算机程序,所述计算机程序由所述处理器加载并执行以实现如权利要求1至6任一项所述的电子地图中对象的渲染方法。
9.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有计算机程序,所述计算机程序由处理器加载并执行以实现如权利要求1至6任一项所述的电子地图中对象的渲染方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202311357485.5A CN117112950B (zh) | 2023-10-19 | 2023-10-19 | 电子地图中对象的渲染方法、装置、终端及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202311357485.5A CN117112950B (zh) | 2023-10-19 | 2023-10-19 | 电子地图中对象的渲染方法、装置、终端及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN117112950A CN117112950A (zh) | 2023-11-24 |
CN117112950B true CN117112950B (zh) | 2024-02-02 |
Family
ID=88795006
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202311357485.5A Active CN117112950B (zh) | 2023-10-19 | 2023-10-19 | 电子地图中对象的渲染方法、装置、终端及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN117112950B (zh) |
Citations (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105740256A (zh) * | 2014-12-09 | 2016-07-06 | 高德信息技术有限公司 | 一种三维地图的生成方法及装置 |
CN111080766A (zh) * | 2019-12-30 | 2020-04-28 | 中科星图股份有限公司 | 一种基于WebGL的GPU加速海量目标高效渲染方法 |
CN113457160A (zh) * | 2021-07-15 | 2021-10-01 | 腾讯科技(深圳)有限公司 | 数据处理方法、装置、电子设备及计算机可读存储介质 |
CN114283247A (zh) * | 2020-09-18 | 2022-04-05 | 阿里巴巴集团控股有限公司 | 渲染方法、装置和云服务 |
CN115357361A (zh) * | 2022-08-30 | 2022-11-18 | 北京字跳网络技术有限公司 | 一种任务处理方法、装置、设备及介质 |
CN116306494A (zh) * | 2022-12-27 | 2023-06-23 | 广州市网星信息技术有限公司 | 一种文字渲染方法、装置、设备、存储介质及产品 |
CN116433816A (zh) * | 2023-03-19 | 2023-07-14 | 武汉光庭信息技术股份有限公司 | 一种提高web端canvas绘制性能的方法及装置 |
CN116797701A (zh) * | 2023-05-23 | 2023-09-22 | 网易(杭州)网络有限公司 | 扩散效果渲染方法、装置、存储介质及电子设备 |
Family Cites Families (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20170155890A1 (en) * | 2015-12-01 | 2017-06-01 | Le Holdings (Beijing) Co., Ltd. | Method and device for stereoscopic image display processing |
US10402937B2 (en) * | 2017-12-28 | 2019-09-03 | Nvidia Corporation | Multi-GPU frame rendering |
-
2023
- 2023-10-19 CN CN202311357485.5A patent/CN117112950B/zh active Active
Patent Citations (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105740256A (zh) * | 2014-12-09 | 2016-07-06 | 高德信息技术有限公司 | 一种三维地图的生成方法及装置 |
CN111080766A (zh) * | 2019-12-30 | 2020-04-28 | 中科星图股份有限公司 | 一种基于WebGL的GPU加速海量目标高效渲染方法 |
CN114283247A (zh) * | 2020-09-18 | 2022-04-05 | 阿里巴巴集团控股有限公司 | 渲染方法、装置和云服务 |
CN113457160A (zh) * | 2021-07-15 | 2021-10-01 | 腾讯科技(深圳)有限公司 | 数据处理方法、装置、电子设备及计算机可读存储介质 |
CN115357361A (zh) * | 2022-08-30 | 2022-11-18 | 北京字跳网络技术有限公司 | 一种任务处理方法、装置、设备及介质 |
CN116306494A (zh) * | 2022-12-27 | 2023-06-23 | 广州市网星信息技术有限公司 | 一种文字渲染方法、装置、设备、存储介质及产品 |
CN116433816A (zh) * | 2023-03-19 | 2023-07-14 | 武汉光庭信息技术股份有限公司 | 一种提高web端canvas绘制性能的方法及装置 |
CN116797701A (zh) * | 2023-05-23 | 2023-09-22 | 网易(杭州)网络有限公司 | 扩散效果渲染方法、装置、存储介质及电子设备 |
Non-Patent Citations (1)
Title |
---|
基于OpenGL的二维矢量地图可视化技术研究;柳佳佳;栾晓岩;边淑莉;;测绘科学(第05期);第88-90/93页 * |
Also Published As
Publication number | Publication date |
---|---|
CN117112950A (zh) | 2023-11-24 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US11344806B2 (en) | Method for rendering game, and method, apparatus and device for generating game resource file | |
WO2022116759A1 (zh) | 图像渲染方法、装置、计算机设备和存储介质 | |
KR102663617B1 (ko) | 증강 현실 객체의 조건부 수정 | |
CN110211218B (zh) | 画面渲染方法和装置、存储介质及电子装置 | |
US11727632B2 (en) | Shader binding management in ray tracing | |
KR20200035491A (ko) | 지도 인터페이스들의 지연시간 단축 | |
JP2023029984A (ja) | 仮想イメージを生成するための方法、装置、電子機器及び可読記憶媒体 | |
CN114564630B (zh) | 一种图数据Web3D可视化的方法、系统和介质 | |
CN105144243A (zh) | 数据可视化 | |
CN114742931A (zh) | 渲染图像的方法、装置、电子设备及存储介质 | |
CN111583379A (zh) | 虚拟模型的渲染方法、装置、存储介质与电子设备 | |
CN114782612A (zh) | 图像渲染方法、装置、电子设备及存储介质 | |
CN113495933A (zh) | 一种矢量瓦片显示方法及系统 | |
CN115496845A (zh) | 图像渲染方法、装置、电子设备及存储介质 | |
CN114842120A (zh) | 一种图像渲染处理方法、装置、设备及介质 | |
CN113610958A (zh) | 一种基于风格迁移的3d图像构建方法、装置及终端 | |
CN105511890B (zh) | 一种图形界面更新方法和装置 | |
WO2023197762A1 (zh) | 图像渲染方法、装置、电子设备、计算机可读存储介质及计算机程序产品 | |
CN113282214A (zh) | 笔画渲染方法、装置、存储介质以及终端 | |
CN110069254B (zh) | 文本显示方法、装置及服务器 | |
CN113010582A (zh) | 数据处理方法、装置、计算机可读介质及电子设备 | |
CN115330925A (zh) | 图像渲染方法、装置、电子设备及存储介质 | |
CN114820878B (zh) | 图像编辑方法及设备 | |
CN117112950B (zh) | 电子地图中对象的渲染方法、装置、终端及存储介质 | |
CN118736086A (zh) | 一种渲染方法及相应装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |