Cross-platform sky map component packaging method and device based on unit-app X framework

By adopting a layered architecture design based on the uni-app X framework, the compatibility and maintenance challenges of cross-platform map components are solved, enabling efficient reuse of cross-platform map components and unified permission management. It also adapts to the native rendering mode of uni-app X, improving development efficiency and user experience.

CN121349523AActive Publication Date: 2026-01-16TAIHUA WISDOM IND GRP CO LTD +1

Patent Information

Application Number
CN202511923408.0
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-12-19
Publication Date
2026-01-16
Estimated Expiration
2045-12-19

AI Technical Summary

Technical Problem

In cross-platform mobile application development, traditional map components cannot achieve true cross-platform reuse, resulting in long development cycles and high maintenance costs. Furthermore, existing solutions lack unified interface specifications and permission management, and cannot adapt to the native rendering mode of the uni-app X framework, leading to performance loss and high maintenance difficulty.

Method used

It adopts a cross-platform map component encapsulation method based on the uni-app X framework. Through a layered architecture of application layer, communication layer, WebView layer and platform adaptation layer, it provides a unified API interface and permission management to realize the encapsulation and adaptation of cross-platform map components, supporting Android, iOS and HarmonyOS platforms.

Benefits of technology

It enables efficient reuse of map components across platforms, reduces development and maintenance costs, improves development efficiency and user experience, adapts to the native rendering mode of uni-app X, simplifies permission handling logic, and improves performance and stability.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN121349523A_ABST
    Figure CN121349523A_ABST
Patent Text Reader

Abstract

The invention relates to the technical field of cross-platform application development, in particular to a cross-platform sky map component packaging method and device based on a unit-app X framework. According to the method, a four-layer packaging framework comprising an application layer, a communication layer, a WebView layer and a platform adaptation layer is constructed, and unified packaging and calling of sky map components of Android, iOS and a multi-platform gap are achieved. The application layer completes component initialization, instruction verification and standardization processing; the communication layer realizes data interaction and coordinate conversion; the WebView layer executes map API loading, instance management, covering rendering and event monitoring; the platform adaptation layer completes cross-platform authority management, WebView container adaptation and GPS position acquisition; and finally, the application layer integrates the data and encapsulates a TelchinaTdtUnix component to return a result. The problems that an existing cross-platform sky map component is poor in adaptability, disordered in authority management and low in interaction efficiency are solved, and the cross-platform compatibility, stability and development efficiency of the component are improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of geographic information service cross-platform development technology, and in particular to a cross-platform Tianditu component encapsulation method and apparatus based on the uni-app X framework. Background Technology

[0002] With the rapid development of mobile internet and IoT technologies, the demand for geographic information services in various mobile applications (such as smart cities, traffic navigation, and logistics monitoring) is increasing. Tianditu, as a national geographic information public service platform, provides high-precision map data covering the entire country and rich service interfaces (such as positioning, route planning, and POI query), making it an important choice for integrating geographic information functions into mobile applications.

[0003] However, in cross-platform mobile application development scenarios, developers face significant challenges: traditional map components are typically developed for specific platforms (e.g., native Android components are based on Java / Kotlin, native iOS components are based on Objective-C / Swift, and web components are based on HTML+JavaScript), failing to achieve true cross-platform reuse. This forces development teams to repeatedly develop similar map functions for different platforms, increasing development cycles and maintenance costs, and easily leading to inconsistencies in functionality and difficulties in version synchronization due to platform differences.

[0004] Meanwhile, the map API interface designs differ significantly across platforms (e.g., the interface parameters and calling methods of the Android Tianditu SDK and the iOS Tianditu SDK are different), lacking a unified interface specification. Developers need to learn multiple APIs, resulting in poor code reusability. In addition, different map services and devices use different coordinate systems (e.g., GPS devices output WGS84 coordinates, while Tianditu uses GCJ02 coordinates). Existing solutions require developers to manually handle coordinate conversions, increasing development complexity. The location permission handling mechanisms also differ across platforms (e.g., Android 13 and above require requesting precise location permissions, while iOS requires declaring the purpose of permissions through a Privacy description file). Existing solutions lack a unified permission management encapsulation, leading to complex and inconsistent permission handling logic.

