Cairo plug-in based web operating system native map application method and device

Abstract

The application discloses a Web operating system local map application method and device based on a cairo plug-in, and belongs to the technical field of Web operating systems. The method first deploys a map database, a map style sheet and font related files to a terminal device, lays a resource foundation for offline operation; then carries out sandboxing processing on a third-party C++ map library, realizes code and data access isolation, and guarantees system safety; subsequently, an osm- cairo module is written, a DrawMapWrapper tool class containing a map style storage and operation function is created; then, a map plug-in source code is written, a map interaction interface is realized, and the map plug-in source code is compiled into a cairo dynamic plug-in; finally, a Web map application is written, the plug-in is dynamically loaded and communicated, and map rendering and related operations are realized.

Description

Technical Field

[0001] This application relates to the field of Web operating system technology, and in particular to a method and apparatus for local map application on a Web operating system based on the Cairo plugin. Background Technology

[0002] With the widespread adoption of web operating systems, user demand for local map applications is growing. This demands not only a smooth browsing and interactive experience but also support for offline use scenarios (such as navigation and location lookup in offline environments) to adapt to mobile and embedded devices. However, current web applications using third-party map rendering libraries face significant technical bottlenecks. Due to the differences between the web environment and the native C / C++ language runtime environment, the commonly used technical approaches have insurmountable flaws and cannot simultaneously meet the four core requirements of performance, user experience, compatibility, and security.

[0003] There are four main implementation paths in the existing technology. The first is to compile the C / C++ map library into a WebAssembly (WASM) module and interact with WASM through JavaScript. However, this method is difficult to debug, has a large package size, requires manual memory management, and has poor browser compatibility. The second is to wrap the C / C++ map library as an HTTP service in Node / C++ on the backend and have the frontend call it remotely. This solution depends on the network, is prone to lag, cannot be offline, and has high backend concurrency pressure. The third is to integrate the C / C++ map library into the App shell and communicate with the Web through JSBridge. However, this method requires maintaining two sets of communication protocols, which has high development and maintenance costs, asynchronous lifecycles, and is prone to memory leaks or crashes. The fourth is to place the native map and H5 page on different WebViews and display them on top of each other, synchronizing their states through a message bus. However, multiple WebViews on top of each other will form information silos, have limited hierarchy, and not share memory. They are prone to frame drops on low-end devices, and complex interactions are difficult to implement.

[0004] In summary, existing web map application technologies suffer from a triangular contradiction between performance, user experience, and compatibility. Prioritizing performance at the expense of compatibility, or prioritizing development experience and compatibility, fails to meet the demands for offline operation and smooth interaction. There is currently no ideal solution that is lightweight, low-latency, cross-platform, and can securely call third-party C / C++ map libraries. New methods are urgently needed to overcome the barriers between web applications and native C / C++ map libraries, simultaneously achieving offline operation, secure isolation, high-performance rendering, and adaptation to the evolving needs of web operating systems. Summary of the Invention

[0005] This application provides a method and apparatus for local map application in a web operating system based on the Cairo plugin. The technical solution is as follows:

[0006] On the one hand, a method for local map application in a web operating system based on the Cairo plugin is provided, the method comprising:

[0007] Deploy map resources and fonts to terminal devices;

[0008] Sandboxing of third-party C++ map libraries;

[0009] Write the osm-cairo module;

[0010] Write the source code for the map plugin and implement the map browsing and interaction interfaces.

[0011] Compile the map plugin source code into a Cairo plugin;

[0012] Develop a web map application that communicates with the Cairo plugin to perform map rendering and related operations.

[0013] Optionally, deploying map resources and fonts to terminal devices includes:

[0014] The map database is pushed to the terminal device. The map database is a binary format generated by the libosmscout Import tool. The map database includes a dat file storing the original data of map elements, an idx index file, and an idmapID mapping table.

[0015] The map style sheet is pushed to the terminal device. The map style sheet is a libosmscout map style sheet file used to control map information.

[0016] The font-related files are pushed to the terminal device, including fonts.conf and conf.d. The fonts.conf is pushed to the system / etc / directory of the terminal device, and the conf.d is pushed to the system / etc / fonts / directory of the terminal device.

[0017] Optionally, the sandboxing process for the third-party C++ map library includes:

[0018] Sandboxing is performed on third-party map libraries and their dependent libraries, including libosmscout and libcairo.

