Digital twin monitoring large screen front end real-time rendering and interaction method

Abstract

The application discloses a digital twin monitoring large screen front end real-time rendering and interaction method, relates to the technical field of visualization rendering, and comprises the following steps: obtaining identity information and organization permission information of a login user, determining a display level corresponding to the user and an accessible transfer center range; generating a front end running context according to the display level and the accessible transfer center range, and establishing a corresponding relationship among large screen rendering data, a front end rendering component, an interaction event and a message topic; loading the large screen rendering data in stages based on the front end running context, and rendering the large screen rendering data into a national map, a provincial map, a transfer center real scene and a corresponding front end rendering component according to the corresponding relationship to form a current front end rendering state; and based on the front end running context, obtaining business data change information through an interface polling mechanism and a message topic subscription mechanism. The method can improve the real-time display consistency and the interaction efficiency of a digital twin monitoring large screen in a multi-level logistics operation scene.

Description

Technical Field

[0001] This invention relates to the field of visualization rendering technology, and in particular to a real-time rendering and interaction method for the front end of a digital twin monitoring screen. Background Technology

[0002] As logistics and transit networks develop towards nationwide, multi-level, and refined operations, digital twin monitoring dashboards are gradually evolving from simple data display interfaces into front-end visualization systems that integrate spatial situation display, business indicator monitoring, anomaly alarms, and interactive analysis. These systems typically need to interface with multi-source data, including map statistics, transit center locations, workload, dispatch monitoring, inventory status, equipment maintenance, personnel attendance, alarms, and images, and display this data through front-end rendering components such as maps, charts, tables, pop-ups, and real-world scenes. For large logistics companies, users at different management levels—headquarters, regional offices, and transit centers—have different data viewing scopes and interaction needs. Therefore, digital twin monitoring dashboards not only need to support switching between national maps, provincial maps, and real-world scenes of transit centers, but also need to dynamically determine the display level, data request scope, accessible transit centers, and interactive objects based on user identity and organizational permissions.

[0003] However, existing technologies still have shortcomings in high-frequency changing scenarios such as logistics transfer centers: First, there is a lack of unified constraints among user permissions, display levels, business data, front-end rendering components, and interactive events, which can easily lead to inconsistencies in the scope of data requests, map scenarios, search objects, pop-up details, and refresh objects, making it difficult to ensure that different management roles obtain display results that match their responsibilities. Second, existing solutions mostly rely on fixed-period polling, full-page refresh, or independent requests from each module, lacking phased loading, message topic subscription, and module-level partial refresh mechanisms. This can easily cause problems such as first-screen loading blockage, delayed response to critical business status, and repeated loading of irrelevant components after user interaction, making it difficult to meet the real-time operational monitoring needs such as unloading and dismantling, loading monitoring, overdue inventory, critical alarms, and detailed drill-down. Summary of the Invention

[0004] In view of the aforementioned existing problems, the present invention is proposed.

[0005] Therefore, this invention provides a real-time rendering and interaction method for the front end of a digital twin monitoring screen to solve the problems of lack of unified constraints between permission levels, rendering components, interaction events and message refresh, as well as the problems of first-screen blocking, full-page reload and insufficient local linkage when updating high-frequency business data.

[0006] To solve the above-mentioned technical problems, the present invention provides the following technical solution: This invention provides a method for real-time rendering and interaction of a digital twin monitoring screen front end, comprising: Obtain the login user's identity information and organizational permission information to determine the user's corresponding display level and the scope of the transit centers they can access; The front-end runtime context is generated based on the display level and the scope of accessible transfer centers, and the correspondence between large screen rendering data, front-end rendering components, interactive events and message topics is established. Based on the front-end runtime context, the large screen rendering data is loaded in stages, and the large screen rendering data is rendered into a national map, provincial map, real scene of the transfer center and corresponding front-end rendering components according to the corresponding relationship, forming the current front-end rendering state. Based on the front-end runtime context, business data change information is obtained through interface polling mechanism and message topic subscription mechanism, and the corresponding target display level, target transfer center or target business object is determined when a user interaction event is received; Based on changes in business data, target display level, target transfer center, or target business object, a rendering update instruction is generated, and based on the rendering update instruction, scene switching, partial data loading, or front-end rendering component refresh is performed on the current front-end rendering state. Output the updated digital twin monitoring screen in real time, including rendering and interactive results.