[0005] In recent years, the uni-app X framework, as a new generation of cross-platform development framework, adopts the UTS (UniTypeScript) language, offering better performance and type safety features, and achieving true native rendering. Unlike traditional uni-app frameworks that rely on WebView rendering, uni-app X abandons the WebView rendering mode and turns to a native rendering architecture. This architectural upgrade makes the traditional WebView-based render.js solution no longer suitable: render.js, designed based on the WebView rendering architecture, cannot adapt to uni-app X's native rendering mode; the dual rendering mechanism relying on WebView leads to performance degradation and excessive memory consumption; using traditional JavaScript lacks the strong type checking and compile-time optimization of the UTS language; it requires maintaining two sets of code, Vue components and render.js scripts, resulting in high maintenance difficulty; and render.js runs in an independent rendering process, making debugging and troubleshooting difficult. Currently, there is a lack of native map component support for the uni-app X framework on the market, failing to meet the needs of cross-platform mobile applications for efficient and stable map functionality.

[0006] Therefore, this invention proposes a cross-platform Tianditu component encapsulation and device based on the uni-app X framework to solve the above problems. Summary of the Invention

[0007] To address the shortcomings of existing technologies, this invention develops a cross-platform map component encapsulation method and device based on the uni-app X framework. This invention can overcome the problems of poor platform compatibility of map components, high development and maintenance costs, inability to adapt to the native rendering architecture of uni-app X, complex coordinate processing, and inconsistent permission management in existing technologies.

[0008] On the one hand, the technical solution of this invention to solve the technical problem is a cross-platform Tianditu component encapsulation method based on the uni-app X framework, which includes the following steps: S1. Developers can send instructions containing method names, parameter objects, and callback functions through mobile applications on Android, iOS, or HarmonyOS platforms to call the TelchinaTdtUnix Tianditu cross-platform encapsulation component. S2. Based on the uni-appX cross-platform application development engine, a cross-platform Tianditu component encapsulation framework is built, which includes an application layer, a communication layer, a WebView layer, and a platform adaptation layer. S3. The application layer receives the instructions from S1, first performs component initialization, then verifies and preprocesses the call instructions, and transmits the processing results to the communication layer and the platform adaptation layer respectively. S4. The communication layer receives standardized instructions from the application layer and performs message queue management, data serialization, asynchronous call processing, and error retry mechanism operations respectively. After automatically converting the coordinate system output results of each operation, it is input to the WebView layer and also sent back to the application layer. The S5 WebView layer parses the standardized message object transmitted by the communication layer after coordinate transformation through the HTML page container, presents the corresponding page according to the different running platforms, performs map operations and sends the operation results back to the communication layer, which then processes them and sends them back to the application layer. S6. The platform adaptation layer receives the output from the application layer, calls the corresponding platform permission system according to the permission status, performs platform adaptation, selects the component to load the HTML page container, obtains the GPS location through the adaptation component and sends it back to the application layer. S7 integrates the location data returned by the application layer and the execution results returned by the communication layer, encapsulates the TelchinaTdtUnix component containing the final results, and returns the encapsulated results to the developers.

[0009] The specific operations at the application layer are as follows: (1) During component initialization, the attribute interface, event interface and permission status of the TelchinaTdtUnix component are defined and managed; (2) After initialization, define a parameter validation class to receive instructions from the developer and perform method name validation, required parameter validation, parameter type validation and conversion, parameter preprocessing and formatting operations; (3) Output the standardized parameter object, callback function and permission status, and input them into the communication layer and platform adaptation layer respectively.

[0010] The component initialization process is as follows: The attribute parameters defined in the attribute interface include the Tianditu API key, map container height, map center point coordinates, map zoom level, and coordinate projection system, and default values ​​are set. The events defined in the event interface include map loading complete event, map click event, location retrieval success event, and location retrieval failure event. All events return an empty type. Permission status management is implemented through a permission management class, which includes permission status control members and permission status retrieval members. It also includes a permission branch processing class and a permission guidance class, which includes pop-up display members and jump setting members.