[0019] The sandboxing process includes:

[0020] Compile the source code of the third-party C++ map library into a wasm file;

[0021] The wasm file is converted into a C file to achieve code and data access isolation between the third-party C++ map library and the web application. The third-party C++ map library includes libosmscout, libcairo, and their dependent libraries.

[0022] Optionally, writing the osm-cairo module includes:

[0023] Call the sandboxed interfaces of libosmscout and libcairo to create the map auxiliary utility class DrawMapWrapper;

[0024] The DrawMapWrapper is used to construct a map-related database, which stores the styles used when drawing the map and the map operation functions.

[0025] Optionally, the step of writing the map plugin source code and encoding the map browsing and interaction interface includes:

[0026] The source files of the map plugin's source code call DrawMapWrapper.h and MapPainterCairo.h;

[0027] Implement the plugin instance related interfaces on the plugin side, and obtain the local window object drawn by the HTML page of the Web application through the system plugin module;

[0028] Create a Cairo canvas and a Cairo drawing context. Specifically, the Cairo canvas is created by binding the raw pixel buffer of the local window of the terminal device by calling the Cairo_image_surface_create_for_data() method, and the Cairo drawing context is created by calling the Cairo_create() method.

[0029] Map parameters are parsed and cached. These map parameters include map database path, style sheet path, image width, image height, latitude, longitude, zoom level, and image path. The parsing and caching are implemented using the DrawMapWrapper class.

[0030] Call the OpenDatabase() method of DrawMapWrapper to open the map database and obtain a database handle available to libosmscout. Call the LoadData() method of DrawMapWrapper to load one screen of map data into the terminal device's memory.

[0031] A paintbrush is created using the DrawMap() method of the MapPainterCairo class, where the parameter of the DrawMap() method is the style configuration provided by DrawMapWrapper.

[0032] By combining the map drawing methods of the MapPainterCairo class and the translation, zoom, and rotation methods of the DrawMapWrapper class, a map browsing and interaction interface is implemented.

[0033] Register the plugin-side message processing interface HandleMessage(), which is used to receive and process messages sent by the Web map application via postMessage(), and call the corresponding map browsing and interaction interfaces according to the message fields.

[0034] Optionally, compiling the map plugin source code into a Cairo plugin includes:

[0035] The Cailo plugin is obtained by building all source code into a dynamic library using CMake. The source code includes the C source code and header files corresponding to the map plugin source code, the C source code and header files of the system plugin module, the C source code and header files of the sandboxed pango library, the C source code and header files of the sandboxed Cailo library, the C source code and header files of the sandboxed pixman library, and the C source code and header files of the sandboxed libosmscout library.

[0036] During the construction of the dynamic library, the nativewindow-related library is linked to provide the Cairo plugin with the ability to access the graphics buffer associated with the surface.

[0037] Optionally, the step of developing a web map application, which communicates with the Cairo plugin to implement map rendering and related operations, includes:

[0038] The web map application is written in native JavaScript code or a front-end JavaScript framework;

[0039] Place the cairo plugin and its related libraries in the lib directory of the Web map application;

[0040] Dynamically create in the JavaScript code of a web map application <embed> Tags or <object>The label, the <embed> Tags or <object>Set the tag's type attribute to "application / bp-plugin" and the loadfrom attribute to the cairo plugin name to load the cairo plugin;

[0041] The plugin status monitoring interface provided by the system plugin module is called to monitor the loading status of the Cairo plugin. When the loading status is "loaded", a message is sent to the Cairo plugin through postMessage(), which in turn calls the map-related interfaces in the Cairo plugin to realize map rendering and related operations.

[0042] On the other hand, a web operating system local map application device based on the Cairo plugin is provided, the device comprising:

[0043] The preprocessing module is used to deploy map resources and fonts to terminal devices;

[0044] The sandboxing module is used to sandbox third-party C++ map libraries.

[0045] The module writing module is used to write osm-cairo modules;

[0046] The plugin writing module is used to write the source code of map plugins and code the implementation of map browsing and interaction interfaces;

[0047] The plugin compilation module is used to compile the map plugin source code into a Cairo plugin;

[0048] The Web application development module is used to develop Web map applications. These Web map applications communicate with the Cairo plugin to perform map rendering and related operations.