[0007] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of obtaining the identity information and organizational permission information of the logged-in user and determining the display level and accessible transfer center range of the user is as follows: based on the user role, organizational level and accessible menu information of the logged-in user, determine the national level, provincial level or transfer center level of the logged-in user, and filter to obtain the accessible transfer center range that matches the display level.

[0008] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of generating the front-end running context based on the display level and the accessible transfer center range is as follows: based on the display level, the accessible transfer center range, the accessible menu information, and the data request parameters, a front-end running context including the current display level, the current area code, the current transfer center code, and the accessible transfer center range is generated.

[0009] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the establishment of the correspondence between the screen rendering data, the front end rendering components, the interaction events, and the message topics includes: mapping map statistical data, core operation monitoring data, abnormal alarm data, and auxiliary display data to the map rendering component, the monitoring display component, the alarm display component, the detail pop-up component, and the auxiliary display component, respectively; mapping the interaction events of level switching, search and positioning, map drill-down, returning to the previous level, and detail viewing to the front end running context update actions; and mapping the business message topics to the front end rendering components to be updated.

[0010] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of forming the current front end rendering state includes: first loading map statistics data, core operation monitoring data, and abnormal alarm data according to the current display level and the accessible transfer center range, and then loading supplementary display data; determining the corresponding map or transfer center real-scene scene according to the current display level, and rendering the screen rendering data to the corresponding front end rendering component; and determining the current display level, the rendered scene objects, and the display content of each front end rendering component as the current front end rendering state.

[0011] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of obtaining business data change information through an interface polling mechanism and a message topic subscription mechanism is as follows: the data refresh range corresponding to the current front end rendering state is determined based on the front end running context; periodic change information in map statistics data, core operation monitoring data, abnormal alarm data, and supplementary display data is obtained through the interface polling mechanism; and high-frequency business data change information corresponding to the front end rendering component to be updated is obtained through the business message topic.

[0012] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of determining the corresponding target display level, target transfer center, or target business object when receiving a user interaction event is as follows: based on the correspondence between the interaction event and the front end running context update action, the target display level or target transfer center is determined when receiving interaction events such as level switching, map drill-down, returning to the previous level, or search and location; and the target business object is determined when receiving a detail viewing interaction event.

[0013] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of generating rendering update instructions based on business data change information, target display level, target transfer center, or target business object is as follows: determine the front end rendering component to be updated based on business data change information, determine the scene object to be switched based on the target display level or target transfer center, and determine the detailed data object to be loaded based on the target business object, so as to generate the corresponding rendering update instructions.

[0014] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the step of performing scene switching, partial data loading, or front end rendering component refresh based on the rendering update command is as follows: switching the national map, provincial map, or real-world scene of the transfer center in the current front end rendering state based on the rendering update command, partially loading the detailed data object, or refreshing the front end rendering component to be updated.

[0015] As a preferred embodiment of the real-time rendering and interaction method for the front end of the digital twin monitoring screen described in this invention, the updated real-time rendering and interaction results of the digital twin monitoring screen are as follows: based on the updated current front end rendering state, the system outputs the component display results of the national map, provincial map, or real-scene scene of the transfer center corresponding to the current display level, as well as map statistical data, core operation monitoring data, abnormal alarm data, and auxiliary display data; when the current front end rendering state includes the display content of the detail pop-up component, the system outputs the detailed data and associated image information corresponding to the target business object in the current digital twin monitoring screen.

[0016] The beneficial effects of this invention are as follows: By uniformly constraining user permissions, display levels, accessible transfer center ranges, data requests, rendering components, interactive events, and message topics through the front-end runtime context, different management roles can obtain monitoring views that match their responsibilities, avoiding inconsistencies in data range, map scenes, and interactive objects; at the same time, by loading large-screen rendering data in stages and combining interface polling, message topic subscription, and rendering update instructions, module-level refresh and local linkage are performed on frequently changing data, reducing first-screen blocking and full-page reload, and improving the real-time response capability, anomaly location efficiency, and interaction continuity of the digital twin monitoring screen. Attached Figure Description

[0017] To more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings used in the following description of the embodiments will be briefly introduced. Obviously, the drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0018] Figure 1 A flowchart illustrating the real-time rendering and interaction methods for the front end of a digital twin monitoring screen. Detailed Implementation

[0019] To make the above-mentioned objects, features and advantages of the present invention more apparent and understandable, the specific embodiments of the present invention will be described in detail below with reference to the accompanying drawings.