[0011] The specific operations in the communication layer are as follows: The communication layer includes a message queue management module, a data serialization module, an asynchronous call processing module, and an error retry mechanism module; The message queue management module is used to independently process concurrent requests and match results. The data serialization module is used for the conversion between application-layer standardized JavaScript objects and JSON format strings; The asynchronous call handling module is used to avoid blocking the main thread and provide a unified asynchronous operation interface; The error retry mechanism module is used to automatically retry requests when the network is unstable or there is a temporary failure.

[0012] The specific operations in the WebView layer are as follows: (1) Receive and parse instructions from the communication layer through the HTML page container, execute the corresponding events after receiving the instructions, and restore the received instructions to an operable object format, and then convert them into operations that can be executed by the WebView layer; (2) Perform map function operations, including loading the Tianditu application programming interface API, managing map instances, rendering overlays, and handling event listeners; The Tianditu API loading operation is used to import the map rendering and service capabilities provided by Tianditu; the map instance management operation is used to initialize the display and interaction of Tianditu; the overlay rendering operation is used to visualize and annotate the map; and the event listener handling operation is used to pass map interaction events across layers. (3) The results of map function operation are encapsulated and then sent back to the communication layer. The communication layer processes the encapsulated results and then sends them back to the application layer.

[0013] The operations in the platform adaptation layer are as follows: (1) Cross-platform unified permission management is carried out through the permission management module, which includes a permission status check unit and a permission request unit; The permission status check unit determines whether map functionality is provided by checking the permission status flag; the permission request form calls the platform's permission request interface according to the platform type. On the Android platform, the precise location permission flag is passed through the permission request interface; on the iOS platform, the authorization request interface during use is called through the location manager; and on the HarmonyOS platform, the location permission flag is passed through the permission request interface. The authorization result from the user is received through the callback mechanism of the permission request, and the permission status identifier variable is updated. (2) The platform adaptation layer provides a unified HTML page rendering capability for different platforms in the WebView container; (3) Obtain the user's current location information and unify the location data format through the location service module. The location service module includes an API call unit, a platform native positioning unit, and a location data processing unit. 1) The API call unit obtains the device location through the browser and calls the browser's geolocation retrieval interface in the HTML page of the WebView layer; 2) The platform's native positioning unit calls the platform's underlying positioning service. The Android platform obtains the device location through GPS, network, and sensor methods by integrating a positioning provider or location manager. The iOS platform obtains the device location through GPS, Wi-Fi, and cellular network methods by location manager. The HarmonyOS platform obtains the device location through GPS and network methods by geolocation manager. After the platform's native positioning unit obtains the device's GPS coordinates, it returns a location object through a callback mechanism. The location object contains a coordinate sub-object and a timestamp field. The coordinate sub-object includes latitude, longitude, and precision fields. The location data processing unit standardizes the format of location data, extracts latitude and longitude data from the coordinate sub-object of the location object, and converts the latitude and longitude into an array format, represented as [longitude, latitude].

[0014] The specific operation of S7 is as follows: The application layer receives location data returned by the platform adaptation layer and execution results returned by the communication layer. It integrates and processes the received data, encapsulates the processed data into reactive state variables of the TelchinaTdtUnix component, triggers view updates through the reactive system, and returns the encapsulated results to the developer through method return values ​​or event emission mechanisms.

[0015] On the other hand, the present invention also provides a cross-platform Tianditu component encapsulation device based on the uni-app X framework, used to execute a cross-platform Tianditu component encapsulation method based on the uni-app X framework, including: Framework building module: Used to build a cross-platform Tianditu component encapsulation framework based on the uni-app X cross-platform application development engine, including application layer, communication layer, WebView layer and platform adaptation layer; Instruction receiving and preprocessing module: Used to receive instructions sent by developers, and perform component initialization, instruction verification and preprocessing; Communication processing module: used to perform message queue management, data serialization, asynchronous call processing and error retry mechanism operations, as well as automatic coordinate system conversion; Map operation execution module: used to parse standardized message objects, perform map operations, and return the execution results; Platform Adaptation and Location Module: Used for platform permission management, platform adaptation, and GPS location acquisition; Data integration and encapsulation module: Used to integrate location data and execution results, encapsulate the TelchinaTdtUnix component and return the results.