[0049] On the other hand, a computer-readable storage medium is provided, wherein a computer program is stored in the computer program, which is loaded and executed by a processor to implement the web operating system local map application method based on the Cairo plugin as described above.

[0050] This application discloses a method for local map applications on a web operating system based on the Cairo plugin, aiming to solve the problems of existing web map applications being unable to securely and efficiently call third-party map libraries written in C / C++, lacking offline running capabilities, and having poor performance. This method first deploys the map database, map style sheets, and font-related files to the terminal device, laying the resource foundation for offline operation. Then, it sandboxes the third-party C++ map library to isolate code and data access, ensuring system security. Next, it writes the osm-cairo module, creating the DrawMapWrapper utility class containing map style storage and operation functions. Then, it writes the map plugin source code, implementing different interactive interfaces for map browsing and compiling it into a Cairo dynamic plugin. Finally, it writes the web map application, dynamically loading and communicating with the plugin to achieve map rendering and related operations. This method enables web map applications to have complete offline running capabilities, breaking through the technical bottleneck of web applications calling C / C++ map libraries, while balancing rendering performance and system security, and is suitable for various web operating system terminal devices. Attached Figure Description

[0051] Figure 1 A flowchart illustrating a method for applying local maps in a web operating system based on the Cairo plugin is shown.

[0052] Figure 2 A schematic diagram illustrating the interaction logic between a Web map application and the Cairo plugin is shown.

[0053] Figure 3 This diagram illustrates the entire development process of a local map application for a web operating system based on the Cairo plugin. Detailed Implementation

[0054] To make the objectives, technical solutions, and advantages of this application clearer, the embodiments of this application will be described in further detail below with reference to the accompanying drawings.

[0055] In this article, "multiple" refers to two or more. "And / or" describes the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A alone, A and B simultaneously, or B alone. The character " / " generally indicates that the preceding and following related objects have an "or" relationship.

[0056] Example 1

[0057] like Figure 1 The diagram illustrates a flowchart of a method for applying a local map on a web operating system based on the Cairo plugin. This application provides a method for applying a local map on a web operating system based on the Cairo plugin, the method comprising:

[0058] Step 101: Deploy map resources and fonts to the terminal device.

[0059] In one possible implementation, step 101 includes the following.

[0060] S11, push the map database to the terminal device. The map database is a binary format generated by the libosmscout Import tool. The map database includes a dat file storing the original data of map elements, an idx index file, and an idmapID mapping table.

[0061] S12, push the map style sheet to the terminal device. The map style sheet is a libosmscout map style sheet file used to control map information, such as layer order, color, line type and font.

[0062] S13, push the font-related files to the terminal device, wherein the font-related files include fonts.conf and conf.d, the fonts.conf is pushed to the system / etc / directory of the terminal device, and the conf.d is pushed to the system / etc / fonts / directory of the terminal device.

[0063] Specifically, first, connect the computer to the terminal device using a USB cable. Then, run the resource deployment script directly in the computer's terminal command line to quickly and easily deploy map resources, fonts, and other resources to the terminal device. The script will first create an "osm" folder in the terminal device's "data" directory. This folder will be used to store map-related resource files.

[0064] The script then divides the resource files into three parts and pushes them to the terminal device. The first part is the map database (corresponding to S11), which is a binary file converted from the raw data of OpenStreetMap using libosmscout's Import tool. It includes a .dat file (storing raw data such as nodes and roads), an .idx file (index file for easy and fast data retrieval), and an .idmap (ID mapping table). For example, if displaying a map of Hunan Province in a web application, the Hunan Province map database will be pushed to the / data / osm / hunan-latest directory on the terminal device. The second part is the map style sheet (corresponding to S12), which is a standard specific to libosmscout. The first part, OSS, needs to be pushed to the / data / osm / stylesheets directory on the device. This file is used to control the layer order (e.g., drawing the background before the roads), colors (main roads are set to orange-red #FF6B35, and the background is light gray #F5F5F5), line styles (solid lines for main roads, dashed lines for sidewalks), fonts, etc. The third part is the font-related files (corresponding to S13). Push fonts.conf to the / system / etc / directory, conf.d to / system / etc / fonts / , and push font files such as Source Han Sans to / system / fonts / for displaying text on the map.

[0065] Step 102: Sandbox the third-party C++ map library.

[0066] Sandboxing is performed on third-party map libraries and their dependent libraries, including libosmscout and libcairo.