[0020] Many specific details are set forth in the following description in order to provide a full understanding of the invention. However, the invention may also be practiced in other ways different from those described herein, and those skilled in the art can make similar extensions without departing from the spirit of the invention. Therefore, the invention is not limited to the specific embodiments disclosed below.

[0021] Secondly, the term "one embodiment" or "embodiment" as used herein refers to a specific feature, structure, or characteristic that may be included in at least one implementation of the present invention. The phrase "in one embodiment" appearing in different places in this specification does not necessarily refer to the same embodiment, nor is it a single or selective embodiment that is mutually exclusive with other embodiments.

[0022] Reference Figure 1 As one embodiment of the present invention, this embodiment provides a method for real-time rendering and interaction of a digital twin monitoring screen front end, including the following steps: S1. Obtain the login user's identity information and organizational permission information, and determine the user's corresponding display level and the scope of the transit centers they can access; Specifically, when a logged-in user accesses the digital twin monitoring screen, the front end obtains the user's identity information and organizational permission information. The identity information includes the user identifier, user role, and affiliated organization identifier. The organizational permission information includes the affiliated organization level, accessible region code, accessible transit center code, and accessible menu information. The front end determines the corresponding display level for the logged-in user based on their affiliated organization level and user role. If the logged-in user has a headquarters management role, the display level is set to the national level, and the accessible transit center range is defined as all transit centers within their authorized scope. If the logged-in user has a regional management role, the display level is set to the provincial level, and the accessible transit center range is defined as all transit centers within the corresponding region. If the logged-in user has a transit center management role, the display level is set to the transit center level, and the accessible transit center range is defined as the transit centers to which the logged-in user belongs or is authorized to manage. After determining the display level and the scope of accessible transit centers, the front-end filters out level switching entries, transit center search results, and transit center access objects that are not within the current user's permission range based on the accessible menu information. This ensures that logged-in users can only access the display level matching their organization's permissions and can only view or select transit centers within their permission range. Through this process, the front-end can determine the default display level and the scope of accessible transit centers when a user enters the digital twin monitoring dashboard, providing a permission foundation for subsequent front-end runtime context generation, loading dashboard rendering data, and executing map scene rendering.

[0023] S2. Generate the front-end running context based on the display level and the scope of accessible transfer centers, and establish the correspondence between large screen rendering data, front-end rendering components, interactive events and message topics; Specifically, after determining the display level and accessible transit center range corresponding to the logged-in user, the front-end uses the display level and accessible transit center range as input to generate a front-end runtime context. The front-end runtime context includes the current display level, current region code, current transit center code, accessible transit center range, accessible menu information, and data request parameters. When the display level is the national level, the front-end sets the current display level to the national level and limits the data request parameters to data from all transit centers within the user's permission range. When the display level is the provincial level, the front-end writes the current region code into the front-end runtime context and limits the data request parameters to data from accessible transit centers within that region. When the display level is the transit center level, the front-end writes the current transit center code into the front-end runtime context and limits the data request parameters to data corresponding to that transit center.

[0024] After generating the front-end runtime context, the front-end establishes a correspondence between the large-screen rendering data and the front-end rendering components. Specifically, map statistics are mapped to the map rendering component; pending unloading / dismantling data, center efficiency data, vehicle loading monitoring data, vehicle departure monitoring data, overdue inventory data, intelligent routing data, personnel attendance data, package creation analysis data, CCR inbound volume data, equipment maintenance data, service quality ranking data, and key performance indicator data of the transfer center are mapped to the corresponding indicator, chart, table, or ranking front-end rendering components; abnormal alarm data are mapped to alarm display components and detail pop-up components; and auxiliary display data are mapped to the front-end rendering components corresponding to the real-scene images of the transfer center, weather information, and warehouse entrances.

[0025] The front-end also establishes a correspondence between interactive events and front-end runtime context update actions. Specifically, the level switching event is mapped to the current display level update action, the province / region search or transit center search event is mapped to the current region code or current transit center code update action, the map drill-down event is mapped to the display level drill-down and data request parameter update action, the return to parent level event is mapped to the display level rollback and data request parameter update action, and the details view event is mapped to the target business object determination and details pop-up component call action.

[0026] The front-end further establishes a mapping between message topics and front-end rendering components. Specifically, message topics related to vehicle loading monitoring, overdue inventory, online users, and key alarms are mapped to corresponding front-end rendering components, so that when data change information for the corresponding message topics is received subsequently, the front-end rendering component that needs to be updated can be determined.

