Icon rendering method, device, equipment, computer readable medium and program product
By determining the zoom level and traversing the icon object set during map zooming, the complexity and lag issues of map icon rendering logic are resolved, resulting in smooth and clear icon display and improved user experience.
Patent Information
- Application Number
- CN202610756972.6
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2026-05-28
- Publication Date
- 2026-08-25
AI Technical Summary
Existing technologies suffer from problems such as complex logic, high performance overhead, lag during switching, and poor user experience when rendering icons on maps.
The zoom level is determined by responding to map zoom processing. The initialized icon object set is traversed, and the icon is rendered according to the map position and updated icon under the zoom level, avoiding icon confusion and lag caused by not distinguishing the zoom level.
It achieves smooth and clear icon rendering during map zooming, simplifies the logic, avoids lag during switching, and improves the user experience.
Smart Images
Figure CN122636792A_ABST
Abstract
Description
Technical Field
[0001] Embodiments of this disclosure relate to the field of computer technology, and more specifically to icon rendering methods, apparatus, devices, computer-readable media, and program products. Background Technology
[0002] Currently, with the continuous development of technology, various industries (such as logistics) frequently use maps as a basic service. When using maps as a basic service, it is often necessary to dynamically render custom icons. For the rendering of icons on the map, JavaScript is typically used to control the icon's opacity property to switch between showing and hiding, or vice versa. However, this method suffers from problems such as complex logic, significant performance overhead, lag during switching, and a poor user experience. Summary of the Invention
[0003] The summary portion of this disclosure is intended to provide a brief overview of the concepts, which will be described in detail in the detailed description portion. This summary portion is not intended to identify key or essential features of the claimed technical solutions, nor is it intended to limit the scope of the claimed technical solutions.
[0004] Some embodiments of this disclosure provide icon rendering methods, apparatuses, devices, computer-readable media, and program products to address the technical problems mentioned in the background section above.
[0005] In a first aspect, some embodiments of this disclosure provide an icon rendering method, including: in response to detecting map zooming processing performed in a target display area, determining a zoom level; determining whether the map at the zoom level should render a target icon; in response to determining rendering, traversing the initialized set of icon objects to see if there is a target icon object to be displayed, wherein the target icon object includes: the map position and update icon at the zoom level; in response to determining existence, rendering each target icon object on the map at the zoom level according to the map position and update icon corresponding to each target icon object.
[0006] Optionally, determining whether the map renders the target icon at the zoom level includes: determining whether the zoom level is within a predetermined zoom range; and in response to being within a predetermined zoom range, determining whether the map displays the target icon at the zoom level.
[0007] Optionally, before determining the zoom level in response to detecting map zooming in the target display area, the method further includes: loading a map component to perform map initialization processing; and after loading the map component to perform map initialization processing, the method further includes: sending an icon data request to a server to obtain icon data for each icon, wherein the icon data includes: latitude and longitude corresponding to each icon; for each of the icons, performing the following generation steps: converting the latitude and longitude corresponding to the icon into a pixel position in the pixel coordinate system corresponding to the zoom level, as the target pixel position; constructing an icon object corresponding to the icon based on the target pixel position; and determining the obtained set of icon objects as the initialized set of icon objects.
[0008] Optionally, the above icon data also includes: icon materials corresponding to each icon; and the above-mentioned construction of the icon object corresponding to the above icon based on the above-mentioned target pixel position includes: obtaining the icon size and / or icon resolution based on the icon material corresponding to the above icon and the above-mentioned scaling level; creating an initial icon object based on the above-mentioned icon size and / or icon resolution; and replacing the pixel position corresponding to the above-mentioned initial icon object with the above-mentioned target pixel position to obtain the icon object.
[0009] Optionally, before determining the zoom level in response to detecting map zooming in the target display area, the method further includes: obtaining map query information; generating a query intent corresponding to the map query information; determining whether to perform map zooming in the target display area based on the query intent; and determining the zoom level includes: determining the zoom level based on the query intent.
[0010] Optionally, determining whether the map renders the target icon at the zoom level includes: generating at least one query object based on the query intent; and determining whether the map renders the target icon at the zoom level in response to determining that the icon object corresponding to the target icon is within the at least one query object.
[0011] Optionally, the above method further includes: in response to receiving map re-query information for the target display area, determining query association information between the map re-query information and the map query information; in response to the query association information indicating the existence of a query semantic association, generating icon rendering change information based on the query association information; and adjusting the icon rendering of the map corresponding to each query object based on the icon rendering change information.
[0012] Optionally, after responding to the detection of map zooming processing in the target display area and determining the zoom level, the method further includes: loading a map at the precision corresponding to the zoom level, wherein the map corresponding to the zoom level has a corresponding number of map tiles, and each map tile has a corresponding number.
[0013] Secondly, some embodiments of this disclosure provide an icon rendering apparatus, including: a first determining unit configured to determine a scaling level in response to detecting map scaling processing performed in a target display area; a second determining unit configured to determine whether the map at the scaling level renders a target icon; a traversal unit configured to traverse the initialized icon object set to determine whether a target icon object exists for display in response to determining rendering, wherein the target icon object includes: the map position and update icon at the scaling level; and a rendering unit configured to render each target icon object at the scaling level based on the map position and update icon corresponding to each target icon object in response to determining existence.
[0014] Optionally, the second determining unit can be configured to: determine whether the above zoom level is within a predetermined zoom range; and in response to being within the zoom level, determine the map display target icon at the above zoom level.
[0015] Optionally, the apparatus further includes: loading a map component to perform map initialization processing. The apparatus also includes: sending an icon data request to a server to obtain icon data for each icon, wherein the icon data includes: latitude and longitude corresponding to each icon; for each of the icons, performing the following generation steps: converting the latitude and longitude corresponding to the icon into a pixel position in the pixel coordinate system corresponding to the zoom level, as the target pixel position; constructing an icon object corresponding to the icon based on the target pixel position; and determining the resulting set of icon objects as the initialized set of icon objects.
[0016] Optionally, the aforementioned icon data further includes: icon materials corresponding to each icon; and the device further includes: obtaining icon size and / or icon resolution based on the icon materials corresponding to the icons and the aforementioned scaling level; creating an initial icon object based on the aforementioned icon size and / or icon resolution; and replacing the pixel position corresponding to the aforementioned initial icon object with the aforementioned target pixel position to obtain the icon object.
[0017] Optionally, the apparatus further includes: acquiring map query information; generating a query intent corresponding to the map query information; determining whether to perform map zooming processing in the target display area based on the query intent; and the first determining unit can be configured to: determine the zoom level based on the query intent.
[0018] Optionally, the second determining unit can be configured to: generate at least one query object based on the above query intent; and determine the map rendering target icon at the above zoom level in response to determining that the icon object corresponding to the target icon is within the above at least one query object.
[0019] Optionally, the apparatus further includes: in response to receiving map re-query information for the target display area, determining query association information between the map re-query information and the map query information; in response to the query association information indicating the existence of a query semantic association, generating icon rendering change information based on the query association information; and adjusting the icon rendering of the map corresponding to each query object based on the icon rendering change information.
[0020] Optionally, the device further includes: loading a map at the precision corresponding to the above zoom level, wherein the map corresponding to the above zoom level has a corresponding number of map tiles, and each map tile has a corresponding number.
[0021] Thirdly, some embodiments of this disclosure provide an electronic device, including: one or more processors; and a storage device having one or more programs stored thereon, such that when the one or more programs are executed by the one or more processors, the one or more processors implement the method as described in any implementation of the first aspect.
[0022] Fourthly, some embodiments of this disclosure provide a computer-readable medium having a computer program stored thereon, wherein the program, when executed by a processor, implements the method as described in any implementation of the first aspect.
[0023] Fifthly, some embodiments of this disclosure provide a computer program product, including a computer program that, when executed by a processor, implements the method described in any of the implementations of the first aspect above.
[0024] The above embodiments of this disclosure have the following beneficial effects: Through the icon rendering methods of some embodiments of this disclosure, when the displayed map undergoes zooming, the icons on the map are rendered smoothly and clearly. Specifically, the method of using JavaScript to control the opacity property of icons to achieve icon rendering suffers from complex logic, high performance overhead, lag during switching, and poor user experience. Based on this, the icon rendering method of some embodiments of this disclosure first determines the zoom level in response to detecting map zooming in the target display area. Determining the zoom level facilitates subsequent determination of whether to render the target icon, avoiding a chaotic map display caused by rendering all icons regardless of zoom level. Then, it determines whether to render the target icon at the aforementioned zoom level to ensure the map display content is reasonable and clear, avoiding visual confusion. Next, in response to determining rendering, it iterates through the initialized icon object set to check if a target icon object exists for display. The target icon object includes: the map position and update icon at the aforementioned zoom level. Here, by pre-constructing icon objects based on zoom levels, the icons can be accurately displayed according to the map content shown at each zoom level, avoiding icon stuttering or blurring issues when zooming occurs. Finally, in response to confirmation of existence, the map is rendered at the aforementioned zoom levels based on the map location and updated icon corresponding to each target icon object. In summary, by pre-generating a set of icon objects for each zoom level, smooth and clear icon rendering is achieved when the displayed map is zoomed, with simple logic and no stuttering issues during transitions. Attached Figure Description
[0025] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. Throughout the drawings, the same or similar reference numerals denote the same or similar elements. It should be understood that the drawings are schematic, and elements are not necessarily drawn to scale.
[0026] Figure 1 This is a schematic diagram of an application scenario of an icon rendering method according to some embodiments of the present disclosure; Figure 2 This is a flowchart of some embodiments of the icon rendering method according to this disclosure; Figure 3 This is a flowchart of some other embodiments of the icon rendering method according to this disclosure; Figure 4 This is a schematic diagram of the structure of some embodiments of the icon rendering apparatus according to the present disclosure; Figure 5This is a schematic diagram of the structure of an electronic device suitable for implementing some embodiments of the present disclosure. Detailed Implementation
[0027] Embodiments of this disclosure will now be described in more detail with reference to the accompanying drawings. While some embodiments of this disclosure are shown in the drawings, it should be understood that this disclosure can be implemented in various forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided to provide a more thorough and complete understanding of this disclosure. It should be understood that the accompanying drawings and embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of protection of this disclosure.
[0028] It should also be noted that, for ease of description, only the parts relevant to the invention are shown in the accompanying drawings. Unless otherwise specified, the embodiments and features described in this disclosure can be combined with each other.
[0029] It should be noted that the concepts of "first" and "second" mentioned in this disclosure are used only to distinguish different devices, modules or units, and are not used to limit the order of functions performed by these devices, modules or units or their interdependencies.
[0030] It should be noted that the terms "a" and "a plurality of" used in this disclosure are illustrative rather than restrictive, and those skilled in the art should understand that, unless otherwise expressly indicated in the context, they should be understood as "one or more".
[0031] The names of messages or information exchanged between multiple devices in the embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of such messages or information.
[0032] Before performing any of the operations involving the collection, storage, or use of user personal information (such as icon objects) disclosed in this disclosure, the relevant organizations or individuals shall fulfill their obligations, including conducting personal information security impact assessments, informing personal information subjects, and obtaining prior authorization and consent from personal information subjects.
[0033] This disclosure will now be described in detail with reference to the accompanying drawings and embodiments.
[0034] Figure 1 This is a schematic diagram of an application scenario of an icon rendering method according to some embodiments of the present disclosure.
[0035] exist Figure 1In this application scenario, firstly, in response to detecting map zooming in the target display area, electronic device 101 can determine the zoom level 104. In this application scenario, zoom level 104 can be lock / release level 1. After zooming the default map 102 displayed in the target display area, map 103 at the zoom level can be obtained. Then, electronic device 101 can determine whether map 103 at the above zoom level should render the target icon. Furthermore, in response to determining rendering, electronic device 101 can iterate through the initialized icon object set 105 to find the target icon objects to display. The target icon objects include: the map position and update icon at the above zoom level. Finally, in response to determining existence, electronic device 101 can select the target icon objects 106 at the above zoom level based on the map position and update icon corresponding to each target icon object.
[0036] It should be noted that the aforementioned electronic device 101 can be either hardware or software. When the electronic device is hardware, it can be implemented as a distributed cluster consisting of multiple servers or terminal devices, or as a single server or a single terminal device. When the electronic device is software, it can be installed in the hardware devices listed above. It can be implemented as, for example, multiple software programs or software modules used to provide distributed services, or as a single software program or software module. No specific limitations are made here.
[0037] It should be understood that Figure 1 The number of electronic devices shown is merely illustrative. Any number of electronic devices can be used depending on the implementation requirements.
[0038] Continue to refer to Figure 2 The diagram illustrates a flow 200 of some embodiments of an icon rendering method according to the present disclosure. This icon rendering method includes the following steps: Step 201: In response to the detection of map zooming in the target display area, determine the zoom level.
[0039] In some embodiments, in response to detecting map zooming processing being performed in the target display area, the execution body of the above icon rendering method (e.g., Figure 1The electronic device 101 shown can determine the zoom level. The target display area can be an area displaying a map. In practice, the target display area can be a page displaying a map. The target page can be a page in the target application used to display the map and various icons. The target display area can also be a virtual area where a virtual product displays a map. For example, for a virtual product like smart glasses, the corresponding target display area could be the area where the smart glasses display a map. For example, the various icons can be key objects in the target application. For example, for a logistics application, the corresponding map could be a logistics map. The corresponding icons could include: icons for each warehouse, icons for each distribution center, and icons for each port. The zooming process can be to reduce or increase the size of the map displayed on the target page. The zoom level can represent the degree of reduction or increase. For example, the zoom level can be, but is not limited to, one of the following: reduction level 1, reduction level 2, reduction level 3, increase level 1, increase level 2, increase level 3. The reduction level corresponding to reduction level 1 is greater than the reduction level corresponding to reduction level 2. The reduction level corresponding to reduction level 2 is greater than the reduction level corresponding to reduction level 3. The increase level corresponding to increase level 1 is greater than the increase level corresponding to increase level 2. The magnification level 2 is greater than that of magnification level 3.
[0040] As an example, the aforementioned execution entity can use a listening thread to monitor in real time the processing operations that perform map zooming in the target display area. Then, it can determine the zoom level corresponding to the processing operation.
[0041] In some optional implementations of certain embodiments, before step 201, the steps further include: Load the map component to perform map initialization. The map component is a code module that encapsulates map functionality. It must go through the initialization process to transform abstract configurations into actual, interactive map instances. The map component is a reusable functional module in front-end frameworks (such as Vue / React) used to encapsulate the calling logic of the map engine.
[0042] Optionally, after loading the map component to perform map initialization processing, the method further includes: The first step is to send an icon data request to the server to obtain icon data for each icon. This icon data request is a request for structured parameters of the icon resource from the server. In practice, structured parameters may include: a unique icon identifier, resolution identifier, file format requirements, and scaling level associations. Icon data is a complete information package returned by the server, including the icon resource address, metadata, and style. Icon data can be data related to the icon. For example, icon data may include: the icon's base URI, background color value, location category identifier, and dynamic rendering instructions. The latitude and longitude of the icon may include: the longitude and latitude of the entity object represented by the icon in the world coordinate system.
[0043] The second step involves performing the following generation steps for each of the above icons: Sub-step 1 involves converting the latitude and longitude corresponding to the above icons into pixel positions in the pixel coordinate system corresponding to the above zoom level, and using these positions as the target pixel positions. The pixel coordinate system can be the pixel coordinate system corresponding to the map at the zoom level. Each latitude and longitude has a corresponding pixel position.
[0044] As an example, the aforementioned execution entity can utilize a pre-set projection algorithm for converting three-dimensional information to two-dimensional information (e.g., the Web Mercator projection algorithm) to convert the latitude and longitude of the aforementioned icon into pixel positions in the corresponding pixel coordinate system, which will then serve as the target pixel positions.
[0045] Sub-step 2: Based on the target pixel position mentioned above, construct the icon object corresponding to the icon.
[0046] As an example, the aforementioned execution entity can add the target pixel position as a parameter to the icon data to construct the target-form object content and obtain the icon object.
[0047] The third step is to identify the obtained icon object set as the initialized icon object set.
[0048] In some optional implementations of certain embodiments, the icon data may further include icon assets corresponding to each icon. These icon assets may be image assets corresponding to the icons, used for subsequent map display.
[0049] Optionally, constructing the icon object corresponding to the icon based on the target pixel position includes the following steps: The first step is to generate icon assets corresponding to the icon size and / or icon resolution based on the icon assets corresponding to the above icons and the above scaling levels, as adjustment assets.
[0050] As an example, for icon materials including sub-materials under various icon sizes and icon resolutions, the aforementioned execution entity can query the sub-materials corresponding to the above scaling level, icon size, and / or icon resolution from the icon materials as adjustment materials.
[0051] The second step is to create an initial icon object based on the adjusted materials described above. This initial icon object can be a pre-constructed icon object.
[0052] As an example, the aforementioned execution entity can use the icon object construction method to create and adjust the initial icon object corresponding to the material.
[0053] The third step is to replace the pixel position corresponding to the initial icon object with the target pixel position to obtain the icon object.
[0054] In some optional implementations of certain embodiments, before step 201, the steps further include: The first step is to obtain map query information. This map query information can be the content of a query about the location of a target object on the map. The target object can be the object being queried (i.e., the query subject). Map query information can be in various modal formats. For example, it can be text or audio. The information about the target object on the map can be its location or a route from the current location to the corresponding location of the target object. For example, map query information could be "Please help me find the map location of location A" or "Please help me find the route to location A".
[0055] It should be noted that the scenarios for map queries can be diverse. For example, one scenario could be entering map query information on a target page within a target application to display the corresponding map content. Another scenario could be entering map query information and corresponding audio within a virtual product to display the map content in the virtual product's display area.
[0056] The second step is to generate the query intent corresponding to the map query information mentioned above. The query intent can be the intention to perform a map query. For example, the query intent could be "map location query intent for location A" or "route query intent".
[0057] As an example, the query intent corresponding to the above map query information can be generated based on an intent recognition model (e.g., a lightweight Transformer model).
[0058] The third step, based on the query intent, is to determine whether to perform map scaling in the target display area. In practice, there is a default display scale when displaying a map in the target display area. Therefore, the default display scale may be adjusted depending on the query intent.
[0059] As an example, the aforementioned execution entity can determine whether to perform map zooming under a query intent by using a mapping table between query intent and zoom level. In practice, the mapping relationship in the mapping table can represent the association between query intent category, zoom label, and zoom level.
[0060] In some alternative implementations of some embodiments, determining the scaling level as described above includes: The aforementioned executing entity can determine the aforementioned scaling level based on the aforementioned query intent.
[0061] Here, depending on the query intent, the executing entity can adaptively determine the corresponding zoom level to respond to map query information and enable map viewing. For example, for a query intent about physical stores, the corresponding zoom level should be adjusted to facilitate the display of the corresponding store icons. For a query intent about cities, the corresponding zoom level should be adjusted to facilitate the display of the corresponding city icons.
[0062] As an example, first, determine the intent category corresponding to the query intent. Then, determine the scaling level corresponding to the query intent by querying the mapping table.
[0063] Step 202: Determine whether the map at the above zoom level renders the target icon.
[0064] In some embodiments, the execution entity may determine whether to render the target icon at the zoom level. The target icon may be an icon that is determined to be rendered under the current zoom operation. The map at the zoom level may be the map displayed after zooming.
[0065] As an example, the aforementioned execution entity can determine whether the map at the above zoom level should render the target icon by querying the mapping relationship between the zoom level and the icon being rendered.
[0066] In some optional implementations of certain embodiments, the execution entity may determine whether the map at the zoom level renders the target icon, including the following steps: The first step is to determine whether the zoom level mentioned above is within the predetermined zoom range. The predetermined zoom range can be a pre-set map zoom range. In practice, the predetermined zoom range is a zoom range set specifically for the target icon. That is, the target icon is supported for display within the predetermined zoom range. In other words, different icons support preset zoom ranges. Icon display is only supported within the preset zoom range.
[0067] The second step is to determine the target icon for map display at the zoom level mentioned above, in response to the current zoom level.
[0068] Optionally, in response to not being at the above zoom level, the map does not display the target icon.
[0069] In some optional implementations of certain embodiments, determining whether the map at the zoom level renders the target icon includes: The first step is to generate at least one query object based on the query intent described above. The query object can be an object used for map queries. For example, for a query intent of "search for milk tea shops of various brands in city A", the corresponding at least one query object would be "various brands".
[0070] As an example, the aforementioned execution entity can utilize a named entity recognition model to extract at least one query object from the query intent.
[0071] The second step is to determine the map rendering target icon at the zoom level in response to the determination that the icon object corresponding to the target icon is within at least one of the query objects.
[0072] Here, rendering only occurs if the target icon's corresponding icon object is present in all the objects being queried on the map. This allows for precise map queries based on the map query information.
[0073] Step 203: In response to determining rendering, iterate through the initialized icon object set to see if there is a target icon object to be displayed.
[0074] In some embodiments, in response to determining rendering, the aforementioned execution entity may check whether a target icon object for display exists in the initialized icon object set. The initialized icon object can be one that has had various icon information initialized. This various icon information relates to various information rendered on the map. For example, the various icon information may include: icon brightness, different versions of the icon, and map location. The target icon object is the icon object rendered on the map at the specified zoom level. The target icon object includes: the map location at the aforementioned zoom level and an updated icon for the target icon. The map location can be the rendering location of the updated icon on the map at the specified zoom level. The updated icon can be the icon displayed at the specified zoom level. In practice, the updated icon here can be an icon with a size update or an icon with updated content. The initialized icon object set can be a collection of icon instances that have been created, configured, and registered in the map engine. The initialized icon object set can be actually rendered or filtered according to the current view state. Essentially, it is a logical layer data structure maintained in memory, used for efficient management of icon position, style, and interaction logic. The initialization here means that the icon object set has been adapted and adjusted according to the current view state for the corresponding object content of the icon objects. Icon object sets are program objects in memory (e.g., JavaScript Marker instances) that include complete metadata such as coordinates, styles, and event listeners, but are not necessarily visible within the current map viewport.
[0075] Step 204: In response to confirming existence, render each target icon object on the map at the above zoom level based on the map location and update icon corresponding to each target icon object.
[0076] In some embodiments, in response to determining existence, the aforementioned execution entity can render each target icon object on the map at the aforementioned zoom level based on the map location and update icon corresponding to each target icon object. Here, there can be at least one target icon object to be displayed.
[0077] During the actual rendering process, for each target icon object, the map position of the corresponding updated icon in the map at the above zoom level will be rendered.
[0078] In some optional implementations of certain embodiments, after step 204, the steps further include: The first step, in response to receiving map re-query information for the aforementioned target display area, is to determine the query association information between the map re-query information and the map query information. The map re-query information can be information obtained through further querying based on the map query information. For example, the query association information can indicate whether there is a content association relationship between the query content corresponding to the map re-query information and the query content corresponding to the map query information.
[0079] As an example, firstly, the semantic correlation between the first query semantic content corresponding to the map query information and the second query semantic content corresponding to the map query information is determined (e.g., the vector similarity between the semantic content vectors corresponding to the first query semantic content and the second query semantic content). Then, in response to a semantic correlation degree higher than a target similarity threshold (e.g., 0.9), query association information with content correlation is generated. In response to a semantic correlation degree lower than the target similarity threshold (e.g., 0.9), query association information without content correlation is generated.
[0080] The second step involves generating icon rendering change information based on the aforementioned query association information, which indicates the existence of a semantic relationship between the query and the target. This icon rendering change information can be information about changes in icon rendering under the corresponding icon rendering state in the map query information. In practice, icon rendering change information may include: changes in zoom level, icon size, icon resolution, and icon position.
[0081] As an example, the aforementioned execution entity can generate query intent change information corresponding to the query-related information. This query intent change information can be information about a change in query intent from the map query information to the query intent of a subsequent map query. For example, the query intent change information could be a change from "query intent for location A map location" to "query intent for location A map location to location B map location". Then, based on the query intent change information, the zoom level change is determined using a mapping table lookup. Next, based on the zoom level change, changes in icon size, icon resolution, and icon position are determined.
[0082] The third step is to adjust the icon rendering of the map corresponding to each query object based on the above icon rendering change information.
[0083] As an example, the aforementioned execution entity can adjust the icon rendering of the map corresponding to the icons of each query object based on the icon rendering change information, including changes in scaling level, icon size, icon resolution, and icon position.
[0084] The above embodiments of this disclosure have the following beneficial effects: Through the icon rendering methods of some embodiments of this disclosure, when the displayed map undergoes zooming, the icons on the map are rendered smoothly and clearly. Specifically, the method of using JavaScript to control the opacity property of icons to achieve icon rendering suffers from complex logic, high performance overhead, lag during switching, and poor user experience. Based on this, the icon rendering method of some embodiments of this disclosure first determines the zoom level in response to detecting zooming of the map displayed on the target page. Determining the zoom level helps in subsequently determining whether to render the target icon, avoiding a chaotic map display caused by rendering all icons regardless of zoom level. Then, it determines whether to render the target icon at the aforementioned zoom level to ensure the map display content is reasonable and clear, avoiding visual confusion. Next, in response to determining rendering, it iterates through the initialized icon object set to see if a target icon object exists for display. The target icon object includes: the map position and update icon at the aforementioned zoom level. Here, by pre-constructing icon objects based on zoom levels, the icons can be accurately displayed according to the map content shown at each zoom level, avoiding icon stuttering or blurring issues when zooming occurs. Finally, in response to confirmation of existence, the map is rendered at the aforementioned zoom levels based on the map location and updated icon corresponding to each target icon object. In summary, by pre-generating a set of icon objects for each zoom level, smooth and clear icon rendering is achieved when the displayed map is zoomed, with simple logic and no stuttering issues during transitions.
[0085] Further reference Figure 3 The diagram illustrates a flow 300 of another embodiment of the icon rendering method according to this disclosure. This icon rendering method includes the following steps: Step 301: In response to the detection of zooming of the map displayed on the target page, determine the zoom level.
[0086] Step 302: Load the map at the precision corresponding to the above zoom level.
[0087] In some embodiments, the executing entity (e.g. Figure 1The electronic device 101 shown can load maps at the aforementioned zoom levels corresponding to different levels of precision. Each zoom level corresponds to a specific number of map tiles, and each map tile has a unique identifier. The map displays different levels of geographic detail as it is zoomed in and out. Therefore, for speed considerations, a complete map at each zoom level is divided into several small, text-shaped tiles, which are loaded as needed during display. The larger the map is, the larger its area, and the more tiles it is divided into. Each of these small tiles can be called a map tile. Different zoom levels correspond to different numbers of map tiles. For example, at zoom level 1, the displayed map is a complete world map, which can consist of 4 map tiles. As the zoom level increases, the corresponding map will be divided into 4*N map tiles. Here, N can be the zoom level. Each map tile has a specific identifier, which can be represented as (x, y, z). x represents the column number, y represents the row number, and z represents the zoom level.
[0088] Step 303: Determine whether the map at the above zoom level renders the target icon.
[0089] Step 304: In response to determining rendering, iterate through the initialized icon object set to see if there is a target icon object to be displayed.
[0090] Step 305: In response to confirming existence, render each target icon object on the map at the above zoom level based on the map location and update icon corresponding to each target icon object.
[0091] In some embodiments, the specific implementation of steps 301-304 and the resulting technical effects can be found in [reference needed]. Figure 2 Steps 201-204 in the corresponding embodiments will not be repeated here.
[0092] from Figure 3 It can be seen from this that, with Figure 2 Compared to the description of some corresponding embodiments, Figure 3 In some corresponding embodiments, the icon rendering method process 300, based on a number of map tiles, can quickly load a map at a zoom level corresponding to the required precision.
[0093] Further reference Figure 4 As an implementation of the methods shown in the above figures, this disclosure provides some embodiments of an icon rendering apparatus, which are similar to... Figure 2 Corresponding to the method embodiments shown, this icon rendering device can be specifically applied to various electronic devices.
[0094] like Figure 4As shown, an icon rendering device 400 includes: a first determining unit 401, a second determining unit 402, a traversal unit 403, and a rendering unit 404. The first determining unit 401 is configured to determine a scaling level in response to detecting map scaling processing in the target display area; the second determining unit 402 is configured to determine whether the map at the aforementioned scaling level should render target icons; the traversal unit 403 is configured to, in response to determining rendering, traverse the initialized icon object set to check if there are target icon objects to be displayed, wherein the target icon objects include: the map position and update icon at the aforementioned scaling level; the rendering unit 404 is configured to, in response to determining existence, render each target icon object on the map at the aforementioned scaling level based on the map position and update icon corresponding to each target icon object.
[0095] In some optional implementations of some embodiments, the second determining unit 402 may be further configured to: determine whether the above zoom level is within a predetermined zoom range; and in response to being within the zoom level, determine the map display target icon at the above zoom level.
[0096] In some optional implementations of certain embodiments, the apparatus 400 further includes a first loading unit (not shown in the figure). This first loading unit can be configured to load a map component to perform map initialization processing.
[0097] In some optional implementations of certain embodiments, the apparatus 400 further includes a sending unit, an execution unit, and a third determining unit (not shown in the figure). The sending unit can be configured to send an icon data request to a server to obtain icon data for each icon, wherein the icon data includes the latitude and longitude corresponding to each icon. The execution unit can be configured to, for each of the icons, perform the following generation steps: convert the latitude and longitude corresponding to the icon into a pixel position in the pixel coordinate system corresponding to the scaling level, as the target pixel position; and construct an icon object corresponding to the icon based on the target pixel position. The third determining unit can be configured to determine the obtained set of icon objects as the initialized set of icon objects.
[0098] In some optional implementations of some embodiments, the above icon data further includes: icon material corresponding to each icon; and the execution unit can be further configured to: generate icon material corresponding to the icon size and / or icon resolution based on the icon material corresponding to the above icon and the above scaling level, as adjustment material; create an initial icon object based on the above adjustment material; and replace the pixel position corresponding to the above initial icon object with the above target pixel position to obtain the icon object.
[0099] In some optional implementations of certain embodiments, the apparatus 400 further includes an acquisition unit, a generation unit, and a fourth determining unit (not shown in the figure). The acquisition unit can be configured to acquire map query information. The generation unit can be configured to generate a query intent corresponding to the map query information. The fourth determining unit can be configured to determine, based on the query intent, whether to perform map zooming processing in the target display area. Optionally, the first determining unit 401 can be further configured to determine the zoom level based on the query intent.
[0100] In some optional implementations of some embodiments, the second determining unit 402 may be further configured to: generate at least one query object according to the above query intent; and determine the map rendering target icon at the above zoom level in response to determining that the icon object corresponding to the target icon is within the above at least one query object.
[0101] In some optional implementations of certain embodiments, the apparatus 400 further includes a fifth determining unit, an information generating unit, and a rendering adjustment unit (not shown in the figure). The fifth determining unit can be configured to: in response to receiving map re-query information for the target display area, determine query association information between the map re-query information and the map query information. The information generating unit can be configured to: in response to the query association information indicating the existence of a query semantic association, generate icon rendering change information based on the query association information. The rendering adjustment unit can be configured to: adjust the icon rendering of the map corresponding to the icons of each query object based on the icon rendering change information.
[0102] In some optional implementations of certain embodiments, the apparatus 400 further includes a second loading unit (not shown in the figure). The second loading unit can be configured to load a map at the zoom level corresponding to a specific precision, wherein the map corresponding to the zoom level has a corresponding number of map tiles, and each map tile has a corresponding number.
[0103] It is understandable that the units described in the icon rendering device 400 and the reference Figure 2 The steps in the described method correspond to each other. Therefore, the operations, features, and beneficial effects described above for the method also apply to the icon rendering device 400 and the units contained therein, and will not be repeated here.
[0104] The following is for reference. Figure 5 It illustrates electronic devices suitable for implementing some embodiments of this disclosure (e.g., Figure 1 A schematic diagram of the structure of electronic device 101)500. Figure 5The electronic device shown is merely an example and should not be construed as limiting the functionality and scope of the embodiments of this disclosure.
[0105] like Figure 5 As shown, the electronic device 500 may include a processing unit (e.g., a central processing unit, a graphics processing unit, etc.) 501, which can perform various appropriate actions and processes according to a program stored in a read-only memory 502 or a program loaded from a storage device 508 into a random access memory 503. The random access memory 503 also stores various programs and data required for the operation of the electronic device 500. The processing unit 501, the read-only memory 502, and the random access memory 503 are interconnected via a bus 504. An input / output interface 505 is also connected to the bus 504.
[0106] Typically, the following devices can be connected to the input / output interface 505: input devices 506 including, for example, a touchscreen, touchpad, keyboard, mouse, camera, microphone, accelerometer, gyroscope, etc.; output devices 507 including, for example, a liquid crystal display (LCD), speaker, vibrator, etc.; storage devices 508 including, for example, magnetic tape, hard disk, etc.; and communication devices 509. Communication device 509 allows electronic device 500 to communicate wirelessly or wiredly with other devices to exchange data. Although Figure 5 An electronic device 500 with various devices is shown; however, it should be understood that it is not required to implement or possess all of the devices shown. More or fewer devices may be implemented or possessed alternatively. Figure 5 Each box shown can represent a device or multiple devices as needed.
[0107] In particular, according to some embodiments of this disclosure, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, some embodiments of this disclosure include a computer program product comprising a computer program carried on a computer-readable medium, the computer program containing program code for performing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network via a communication device 509, or installed from a storage device 508, or installed from a read-only memory 502. When the computer program is executed by the processing device 501, it performs the functions defined above in the methods of some embodiments of this disclosure.
[0108] It should be noted that, in some embodiments of this disclosure, the computer-readable medium described above may be a computer-readable signal medium or a computer-readable storage medium, or any combination thereof. A computer-readable storage medium may be, for example,—but not limited to—an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of a computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination thereof. In some embodiments of this disclosure, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, apparatus, or device. In some embodiments of this disclosure, a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code. Such propagated data signals may take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium can be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in connection with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any suitable medium, including but not limited to: wires, optical fibers, RF (radio frequency), etc., or any suitable combination thereof.
[0109] In some implementations, clients and servers can communicate using any currently known or future-developed network protocol such as HTTP (Hypertext Transfer Protocol) and can interconnect with digital data communication (e.g., communication networks) of any form or medium. Examples of communication networks include local area networks (“LANs”), wide area networks (“WANs”), the Internet (e.g., the Internet of Things), and peer-to-peer networks (e.g., ad hoc peer-to-peer networks), as well as any currently known or future-developed networks.
[0110] The aforementioned computer-readable medium may be included in the aforementioned electronic device; or it may exist independently and not assembled into the electronic device. The aforementioned computer-readable medium carries one or more programs that, when executed by the electronic device, cause the electronic device to: determine a zoom level in response to detecting map zooming processing in the target display area; determine whether the map at the aforementioned zoom level renders target icons; in response to determining rendering, iterate through the initialized set of icon objects to determine if there are target icon objects to be displayed, wherein the target icon objects include: the map position and update icon at the aforementioned zoom level; and in response to determining existence, render each target icon object at the aforementioned zoom level based on the map position and update icon corresponding to each target icon object.
[0111] Computer program code for performing operations of some embodiments of this disclosure can be written in one or more programming languages or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, and C++, and conventional procedural programming languages such as the "C" language or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0112] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions indicated in the blocks may occur in a different order than those indicated in the drawings. For example, two consecutively indicated blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or operation, or using a combination of dedicated hardware and computer instructions.
[0113] The units described in some embodiments of this disclosure can be implemented in software or hardware. The described units can also be housed in a processor; for example, a processor may be described as including a first determining unit, a second determining unit, a traversal unit, and a rendering unit. The names of these units do not necessarily limit the unit itself; for example, the first determining unit may also be described as "a unit that determines the zoom level in response to detecting map zooming processing performed in the target display area."
[0114] The functions described above in this document can be performed at least in part by one or more hardware logic components. For example, exemplary types of hardware logic components that can be used, without limitation, include: field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), system-on-a-chip (SoCs), complex programmable logic devices (CPLDs), and so on.
[0115] Some embodiments of this disclosure also provide a computer program product, including a computer program that, when executed by a processor, implements any of the above-described icon rendering methods.
[0116] The above description is merely a selection of preferred embodiments of this disclosure and an explanation of the technical principles employed. Those skilled in the art should understand that the scope of the invention involved in the embodiments of this disclosure is not limited to technical solutions formed by specific combinations of the above-described technical features, but should also cover other technical solutions formed by arbitrary combinations of the above-described technical features or their equivalents without departing from the above-described inventive concept. For example, technical solutions formed by substituting the above-described features with (but not limited to) technical features with similar functions disclosed in the embodiments of this disclosure.
Claims
1. An icon rendering method, comprising: In response to detecting map zooming in the target display area, determine the zoom level; Determine whether the map at the zoom level renders the target icon; In response to determining rendering, it iterates through the initialized icon object set to see if there is a target icon object to be displayed, wherein the target icon object includes: the map position under the zoom level and the update icon for the target icon; In response to the determination of existence, the map is rendered at the zoom level according to the map location and update icon corresponding to each target icon object.
2. The method according to claim 1, wherein, Determining whether the map renders the target icon at the zoom level includes: Determine whether the zoom level is within the predetermined zoom range; In response to being in a certain zoom level, determine the map display target icon.
3. The method according to claim 1, wherein, Before determining the zoom level in response to detecting map zooming processing in the target display area, the method further includes: Load the map component to perform map initialization processing; and After loading the map component to perform map initialization processing, the method further includes: The icon data request is sent to the server to obtain icon data for each icon, wherein the icon data includes: the latitude and longitude corresponding to each icon; For each of the icons, perform the following generation steps: The latitude and longitude corresponding to the icon are converted into pixel positions in the pixel coordinate system corresponding to the scaling level, and used as the target pixel positions; Based on the target pixel position, construct the icon object corresponding to the icon; The resulting set of icon objects is then identified as the initialized set of icon objects.
4. The method according to claim 3, wherein, The icon data also includes: the icon material corresponding to each icon; and The step of constructing the icon object corresponding to the icon based on the target pixel position includes: Based on the icon material corresponding to the icon and the scaling level, generate icon material corresponding to the icon size and / or icon resolution as adjustment material; Based on the adjusted materials, create an initial icon object; The pixel position corresponding to the initial icon object is replaced with the target pixel position to obtain the icon object.
5. The method according to claim 1, wherein, Before determining the zoom level in response to detecting map zooming processing in the target display area, the method further includes: Get map query information; Generate the query intent corresponding to the map query information; Based on the query intent, determine whether to perform map zooming in the target display area; and Determining the scaling level includes: The scaling level is determined based on the query intent.
6. The method according to claim 5, wherein, Determining whether the map renders the target icon at the zoom level includes: Based on the query intent, at least one query object is generated; In response to determining that the icon object corresponding to the target icon is within the at least one query object, the map rendering target icon at the zoom level is determined.
7. The method according to claim 6, wherein, The method further includes: In response to receiving map re-query information for the target display area, determine the query association information between the map re-query information and the map query information; In response to the query association information indicating the existence of a query semantic association, icon rendering change information is generated based on the query association information; Based on the icon rendering change information, the map corresponding to the icons of each query object is rendered and the icon rendering is adjusted.
8. The method according to claim 1, wherein, After responding to the detection of map zooming processing in the target display area and determining the zoom level, the method further includes: Load the map at the zoom level corresponding to the precision, wherein the map corresponding to the zoom level has a corresponding number of map tiles, and each map tile has a corresponding number.
9. An icon rendering device, comprising: The first determining unit is configured to determine the zoom level in response to detecting map zooming processing performed in the target display area; The second determining unit is configured to determine whether the map at the zoom level renders the target icon. The traversal unit is configured to, in response to a determined rendering, traverse the initialized set of icon objects to determine if there is a target icon object to be displayed, wherein the target icon object includes: the map position and the update icon at the zoom level; The rendering unit is configured to render each target icon object on the map at the zoom level in response to a determination of existence, based on the map location and update icon corresponding to each target icon object.
10. An electronic device, comprising: One or more processors; Storage device, on which one or more programs are stored, When the one or more programs are executed by the one or more processors, the one or more processors implement the method as described in any one of claims 1-8.
11. A computer-readable medium having a computer program stored thereon, wherein, When the computer program is executed by a processor, it implements the method as described in any one of claims 1-8.
12. A computer program product comprising a computer program that, when executed by a processor, implements the method according to any one of claims 1-8.