[0067] The sandboxing process includes:

[0068] S21, compile the source code of the third-party C++ map library into a wasm file;

[0069] S22, the wasm file is converted into a C file to achieve code and data access isolation between the third-party C++ map library and the web application, wherein the third-party C++ map library includes libosmscout, libcairo and its dependent libraries.

[0070] The sandboxing process in this step is primarily for security, preventing these libraries from arbitrarily accessing system resources. The libraries to be processed include the core libosmscout (for parsing map data) and libcairo (for 2D graphics), as well as dependent libraries like pango (for font layout) and pixman (for pixel manipulation) (corresponding to S21). First, the wasm tool provided by the sandboxing module is used to compile the source code of these libraries into wasm files, such as libosmscout.wasm; then, the wasm2c tool provided by the sandboxing module is used to convert the wasm files into C files, such as libosmscout.wasm.c (corresponding to S22). Through sandboxing, the code and data access between third-party libraries and the application are isolated.

[0071] Step 103: Write the osm-cairo module.

[0072] S31, call the sandboxed interfaces of libosmscout and libcairo to create the map auxiliary utility class DrawMapWrapper;

[0073] S32, construct a map-related database through the DrawMapWrapper. The map-related database stores the styles and map operation functions used when drawing the map. The styles include fonts, icons, and backgrounds. The map operation functions include translation functions, zoom functions, rotation functions, etc.

[0074] Write the osm-cairo module to create the map auxiliary utility class DrawMapWrapper, providing the interfaces required for the map drawing process. Write the DrawMapWrapper.h header file, which includes libosmscout and libcairo header files, and defines variables and functions such as the database handle and drawing context. Write the DrawMapWrapper.cpp file (corresponding to S31), which calls the sandboxed libosmscout and libcairo interfaces from step 102 to implement functions such as map parameter parsing, opening the database, and loading map data.

[0075] Step 104: Write the map plugin source code and implement the map browsing and interaction interface.

[0076] In one possible implementation, step 104 includes the following.

[0077] S41, DrawMapWrapper.h and MapPainterCairo.h are called in the source files of the map plugin source code;

[0078] S42 implements the plugin instance related interfaces on the plugin side and obtains the local window object drawn by the Web application Html page through the system plugin module;

[0079] S42, create a Cairo canvas and a Cairo drawing context, wherein the Cairo canvas is created by binding the raw pixel buffer of the local window of the terminal device by calling the Cairo_image_surface_create_for_data() method, and the Cairo drawing context is created by calling the Cairo_create() method;

[0080] S43, Parse and cache map parameters, including map database path, style sheet path, image width, image height, latitude, longitude, zoom factor, and image path. The parsing and caching is implemented through the DrawMapWrapper class.

[0081] S44, call the OpenDatabase() method of DrawMapWrapper to open the map database to obtain the database handle available to libosmscout, and call the LoadData() method of DrawMapWrapper to load one screen of map data into the terminal device memory;

[0082] S45, a paintbrush is created using the DrawMap() method of the MapPainterCairo class, where the parameter of the DrawMap() method of the MapPainterCairo class is the style configuration provided by DrawMapWrapper;

[0083] S45 combines the map drawing methods of the MapPainterCairo class and the translation, zoom, and rotation methods of the DrawMapWrapper class to implement map browsing and interactive interfaces;

[0084] S46. Register the plugin-side message processing interface HandleMessage(). HandleMessage() is used to receive and process messages sent by the Web map application through postMessage(), and call the corresponding map browsing and interaction interfaces according to the message fields.

[0085] In summary, firstly, in the source file gis_plugin.cpp of the map plugin, include header files such as DrawMapWrapper.h and MapPainterCairo.h.

[0086] Then, implement the plugin instance-related interfaces on the plugin side, including plugin instance initialization, instance creation processing, instance destruction, and other interfaces, and obtain the local window object drawn by the web application's HTML page through the system plugin module.

[0087] Next, the Cairo-related canvas and drawing context are created. Specifically, the `cairo_image_surface_create_for_data()` method is called to bind the local window's raw pixel buffer obtained through the system plugin module to Cairo and create the Cairo canvas. Then, the `cairo_create()` method is used to create the drawing context, and all subsequent drawing operations are based on this context (corresponding to S42). Following this, map parameters are parsed and cached. Map parameters include the absolute path of the map database on the terminal, such as ` / data / osm / hunan-latest`, the stylesheet path ` / data / osm / stylesheets / standard.oss`, the image width of 1920px, height of 1080px, initial latitude of 28.2379°N, longitude of 112.9400°E, scaling factor of 15, and the generated image path ` / data / osm / gis.png`. These are all parsed through the `DrawMapWrapper` class and stored in the corresponding member variables of the class, which can be accessed directly later (corresponding to S43).