[0027] Through the above processing, the front end converts the display level and accessible transfer center range determined in the previous process into a front end runtime context that can be referenced by subsequent data loading, scene rendering, interactive response and message updates, and forms the basis for the correspondence between large screen rendering data, front end rendering components, interactive events and message topics.

[0028] S3. Load the large screen rendering data in stages based on the front-end running context, and render the large screen rendering data into a national map, provincial map, real scene of the transfer center and corresponding front-end rendering components according to the corresponding relationship, forming the current front-end rendering state. Specifically, after generating the front-end runtime context and establishing the corresponding relationship, the front-end reads the current display level, current region code, current transfer center code, accessible transfer center range, and data request parameters from the front-end runtime context, and uses this to determine the request range of the large screen rendering data.

[0029] When the current display level is the national level, the request scope is the entire network of transit centers within the user's permission range; when the current display level is the provincial level, the request scope is the accessible transit centers within the region corresponding to the current region code; when the current display level is the transit center level, the request scope is the target transit center corresponding to the current transit center code.

[0030] The front-end performs phased data loading based on the request scope. During page initialization or display level switching, the front-end first loads the data for the initial screen, which includes map statistics, total operation data, inbound volume data, outbound volume data, data pending unloading / unloading, center efficiency data, departure monitoring data, and anomaly alarm data. After the main content of the initial screen is rendered, the front-end loads supplementary display data, which includes equipment maintenance data, personnel attendance data, package creation analysis data, CCR inbound volume data, service quality ranking data, key performance indicator data of the transshipment center, as well as real-world images of the transshipment center, weather information, and warehouse entrance information used at the transshipment center level.

[0031] After receiving the data displayed on the first screen, the front end allocates the map statistics data to the map rendering component, the total operation data, the inbound volume data, and the outbound volume data to the statistics display component, the data to be unloaded and dismantled, the center efficiency data, and the departure monitoring data to the corresponding core operation monitoring components, and the abnormal alarm data to the alarm display component, based on the correspondence established in the previous step.

[0032] Subsequently, the front-end performs scene rendering based on the current display level. When the current display level is the national level, the front-end renders a national map, provincial outlines, provincial labels, and transit center locations based on map statistics, and displays the overall network status. When the current display level is the provincial level, the front-end renders a provincial map based on the current region code, and displays the distribution of transit centers and regional statistics within that region. When the current display level is the transit center level, the front-end renders a real-world transit center scene based on the current transit center code, and displays contextualized information corresponding to the target transit center.

[0033] After the initial data display is rendered, the front end continues to receive supplementary display data and renders equipment maintenance data, personnel attendance data, package creation analysis data, CCR inbound volume data, service quality ranking data, and key performance indicator data of the transit center to the corresponding tables, charts, or ranking-type front-end rendering components according to the corresponding relationships. At the transit center level, the real-life images of the transit center, weather information, and warehouse entrance information are rendered to the corresponding auxiliary display components.

[0034] The front-end determines the current front-end rendering state by including the current display level, the current data request range, the rendered map or real-world scene, the display content of each front-end rendering component, and the alarm display content.

[0035] S4. Based on the front-end runtime context, obtain business data change information through interface polling mechanism and message topic subscription mechanism, and determine the corresponding target display level, target transfer center or target business object when receiving user interaction event; Specifically, after the current front-end rendering state is formed, the front-end determines the data refresh range and message subscription range corresponding to the current page based on the front-end runtime context; the data refresh range matches the current display level, the current region code, the current transit center code, and the range of accessible transit centers.

[0036] For data with periodic update characteristics, the front end obtains business data change information through an interface polling mechanism. Data with periodic update characteristics includes map statistics, data to be unloaded and dismantled, center efficiency data, vehicle departure monitoring data, alarm information, personnel attendance data, package creation analysis data, CCR incoming volume data, and equipment maintenance data.

[0037] For data that changes frequently and has high timeliness requirements, the front-end obtains business data change information through a message topic subscription mechanism. Frequently changing data includes vehicle loading monitoring data, overdue inventory data, online user data, and key alarm data. When the front-end receives a real-time message for the corresponding message topic, it determines the business modules and objects that have changed based on the real-time message.

[0038] Furthermore, when the front-end receives a user interaction event, it determines the corresponding target based on the event type. If the user interaction event is a level switching event, map drill-down event, or return-to-parent event, the corresponding target display level is determined; if the user interaction event is a province / region search or transit center search event, the corresponding target region or target transit center is determined; if the user interaction event is a details viewing event, the corresponding target business object is determined. The front-end uses the business data change information, target display level, target region, target transit center, or target business object as the basis for subsequently generating rendering update instructions.