[0016] The effects described in the invention are merely those of the embodiments, and not all the effects of the invention. The above technical solutions have the following advantages or beneficial effects: This invention, through the uni-app X framework and layered architecture design, enables a single UTS codebase to support Android, iOS, and HarmonyOS platforms simultaneously, eliminating the need for repetitive development for different platforms and resolving the poor platform compatibility issues of traditional map components. By providing a unified API interface, it shields the underlying platform differences, eliminating the need for developers to learn multiple platform APIs, thereby improving code reusability and development efficiency. The core business logic of this invention can be reused across platforms, reducing maintenance costs and avoiding the problem of version inconsistency across multiple platforms. This invention adopts a native rendering architecture adapted to uni-app X, abandoning the WebView rendering dependency of the traditional render.js solution. Through a hybrid architecture of "UTS component + WebView + platform adaptation," it perfectly adapts to the native rendering mode of uni-app X, solving problems such as rendering incompatibility, performance bottlenecks, lack of type safety, high maintenance difficulty, and debugging difficulties of the render.js solution. A unified permission management mechanism simplifies the permission application and state handling logic for different platforms, thereby improving development efficiency and user experience. Attached Figure Description

[0017] The accompanying drawings are provided to further illustrate the invention and form part of the specification. They are used together with the embodiments of the invention to explain the invention and do not constitute a limitation thereof.

[0018] Figure 1 This is a schematic diagram of the method flow of the present invention. Detailed Implementation

[0019] To clearly illustrate the technical features of this solution, the invention will be described in detail below through specific implementation methods and in conjunction with the accompanying drawings.

[0020] Example 1 like Figure 1 As shown, a method for encapsulating a cross-platform Tianditu component based on the uni-app X framework includes the following steps: S1. Developers can send instructions containing method names, parameter objects, and callback functions through mobile applications on Android, iOS, or HarmonyOS platforms to call the TelchinaTdtUnix Tianditu cross-platform encapsulation component. S2. Based on the uni-appX cross-platform application development engine, a cross-platform Tianditu component encapsulation framework is built, which includes an application layer, a communication layer, a WebView layer, and a platform adaptation layer. S3. The application layer receives the instructions from S1, first performs component initialization, then verifies and preprocesses the call instructions, and transmits the processing results to the communication layer and the platform adaptation layer respectively. S4. The communication layer receives standardized instructions from the application layer and performs message queue management, data serialization, asynchronous call processing, and error retry mechanism operations respectively. After automatically converting the coordinate system output results of each operation, it is input to the WebView layer and also sent back to the application layer. The S5 WebView layer parses the standardized message object transmitted by the communication layer after coordinate transformation through the HTML page container, presents the corresponding page according to the different running platforms, performs map operations and sends the operation results back to the communication layer, which then processes them and sends them back to the application layer. S6. The platform adaptation layer receives the output from the application layer, calls the corresponding platform permission system according to the permission status, performs platform adaptation, selects the component to load the HTML page container, obtains the GPS location through the adaptation component and sends it back to the application layer. S7 integrates the location data returned by the application layer and the execution results returned by the communication layer, encapsulates the TelchinaTdtUnix component containing the final results, and returns the encapsulated results to the developers.

[0021] In a specific implementation, the application layer operations are as follows: (1) During component initialization, the attribute interface, event interface and permission status of the TelchinaTdtUnix component are defined and managed; (2) After initialization, define a parameter validation class to receive instructions from the developer and perform method name validation, required parameter validation, parameter type validation and conversion, parameter preprocessing and formatting operations; (3) Output the standardized parameter object, callback function and permission status, and input them into the communication layer and platform adaptation layer respectively.

[0022] In a specific implementation, the component initialization process is as follows: The attribute parameters defined in the attribute interface include the Tianditu API key, map container height, map center point coordinates, map zoom level, and coordinate projection system, and default values ​​are set. The events defined in the event interface include map loading complete event, map click event, location retrieval success event, and location retrieval failure event. All events return an empty type. Permission status management is implemented through a permission management class, which includes permission status control members and permission status retrieval members. It also includes a permission branch processing class and a permission guidance class, which includes pop-up display members and jump setting members.

[0023] In a specific implementation, the operations in the communication layer are as follows: The communication layer includes a message queue management module, a data serialization module, an asynchronous call processing module, and an error retry mechanism module; The message queue management module is used to independently process concurrent requests and match results. The data serialization module is used for the conversion between application-layer standardized JavaScript objects and JSON format strings; The asynchronous call handling module is used to avoid blocking the main thread and provide a unified asynchronous operation interface; The error retry mechanism module is used to automatically retry requests when the network is unstable or there is a temporary failure.