[0088] After the parameters are parsed and cached, map data is loaded. First, the `OpenDatabase()` method of `DrawMapWrapper` is called to open the map database and obtain a database handle that libosmscout can directly use. This handle can be used to query data later. Then, the `LoadData()` method is called to load the map data within one screen's range centered on the initial latitude and longitude into the terminal memory. This way, real-time database access is not required during rendering, facilitating fast rendering (corresponding to S44). Next, a paintbrush is created by calling the `DrawMap()` method of the `MapPainterCairo` class. The parameters use the style configuration provided by `DrawMapWrapper`, such as the main road color #FF6B35, line width 2px, and text using Source Han Sans 14px. This gives the paintbrush the corresponding drawing style (corresponding to S45).

[0089] Finally, implement the map browsing and interaction interfaces, such as the drawing interface RenderMap(), which calls the DrawMap() method of the MapPainterCairo class to draw the map data in memory onto the canvas according to the style using the previously created drawing context; the panning interface Pan(), which calls the PanMap() method of DrawMapWrapper, passing in the horizontal and vertical offsets, such as dx=-50, dy=0 indicating a leftward shift of 50px, and then calling RenderMap() to redraw the panned map, so you can see the map position has changed; scaling and rotation are similar, zooming in or out, rotating clockwise or counterclockwise are specified by the "action" parameter in the passed message field, and the "factor" parameter specifies the scaling factor or rotation angle. After processing the scaling or rotation operations, it is also necessary to call the RenderMap() method to update the drawing (corresponding to S46). Finally, the HandleMessage() interface on the plugin side needs to be registered. This interface is used to receive and process messages dispatched by the web application via postMessage(). For example, if the message {"action":"zoom-in","factor":20} is received, the "action" parameter is used to parse out that it is a zoom-in operation, and the HandleZoomIn() zoom-in interface is called with the "factor" parameter value passed in to zoom in on the map.

[0090] Step 105: Compile the map plugin source code into a Cairo plugin.

[0091] In one possible implementation, step 105 includes the following.

[0092] S51, using CMake, all source code is built into a dynamic library to obtain the cairo plugin. The source code includes the C source code and header files corresponding to the map plugin source code, the C source code and header files of the system plugin module, the C source code and header files of the sandboxed pango library, the C source code and header files of the sandboxed cairo library, the C source code and header files of the sandboxed pixman library, and the C source code and header files of the sandboxed libosmscout library.

[0093] S52, during the construction of the dynamic library, link the nativewindow related library to provide the Cairo plugin with the ability to access the graphics buffer associated with the surface.

[0094] In summary, this method uses CMake to compile the map plugin source code into a Cairo plugin. First, a CMakeLists.txt configuration file is written, specifying the compilation target as a dynamic library, the plugin name as gis_plugin, and including the map plugin's gis_plugin.cpp, the sandboxed libosmscout.wasm.c, libcairo.wasm.c, pango.wasm.c, and pixman.wasm.c when setting the source code path. The header file directory path must include the header file paths for system plugin modules, jsoncpp, etc. (corresponding to S51). Simultaneously, the nativewindow-related dynamic libraries need to be linked in the CMakeLists.txt configuration file. Finally, the dynamic library is compiled by executing the compilation script.

[0095] Step 106: Develop a Web map application that communicates with the Cairo plugin to perform map rendering and related operations.

[0096] In one possible implementation, step 106 includes the following.

[0097] S61, the Web map application is written in native JavaScript code or a front-end JavaScript framework, and the front-end JavaScript framework includes Vue framework, React framework, etc.

[0098] S62, Place the cairo plugin and its related libraries in the lib directory of the Web map application;

[0099] S63, dynamically created in the JavaScript code of a web map application. <embed> Tags or <object>The label, the <embed> Tags or <object>Set the tag's type attribute to "application / bp-plugin" and the loadfrom attribute to the cairo plugin name to load the cairo plugin;