[0039] S5. Generate rendering update instructions based on changes in business data, target display level, target transfer center or target business object, and perform scene switching, partial data loading or front-end rendering component refresh on the current front-end rendering state based on the rendering update instructions. Specifically, after obtaining information on changes in business data, the target display level, the target transfer center, or the target business object, the front end determines the front-end rendering components, scene objects, or data request parameters involved in this update based on the aforementioned established correspondence, and generates a rendering update instruction. The rendering update instruction is used to instruct the front end to perform scene switching, partial data loading, or front-end rendering component refresh based on the current front-end rendering state.

[0040] Furthermore, when a rendering update command is triggered by changes in business data, the front-end determines the front-end rendering component to be updated based on the data type corresponding to the changes. If the changes correspond to map statistics, the map rendering component is refreshed; if they correspond to core operational monitoring data, the corresponding monitoring display component is refreshed; and if they correspond to abnormal alarm data, the alarm display component or any open detail pop-up component is refreshed. In this way, changes in business data only trigger updates to the corresponding components, without reloading the entire digital twin monitoring dashboard.

[0041] When a rendering update command is triggered by the target display level or the target transit center, the frontend updates its runtime context based on the target display level or the target transit center, and performs a scene switch accordingly. If the target display level is the national level, it switches to the national map; if the target display level is the provincial level, it switches to the provincial map; if the target display level is the transit center level, it switches to the target transit center's real-world scene and loads the large-screen rendering data corresponding to that target transit center.

[0042] When a rendering update command is triggered by a target business object, the front end performs partial data loading based on the target business object and renders the loaded detailed data to the details pop-up component. The target business object includes alarm objects, objects to be unloaded or dismantled, vehicle departure warning objects, equipment maintenance objects, or smart routing objects. If the detailed data includes associated image information, the associated image information is displayed in the details pop-up component or image display component.

[0043] After completing the above scene switching, partial data loading, or front-end rendering component refresh, the front-end will write the updated display layer, scene object, front-end rendering component display content, and detail pop-up display content into the current front-end rendering state, which will serve as the basis for subsequent output of real-time rendering and interaction results of the digital twin monitoring screen.

[0044] S6. Output the updated digital twin monitoring screen in real time, including rendering and interactive results.

[0045] Specifically, after the front-end completes scene switching, partial data loading, or front-end rendering component refresh based on rendering update instructions, the front-end reads the updated current front-end rendering state and outputs the real-time rendering and interaction results of the digital twin monitoring screen according to the current front-end rendering state. The real-time rendering and interaction results of the digital twin monitoring screen include a national map, provincial map, or real-scene scene of a transfer center corresponding to the current display level, as well as component display results of map statistical data, core operation monitoring data, abnormal alarm data, and auxiliary display data corresponding to the current display level. When the current display level is the national level or provincial level, the front-end outputs visualization results for displaying the overall network or regional operation status, transfer center distribution, core operation monitoring status, abnormal alarm summary, and service quality ranking; when the current display level is the transfer center level, the front-end outputs visualization results for displaying the target transfer center's real-scene scene, operation status, equipment maintenance, personnel attendance, package creation analysis, key performance indicators of the transfer center, and abnormal alarm details. If the current front-end rendering state includes the display content of a details pop-up component, the front-end outputs the details pop-up component to the current digital twin monitoring dashboard to display the detailed data and associated image information corresponding to the target business object. Through the above processing, the real-time rendering and interaction results output by the front-end can be consistent with the user permissions, current display level, and accessible transfer center range in the front-end runtime context. This allows headquarters management users to view the overall network or regional operational status, anomaly distribution, and indicator benchmarking results, and allows transfer center management users to view the on-site operational status and anomaly details of the target transfer center.

[0046] It should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention and are not intended to limit it. Although the present invention has been described in detail with reference to preferred embodiments, those skilled in the art should understand that modifications or equivalent substitutions can be made to the technical solutions of the present invention without departing from the spirit and scope of the technical solutions of the present invention, and all such modifications or substitutions should be covered within the scope of the claims of the present invention.

Claims