[0024] In a specific implementation, the specific operations within the WebView layer are as follows: (1) Receive and parse instructions from the communication layer through the HTML page container, execute the corresponding events after receiving the instructions, and restore the received instructions to an operable object format, and then convert them into operations that can be executed by the WebView layer; (2) Perform map function operations, including loading the Tianditu application programming interface API, managing map instances, rendering overlays, and handling event listeners; 1) Loading the Tianditu Application Programming Interface (API): Introducing the map rendering and service capabilities provided by Tianditu, obtaining the map key and functional module configuration parameters through the URL parameter parsing mechanism, dynamically creating script tags and setting the resource address of the Tianditu API, inserting the script tags into the HTML document structure to trigger the browser to load the Tianditu API script, listening for the script loading completion event to confirm the API ready status, and loading the extended function library as needed according to the functional configuration parameters; 2) Map Instance Management: Initialize the display and interaction of Tianditu. Create a map instance through the map builder and pass in the HTML container identifier and configuration object. The configuration object includes coordinate projection system, zoom level and center point coordinate parameters. If the center point is not specified, the current GPS location of the user is obtained through the positioning function. The positioning function internally calls the browser positioning interface to obtain the device's geographical location. Configure the center coordinates and zoom level of the map through the center point setting method of the map instance to complete the initial rendering. 3) Overlay Rendering: Visualize and annotate the map. Based on the type identifier value in the overlay data object, call the corresponding Tianditu API constructor. If the type is a point marker, create a point marker object; if the type is a polyline, create a polyline object; if the type is a polygon, create a polygon object; if the type is a circle, create a circle object. If it contains coordinate information and the coordinate transformation identifier is true, call the coordinate transformation function to perform the conversion from WGS84 to GCJ02 coordinate system. The coordinate transformation function determines whether the coordinates are within China by the latitude and longitude range. For coordinates within China, perform a coordinate encryption algorithm based on ellipsoid parameters and eccentricity to calculate the offset. Render the overlay object onto the map using the overlay addition method of the map instance. Store the overlay object reference along with the unique identifier in a global array for unified management. 4) Event Listener Processing: Perform cross-layer transmission of map interaction events. Register listeners for map interaction events through the event listener registration interface of the map instance. The event types to be listened to include single click, double click, touch start, zoom end, and drag end events. Extract key data from the event object in the callback function, construct a standardized event message object containing event type, event name, latitude and longitude coordinates, pixel coordinates, and timestamp fields, and send the event data to the communication layer through the message sending interface. (3) The results of map function operation are encapsulated and then sent back to the communication layer. The communication layer processes the encapsulated results and then sends them back to the application layer.

[0025] In a specific implementation, the operations in the platform adaptation layer are as follows: (1) Cross-platform unified permission management is carried out through the permission management module, which includes a permission status check unit and a permission request unit; The permission status check unit determines whether map functionality is provided by checking the permission status flag; the permission request form calls the platform's permission request interface according to the platform type. On the Android platform, the precise location permission flag is passed through the permission request interface; on the iOS platform, the authorization request interface during use is called through the location manager; and on the HarmonyOS platform, the location permission flag is passed through the permission request interface. The authorization result from the user is received through the callback mechanism of the permission request, and the permission status identifier variable is updated. (2) The platform adaptation layer provides a unified HTML page rendering capability for different platforms in the WebView container; (3) Obtain the user's current location information and unify the location data format through the location service module. The location service module includes an API call unit, a platform native positioning unit, and a location data processing unit. 1) The API call unit obtains the device location through the browser and calls the browser's geolocation retrieval interface in the HTML page of the WebView layer; 2) The platform's native positioning unit calls the platform's underlying positioning service. The Android platform obtains the device location through GPS, network, and sensor methods by integrating a positioning provider or location manager. The iOS platform obtains the device location through GPS, Wi-Fi, and cellular network methods by location manager. The HarmonyOS platform obtains the device location through GPS and network methods by geolocation manager. After the platform's native positioning unit obtains the device's GPS coordinates, it returns a location object through a callback mechanism. The location object contains a coordinate sub-object and a timestamp field. The coordinate sub-object includes latitude, longitude, and precision fields. The location data processing unit standardizes the format of location data, extracts latitude and longitude data from the coordinate sub-object of the location object, and converts the latitude and longitude into an array format, represented as [longitude, latitude].