[0100] S64, call the listening interface provided by the system plugin module to listen to the loading status of the cairo plugin. When the loading status is "loaded", send a message to the cairo plugin through postMessage() to call the map-related interfaces in the cairo plugin to realize map rendering and related operations. The related operations include map translation, zooming, rotation, etc.

[0101] In summary, this involves developing a web map application that communicates with the Cairo plugin to implement map-related functions. The web application can be implemented using native JavaScript or front-end frameworks such as Vue or React. For example, when using Vue, the code should be organized according to Vue's project structure (corresponding to S61). First, the compiled Cairo plugin and its dependent library files should be placed in the lib directory of the web map application to facilitate access to the plugin by the system plugin module (corresponding to S62).

[0102] Then, JavaScript code is written to dynamically create plugin tags and plugin instances, enabling communication with Cairo plugins. Each plugin tag creates a new plugin instance; plugin tags can be... <embed> Tags or <object>Add the `<plugin>` tag. Add a `type` attribute to the `<plugin>` tag, setting its value to `application / bp-plugin`, and add a `loadfrom` attribute, setting its value to the name of the Cairo plugin, `gis_plugin`. When it is recognized... <embed> or <object>When a tag is added, the system plugin module will determine whether the tag is for the system plugin module through the `type` attribute, and then load the dynamic library (here, the Cairo plugin) through the value of the `loadfrom` attribute (corresponding to S63). After loading, the loading status of the plugin instance (here, the Cairo plugin) is checked by calling `pluginState`. If the plugin is not in the `loaded` state, the plugin's `onpluginstatechange` interface is called. When the plugin status changes to `loaded`, it means that the plugin has been successfully loaded, and the application can communicate and interact with the Cairo plugin. At this time, the message sending interface `postMessage()` is called, and the message field and its value corresponding to the interface provided by the plugin to be called are passed to this interface. For example, setting the message field `action` to "zoom-in" will call the map zoom-in interface in the plugin library to implement the map zoom-in function. The implementation of map display, panning, rotation, and other functions is the same as the zoom-in function. After the plugin is loaded, the corresponding message is sent to the plugin (corresponding to S64).

[0103] like Figure 2 As shown in the diagram, this illustrates the interaction logic between the Web map application and the Cairo plugin. The Web map application sends operation commands (such as zooming and panning) to the system plugin module through the "message sending interface." The system plugin module then forwards the commands to the Cairo plugin through the "message processing interface." The Cairo plugin calls third-party libraries (such as sandboxed maps and drawing libraries) to complete map rendering or interactive operations.

[0104] Figure 3 This document illustrates the entire development process of a local map application for a web operating system based on the Cairo plugin. First, map resources and fonts are deployed to the terminal via a "preprocessing module." Third-party libraries are processed into secure sandboxed libraries by a "sandboxing module." A "module writing module" develops the osm-cairo module based on the sandboxed library. A "plugin writing module" combines the osm-cairo module, the sandboxed library, and the system plugin module to write plugin source code. A "plugin compilation module" compiles the source code into a Cairo plugin. Finally, a "web application writing module" combines the system plugin module to develop a web map application, enabling communication with the Cairo plugin.

[0105] This application discloses a method for local map applications on a web operating system based on the Cairo plugin. It aims to solve the problems of existing web map applications being unable to securely and efficiently call third-party map libraries written in C / C++, lacking offline running capabilities, and experiencing poor performance. This method first deploys the map database, map style sheets, and font-related files to the terminal device, laying the resource foundation for offline operation. Then, it sandboxes the third-party C++ map library to achieve code and data access isolation and ensure system security. Next, it writes the osm-cairo module, creating the DrawMapWrapper utility class containing map style storage and operation functions. Then, it writes the map plugin source code, implementing different interactive interfaces for map browsing, and compiles it into a Cairo dynamic plugin. Finally, it writes the web map application, dynamically loading and communicating with the plugin to achieve map rendering and related operations. This method enables web map applications to have complete offline running capabilities, breaking through the technical bottleneck of web applications calling C / C++ map libraries, while balancing rendering performance and system security, and is suitable for various web operating system terminal devices.

[0106] Example 2

[0107] In addition, a web operating system local map application device based on the Cairo plugin is also provided, the device comprising:

[0108] The preprocessing module is used to deploy map resources and fonts to terminal devices;

[0109] The sandboxing module is used to sandbox third-party C++ map libraries.