1. A method for real-time rendering and interaction on the front end of a digital twin monitoring screen, characterized in that, include: Obtain the login user's identity information and organizational permission information to determine the user's corresponding display level and the scope of the transit centers they can access; The front-end runtime context is generated based on the display level and the scope of accessible transfer centers, and the correspondence between large screen rendering data, front-end rendering components, interactive events and message topics is established. Based on the front-end runtime context, the large screen rendering data is loaded in stages, and the large screen rendering data is rendered into a national map, provincial map, real scene of the transfer center and corresponding front-end rendering components according to the corresponding relationship, forming the current front-end rendering state. Based on the front-end runtime context, business data change information is obtained through interface polling mechanism and message topic subscription mechanism, and the corresponding target display level, target transfer center or target business object is determined when a user interaction event is received; Based on changes in business data, target display level, target transfer center or target business object, a rendering update instruction is generated, and based on the rendering update instruction, scene switching, partial data loading or front-end rendering component refresh is performed on the current front-end rendering state. Output the updated digital twin monitoring screen in real time, including rendering and interactive results.

2. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 1, characterized in that: The process of obtaining the login user's identity information and organizational permission information, and determining the user's corresponding display level and the range of accessible transit centers, involves: determining the login user's national level, provincial level, or transit center level based on the login user's user role, organizational level, and accessible menu information, and filtering to obtain the range of accessible transit centers that match the display level.

3. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 2, characterized in that: The step of generating a front-end runtime context based on the display level and the range of accessible transit centers is as follows: Based on the display level, the range of accessible transit centers, accessible menu information, and data request parameters, a front-end runtime context is generated that includes the current display level, the current region code, the current transit center code, and the range of accessible transit centers.

4. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 3, characterized in that: The process of establishing the correspondence between large-screen rendering data, front-end rendering components, interactive events, and message topics includes: mapping map statistics data, core operation monitoring data, abnormal alarm data, and auxiliary display data to map rendering components, monitoring display components, alarm display components, detail pop-up components, and auxiliary display components, respectively; mapping level switching, search and location, map drill-down, return to the previous level, and detail viewing interactive events to front-end runtime context update actions; and mapping business message topics to the front-end rendering components to be updated.

5. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 4, characterized in that: The process of forming the current front-end rendering state includes: first loading map statistics data, core operation monitoring data, and abnormal alarm data based on the current display level and the accessible transfer center range, and then loading supplementary display data; determining the corresponding map or transfer center real-world scene according to the current display level, and rendering the large screen rendering data to the corresponding front-end rendering component; and determining the current display level, the rendered scene objects, and the display content of each front-end rendering component as the current front-end rendering state.

6. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 5, characterized in that: The process of obtaining business data change information through the interface polling mechanism and message topic subscription mechanism is as follows: Based on the front-end running context, the data refresh range corresponding to the current front-end rendering state is determined; the periodic change information in map statistics data, core operation monitoring data, abnormal alarm data and supplementary display data is obtained through the interface polling mechanism; and the high-frequency business data change information corresponding to the front-end rendering component to be updated is obtained through the business message topic.

7. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 6, characterized in that: The step of determining the corresponding target display level, target transfer center, or target business object when receiving a user interaction event is as follows: based on the correspondence between the interaction event and the front-end running context update action, the target display level or target transfer center is determined when receiving interaction events such as level switching, map drill-down, returning to the previous level, or search and location; and the target business object is determined when receiving interaction events such as details viewing.

8. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 7, characterized in that: The process of generating rendering update instructions based on changes in business data, target display level, target transfer center, or target business object involves: determining the front-end rendering component to be updated based on changes in business data, determining the scene object to be switched based on the target display level or target transfer center, and determining the detailed data object to be loaded based on the target business object, in order to generate the corresponding rendering update instructions.

9. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 8, characterized in that: The process of performing scene switching, partial data loading, or front-end rendering component refresh based on rendering update instructions in the current front-end rendering state is as follows: switching the national map, provincial map, or real-world scene of the transfer center in the current front-end rendering state based on rendering update instructions, partially loading detailed data objects, or refreshing the front-end rendering components to be updated.

10. The real-time rendering and interaction method for the front end of a digital twin monitoring screen as described in claim 9, characterized in that: The updated real-time rendering and interaction results of the digital twin monitoring screen are as follows: based on the updated current front-end rendering state, output the national map, provincial map or real-scene scene of the transfer center corresponding to the current display level, as well as the component display results of map statistical data, core operation monitoring data, abnormal alarm data and auxiliary display data; when the current front-end rendering state includes the display content of the detail pop-up component, output the detailed data and associated image information corresponding to the target business object in the current digital twin monitoring screen.

Images