[0026] In a specific implementation, the operation of S7 is as follows: The application layer receives location data returned by the platform adaptation layer and execution results returned by the communication layer. It integrates and processes the received data, encapsulates the processed data into reactive state variables of the TelchinaTdtUnix component, triggers view updates through the reactive system, and returns the encapsulated results to the developer through method return values ​​or event emission mechanisms.

[0027] Example 2 A cross-platform Tianditu component encapsulation device based on the uni-app X framework, used to execute a cross-platform Tianditu component encapsulation method based on the uni-app X framework, including: Framework building module: Used to build a cross-platform Tianditu component encapsulation framework based on the uni-app X cross-platform application development engine, including application layer, communication layer, WebView layer and platform adaptation layer; Instruction receiving and preprocessing module: Used to receive instructions sent by developers, and perform component initialization, instruction verification and preprocessing; Communication processing module: used to perform message queue management, data serialization, asynchronous call processing and error retry mechanism operations, as well as automatic coordinate system conversion; Map operation execution module: used to parse standardized message objects, perform map operations, and return the execution results; Platform Adaptation and Location Module: Used for platform permission management, platform adaptation, and GPS location acquisition; Data integration and encapsulation module: Used to integrate location data and execution results, encapsulate the TelchinaTdtUnix component and return the results.

[0028] Example 3 In the street light management system, a unified Tianditu function needs to be implemented on the three platforms of Android, iOS and HarmonyOS, including street light location marking, inspection route planning, real-time positioning, etc. The challenges to overcome in implementing this feature include: the lack of readily available Tianditu components under the uni-app X framework; the obsolescence of the traditional renderjs solution, requiring a completely new cross-layer communication mechanism; the need to support high-concurrency labeling of 500+ street light devices; and the necessity to support the HarmonyOS platform to meet domestic requirements.

[0029] To address the aforementioned issues, the four-layer architecture scheme of this invention (application layer, communication layer, WebView layer, and platform adaptation layer) successfully enables cross-platform encapsulation of Tianditu within the uni-app X framework. The specific core technical achievements are as follows: The four-layer architecture proposed in this invention successfully solves the cross-layer communication problem under the uni-app X framework, as shown in Table 1. Table 1. Actual Measured Results of the Architecture The smart street light management system covers 500+ street light devices and is used by 50+ maintenance personnel. After 6 months of actual operation, its functional integrity is shown in Table 2, its stability and reliability are shown in Table 3, and its user experience is shown in Table 4. Table 2. Functional Integrity Test Results in the Smart Street Light Management System Table 3. Stability and Reliability Data Results of the Smart Street Light Management System Table 4 User Experience Improvement Data The results of development efficiency and economic benefits are shown in Tables 5 to 7. Table 5 Development Efficiency Comparison Table Table 6 Economic Benefit Analysis Table Table 7 Long-Term Value Analysis Table In summary, addressing the inapplicability of traditional solutions under the uni-app X framework, a novel solution is proposed. Its layered architecture—comprising the application layer, communication layer, WebView layer, and platform adaptation layer—is currently the only Tianditu cross-platform component fully supporting the uni-app X framework. Real-world testing shows an 80% code reuse rate and a 75% reduction in maintenance costs. Compared to traditional WebView solutions, initialization speed is improved by 55%, rendering speed by 59%, concurrency handling by 900%, message loss rate by 99.9%, UI smoothness by 97%, and memory usage by 45%. The crash rate is 0.02%, five times better than industry standards, with a 99.7% request success rate and 99.99% coordinate accuracy. Zero memory leaks were observed in six months of actual operation. The development cycle is shortened by 61%, code volume is reduced by 67%, maintenance costs are reduced by 75%, and feature iteration speed is increased by 3 times. Over three years, this can save 331,000 yuan, a 73% reduction, significantly lowering long-term maintenance costs and resulting in a high return on investment.