[0110] The module writing module is used to write osm-cairo modules;

[0111] The plugin writing module is used to write the source code of map plugins and code the implementation of map browsing and interaction interfaces;

[0112] The plugin compilation module is used to compile the map plugin source code into a Cairo plugin;

[0113] The Web application development module is used to develop Web map applications. These Web map applications communicate with the Cairo plugin to perform map rendering and related operations.

[0114] The sequence numbers of the embodiments in this application are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.

[0115] Those skilled in the art will understand that all or part of the steps of the above embodiments can be implemented by hardware, or by a program instructing related hardware. The program can be stored in a computer-readable storage medium, such as a read-only memory, a disk, or an optical disk. The above descriptions are merely optional embodiments of this application and are not intended to limit the application. Any modifications, equivalent substitutions, or improvements made within the spirit and principles of this application should be included within the scope of protection of this application.< / object> < / object> < / object> < / object> < / object> < / object>

Claims

1. A method for a cairo plug-in based web operating system native map application, characterized in that, The method includes: Deploy map resources and fonts to terminal devices; Sandboxing of third-party C++ map libraries; Write the osm-cairo module; Write the source code for the map plugin and implement the map browsing and interaction interfaces. Compile the map plugin source code into a Cairo plugin; Develop a web map application that communicates with the Cairo plugin to perform map rendering and related operations; The process of writing the osm-cairo module includes: calling the sandboxed interfaces of libosmscout and libcairo to create the map auxiliary utility class DrawMapWrapper; and constructing a map-related database through DrawMapWrapper, which stores the map drawing styles and map operation functions. The process of writing the map plugin source code and encoding the map browsing and interaction interfaces includes: calling DrawMapWrapper.h and MapPainterCairo.h in the source files of the map plugin source code; implementing plugin instance-related interfaces on the plugin side and obtaining the local window object for drawing the HTML page of the Web application through the system plugin module; creating a Cairo canvas and a Cairo drawing context, wherein the Cairo canvas is created by binding the raw pixel buffer of the local window of the terminal device by calling the cairo_image_surface_create_for_data() method, and the Cairo drawing context is created by calling the cairo_create() method; parsing and caching map parameters, including map database path, style sheet path, image width, image height, latitude, longitude, zoom factor, and image path, wherein the parsing and caching is implemented through the DrawMapWrapper class; and calling DrawMapWrapper.h and MapPainterCairo.h in the source files of the map plugin source code; implementing the plugin instance-related interfaces and obtaining the local window object for drawing the HTML page of the Web application through the system plugin module; creating a Cairo canvas and a Cairo drawing context, wherein the Cairo canvas is created by binding the raw pixel buffer of the local window of the terminal device by calling the cairo_image_surface_create_for_data() method, and the Cairo drawing context is created by calling the cairo_create() method; parsing and caching map parameters, including map database path, style sheet path, image width, image height, latitude, longitude, zoom factor, and image path, wherein the parsing and caching is implemented through the DrawMapWrapper class; and calling DrawMapWrapper.h and MapPainterCairo.h in the source files of the map plugin source code. The `OpenDatabase()` method of the `rapper` class opens the map database to obtain a database handle available to `libosmscout`, and calls the `LoadData()` method of `DrawMapWrapper` to load a screen of map data into the terminal device's memory. A drawing pen is created using the `DrawMap()` method of the `MapPainterCairo` class, whose parameter is the style configuration provided by `DrawMapWrapper`. The map drawing methods of the `MapPainterCairo` class and the pan, zoom, and rotate methods of the `DrawMapWrapper` class are combined to implement the map browsing and interaction interface. The plugin-side message processing interface `HandleMessage()` is registered. `HandleMessage()` is used to receive and process messages sent by the Web map application via `postMessage()`, and calls the corresponding map browsing and interaction interface based on the message fields.

2. The method of claim 1, wherein, The deployment of map resources and fonts to terminal devices includes: The map database is pushed to the terminal device. The map database is a binary format generated by the libosmscout Import tool. The map database includes a dat file storing the original data of map elements, an idx index file, and an idmapID mapping table. The map style sheet is pushed to the terminal device. The map style sheet is a libosmscout map style sheet file used to control map information. The font-related files are pushed to the terminal device, including fonts.conf and conf.d. The fonts.conf is pushed to the system / etc / directory of the terminal device, and the conf.d is pushed to the system / etc / fonts / directory of the terminal device.