[0030] This invention successfully solves the technical challenge of cross-platform encapsulation of Tianditu under the uni-app X framework, achieving significant results in terms of performance, reliability, development efficiency, and economic benefits. It has high practical and promotional value, and provides a mature solution for the development of map applications under the uni-app X framework.

[0031] Although the specific embodiments of the invention have been described above in conjunction with the accompanying drawings, this is not intended to limit the scope of protection of the invention. Based on the technical solutions of the invention, various modifications or variations that can be made by those skilled in the art without creative effort are still within the scope of protection of the invention.

Claims

1. A uni-app X framework-based cross-platform map component packaging method, characterized by the following steps: As follows: S1, the developer sends an instruction containing a method name, a parameter object, and a callback function through a mobile application of the Android, iOS, or Harmony platform to call the TelchinaTdtUnix map cross-platform encapsulation component; S2, based on the uni-appX cross-platform application development engine, a cross-platform map component encapsulation framework is constructed, which includes an application layer, a communication layer, a WebView layer, and a platform adaptation layer; S3, the application layer receives the instruction in S1, first performs component initialization, then verifies and preprocesses the calling instruction, and transmits the processing results to the communication layer and the platform adaptation layer respectively; S4, the communication layer receives the standardized instruction output by the application layer, performs message queue management, data serialization, asynchronous call processing, and error retry mechanism operation respectively, and inputs the operation output results to the WebView layer after coordinate system automatic conversion, and also returns to the application layer; S5, the WebView layer parses the standardized message object transmitted by the communication layer through the HTML page container, presents the corresponding page according to the running platform, executes the map operation, and returns the operation execution result to the communication layer, which is processed and then returned to the application layer; S6, the platform adaptation layer receives the output of the application layer, calls the corresponding platform permission system according to the permission state, performs platform adaptation and selects the component to load the HTML page container, and obtains the GPS position through the adaptation component and returns it to the application layer; S7, the application layer integrates the position data returned by the platform adaptation layer and the execution result returned by the communication layer, encapsulates the TelchinaTdtUnix component containing the final result, and returns the encapsulation result to the developer.

2. The uni-app X framework-based cross-platform map component packaging method according to claim 1, characterized in that, The operation of the application layer is as follows: (1) During component initialization, the property interface, event interface, and permission state of the TelchinaTdtUnix component are defined and managed; (2) After initialization, define the parameter verification class, receive the instruction input by the developer, and perform method name verification, mandatory parameter verification, parameter type verification and conversion, parameter preprocessing and formatting operation; (3) Output the standardized parameter object, callback function, and permission state to the communication layer and platform adaptation layer respectively.

3. The uni-app X framework-based cross-platform map component packaging method according to claim 2, characterized in that, The component initialization process is as follows: The property parameters defined by the property interface include the map API key, map container height, map center point coordinate, map zoom level, and coordinate projection system, and the default values are set; The events defined by the event interface include map loading completion event, map click event, location acquisition success event, and location acquisition failure event, and the return type of all events is empty; The permission state management is implemented through the permission management class, which contains permission state control members and permission state acquisition members, and also sets permission branch processing classes and permission guide classes, and the permission guide class contains popup display members and setting jump members.

4. The cross-platform map component packaging method based on the uni-app X framework according to claim 1, characterized in that, The operation in the communication layer is as follows: The communication layer includes a message queue management module, a data serialization module, an asynchronous call processing module, and an error retry mechanism module; The message queue management module is used for independent processing of concurrent requests and result matching; The data serialization module is used for mutual conversion between the standardized JavaScript object of the application layer and the JSON format string; The asynchronous call processing module is used for avoiding blocking the main thread and providing a unified asynchronous operation interface; The error retry mechanism module is used for automatically retrying the request when the network is unstable or temporarily fails.

5. The uni-app X framework-based cross-platform map component packaging method according to claim 1, characterized in that, The specific operations in the WebView layer are as follows: (1) receiving and analyzing the instructions of the communication layer through the HTML page container, executing the corresponding events after receiving the instructions, and restoring the received instructions into an operable object format, and then converting it into an operation executable by the WebView layer; (2) executing map function operations, including map application programming interface (API) loading, map instance management, overlay rendering, and event listening processing; The map application programming interface (API) loading operation is used to import the map rendering and service capabilities provided by the map, the map instance management operation is used to initialize the display and interaction of the map, the overlay rendering operation is used to visually mark the map, and the event listening processing operation is used to cross-layer transfer the map interaction events; (3) encapsulating the execution results of the map function operations, and then returning them to the communication layer, and the communication layer processes the encapsulation results and then returns them to the application layer.