3. The method of claim 1, wherein, The sandboxing process for third-party C++ map libraries includes: Sandboxing is performed on third-party map libraries and their dependent libraries, including libosmscout and libcairo. The sandboxing process includes: Compile the source code of the third-party C++ map library into a wasm file; The wasm file is converted into a C file to achieve code and data access isolation between the third-party C++ map library and the web application. The third-party C++ map library includes libosmscout, libcairo, and their dependent libraries.

4. The method of claim 1, wherein, The process of compiling the map plugin source code into a Cairo plugin includes: The Cailo plugin is obtained by building all source code into a dynamic library using CMake. The source code includes the C source code and header files corresponding to the map plugin source code, the C source code and header files of the system plugin module, the C source code and header files of the sandboxed pango library, the C source code and header files of the sandboxed Cailo library, the C source code and header files of the sandboxed pixman library, and the C source code and header files of the sandboxed libosmscout library. During the construction of the dynamic library, the nativewindow-related library is linked to provide the Cairo plugin with the ability to access the graphics buffer associated with the surface.

5. The method of claim 1, wherein, The development of the Web map application, which communicates with the Cairo plugin to implement map rendering and related operations, includes: The web map application is written in native JavaScript code or a front-end JavaScript framework; Place the cairo plugin and its related libraries in the lib directory of the Web map application; Dynamic creation in JavaScript code of a Web Map application <embed> tag or <object>Labels, said <embed> Labels or <object>Set the tag's type attribute to "application / bp-plugin" and the loadfrom attribute to the cairo plugin name to load the cairo plugin; The plugin status monitoring interface provided by the system plugin module is called to monitor the loading status of the Cairo plugin. When the loading status is "loaded", a message is sent to the Cairo plugin through postMessage(), which in turn calls the map-related interfaces in the Cairo plugin to realize map rendering and related operations. 6.A cairo plug-in based web operating system native map application apparatus, characterized by, The device includes: The preprocessing module is used to deploy map resources and fonts to terminal devices; The sandboxing module is used to sandbox third-party C++ map libraries. The module writing module is used to write osm-cairo modules; The plugin writing module is used to write the source code of map plugins and code the implementation of map browsing and interaction interfaces; The plugin compilation module is used to compile the map plugin source code into a Cairo plugin; The Web application writing module is used to write Web map applications, which communicate with the Cairo plugin to implement map rendering and related operations. The module writing module is also used for: The interface of the sandboxed libosmscout and libcairo is called to create the map auxiliary utility class DrawMapWrapper; a map-related database is built through DrawMapWrapper, which stores the map drawing style and map operation functions; The plugin writing module is also used for: The source files of the map plugin's source code call DrawMapWrapper.h and MapPainterCairo.h; implement the plugin instance-related interfaces on the plugin side, and obtain the local window object for drawing the HTML page of the web application through the system plugin module; create a Cairo canvas and a Cairo drawing context, wherein the Cairo canvas is created by binding the raw pixel buffer of the local window of the terminal device by calling the cairo_image_surface_create_for_data() method, and the Cairo drawing context is created by calling the cairo_create() method; parsing and caching map parameters, including map database path, style sheet path, image width, image height, latitude, longitude, zoom factor, and image path, the parsing and caching is implemented through the DrawMapWrapper class; and call the OpenData method of DrawMapWrapper. The `abase()` method opens the map database to obtain a database handle available to libosmscout, and calls the `LoadData()` method of `DrawMapWrapper` to load a screen of map data into the terminal device's memory. A drawing pen is created using the `DrawMap()` method of the `MapPainterCairo` class, whose parameter is the style configuration provided by `DrawMapWrapper`. The map drawing methods of the `MapPainterCairo` class and the translation, zoom, and rotation methods of the `DrawMapWrapper` class are combined to implement the map browsing and interaction interface. The plugin-side message processing interface `HandleMessage()` is registered. `HandleMessage()` is used to receive and process messages sent by the Web map application via `postMessage()`, and calls the corresponding map browsing and interaction interface based on the message fields.

7. A computer readable storage medium characterized by The computer-readable storage medium stores a computer program, which is loaded and executed by a processor to implement the local map application method for a Web operating system based on the Cairo plugin as described in any one of claims 1 to 5. < / object> < / object>

Images