6. The cross-platform map component packaging method based on the uni-app X framework according to claim 1, characterized in that, The operations in the platform adaptation layer are as follows: (1) performing unified permission management across platforms through the permission management module, which includes a permission state checking unit and a permission request unit; The permission state checking unit determines whether to provide map functions by checking the permission state identifier; The permission request unit calls the platform's permission request interface according to the platform type, the Android platform transmits the precise positioning permission identifier through the permission request interface, the iOS platform calls the use duration authorization request interface through the location manager, and the Harmony platform transmits the location permission identifier through the permission request interface; The authorization result of the user is received through the callback mechanism of the permission request and the permission state identifier variable is updated; (2) the platform adaptation layer provides unified HTML page rendering capabilities for different platforms in the WebView container; (3) obtaining the current location information of the user and unifying the location data format through the location service module, which includes an API calling unit, a platform native positioning unit, and a location data processing unit; 1) The API calling unit obtains the device location through the browser and calls the browser's geolocation acquisition interface in the HTML page of the WebView layer; 2) The platform native positioning unit calls the platform's underlying positioning service, the Android platform obtains the device location through the fusion positioning provider or the location manager using GPS, network, and sensor methods, the iOS platform obtains the device location through the location manager using GPS, Wi-Fi, and cellular network methods, and the Harmony platform obtains the device location through the geolocation manager using GPS and network methods; The platform native positioning unit returns a position object through a callback mechanism after obtaining the GPS coordinates of the device, and the position object contains a coordinate sub-object and a timestamp field, and the coordinate sub-object includes a latitude, a longitude, and an accuracy field; The position data processing unit unifies the format of the position data, extracts the longitude and latitude data from the coordinate sub-object of the position object, converts the longitude and latitude into an array format, and represents the longitude and latitude as [longitude, latitude].

7. The uni-app X framework-based cross-platform map component packaging method according to claim 1, characterized in that, The operation of S7 is specifically as follows: The application layer receives the position data returned by the platform adaptation layer and the execution result returned by the communication layer, integrates all types of received data, encapsulates the processed data into a responsive state variable of a TelchinaTdtUnix component, triggers view updating through a responsive system, and returns the encapsulation result to the developer through a method return value or an event emission mechanism.

8. A cross-platform map component packaging device based on a uni-app X framework, configured to execute the cross-platform map component packaging method based on the uni-app X framework according to any one of claims 1 to 7. Comprise: A framework building module is configured to build a cross-platform map component encapsulation framework including an application layer, a communication layer, a WebView layer, and a platform adaptation layer based on a uni-app X cross-platform application development engine; An instruction receiving and preprocessing module is configured to receive instructions sent by a developer, and perform component initialization, instruction verification, and preprocessing; A communication processing module is configured to perform message queue management, data serialization, asynchronous call processing, and error retry mechanism operation, and automatically convert coordinate systems; A map operation execution module is configured to parse a standardized message object, execute a map operation, and return an execution result; A platform adaptation and positioning module is configured to perform platform permission management, platform adaptation, and GPS position acquisition; A data integration and encapsulation module is configured to integrate position data and execution results, encapsulate a TelchinaTdtUnix component, and return a result.

Citation Information

Patent Citations

  • Cross-platform middleware device of mobile terminal equipment and implementation method of cross-platform middleware device of mobile terminal equipment

    CN104572042A

  • Cross-screen and cross-platform measurable live-action map organization method

    CN108021356A

  • GIS system for realizing multi-platform heterogeneous compatibility based on Dojo and design and deployment method thereof

    CN113282697A

  • Secondary development system of cloud GIS platform

    CN116521146A

  • Map building system and method

    CN118069773A

Cited By

  • Cross-platform sky map component two-way communication method and device based on message queue

    CN121396962A

  • A cross-platform bidirectional communication method and apparatus for Tianditu components based on message queues.

    CN121396962B