Visual large screen development method and system based on multi-modal large model

Through the multimodal large-scale model visualization large-screen development method, the bottlenecks of demand conversion and data processing in existing tools are solved, and fast and flexible visualization large-screen development is achieved. It supports multiple input forms and dynamic data adaptation, and improves development efficiency and result consistency.

CN120743265APending Publication Date: 2025-10-03SHANDONG LANGCHAO YUNTOU INFORMATION TECH CO LTD
View PDF 0 Cites 4 Cited by

Patent Information

Application Number
CN202510648582.2
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-05-20
Publication Date
2025-10-03

AI Technical Summary

Technical Problem

Existing visualization large-screen development tools have problems such as cognitive gap in demand conversion, single modal processing, and coupling of dynamic data access and style configuration, making it difficult to meet the integration needs of data narrative, interactive experience and aesthetic design in modern business scenarios.

Method used

It adopts a visual large-screen development method based on a multimodal large model, analyzes user needs through a multimodal input gateway, and combines an intelligent generation engine, a visual orchestration module, and a configuration management module to achieve multi-dimensional generation and dynamic expansion. It supports data processing and real-time layout optimization in various input forms, and provides style management and performance monitoring.

Benefits of technology

It achieves rapid transformation of user needs, generates visualization solutions that are both functionally complete and aesthetically consistent, shortens development cycles, supports dynamic data adaptation and real-time interaction, and reduces maintenance costs.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120743265A_ABST
    Figure CN120743265A_ABST
Patent Text Reader

Abstract

The invention relates to the technical field of artificial intelligence, in particular to a visual large screen development method and system based on a multi-modal large model, and the method comprises the following steps: a demand analysis step, an intelligent generation step, a visual arrangement step, a configuration management step and an operation support step. The method has the beneficial effects that the system can synchronously analyze natural language instructions, business data parameters and visual reference examples through a multi-modal semantic alignment engine, and a design scheme with both function completeness and aesthetic consistency is generated. In scenes of smart city situation awareness, industrial equipment real-time monitoring and the like, a user only needs to input demand descriptions of'displaying energy consumption trends and abnormal point locations of all regions in recent half a year 'and the like, a complete large screen scheme including a thermodynamic map, a time sequence broken line graph and a 3D alarm mark can be automatically generated, and the development period is shortened by more than 70% compared with a traditional mode.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of artificial intelligence technology, and in particular to a method and system for developing a large-scale visualization screen based on a multimodal large model. Background Art

[0002] In the development of data visualization technology, the emergence of multimodal intelligent generation technology marks a new stage in the industry's evolution. Early visualization development tools primarily catered to single-dimensional needs: traditional design tools relied on manual arrangement of each visual element, and while low-code platforms offered component-based building capabilities, they were still limited to the mechanical combination of pre-set templates. This one-dimensional development model struggled to meet the demands of modern business scenarios for integrating data storytelling, interactive experience, and aesthetic design. As the human-computer interaction paradigm evolves towards naturalization and intelligence, users expect to rapidly transform ideas into finished products through more intuitive multimodal expression.

[0003] The current development of large-scale visualization screens faces significant technical bottlenecks: First, there is a cognitive gap in the demand conversion process, making it difficult for business personnel to accurately convey design intent, and developers often fall into a cycle of repeated revisions; second, existing intelligent generation systems often focus on single-modal processing, or only realize automatic chart generation while ignoring overall visual coordination, or focus on layout algorithms while lacking business semantic understanding; third, dynamic data access is highly coupled with style configuration, and visual parameters need to be readjusted when modifying the data source, resulting in high maintenance costs. Summary of the Invention

[0004] The purpose of the present invention is to provide a method and system for developing a large-scale visualization screen based on a multimodal large model to solve the problems raised in the above-mentioned background technology.

[0005] To achieve the above object, the present invention provides the following technical solution: a method for developing a large-scale visualization screen based on a multimodal large model, comprising the following steps:

[0006] Requirements parsing steps: The requirements parsing module serves as the first processing level of the system, parsing user requirements into structured semantics. The multimodal input gateway uses standardized interfaces to receive data streams from heterogeneous input sources such as text, voice, and images. The text input parser adopts a layered processing strategy, automatically extracting structured tags from Markdown-formatted input and initiating a semantic segmentation algorithm for natural language descriptions to identify business entities and operational instructions. The speech-to-text engine integrates the ASR service to achieve real-time voice stream conversion, triggering sentence segmentation when silence exceeds 500ms. The input validator uses a preset rule engine to scan for missing required fields. If a key parameter is detected to be missing, it immediately triggers a real-time feedback mechanism to highlight guidance information in the user interface.

[0007] Intelligent Generation Step: The intelligent generation engine module generates business-adaptive visualization solutions based on the structured semantics obtained by the demand analysis module. This module has multi-dimensional generation capabilities, simultaneously outputting background images, chart components, and layout solutions, ensuring functional and aesthetic consistency. It also has a dynamically scalable architecture that supports domain knowledge injection and lightweight model fine-tuning to adapt to the needs of different industry scenarios.

[0008] Visual Orchestration Steps: The visual orchestration module serves as the core interface for optimizing interaction between users and system-generated solutions. A front-end interactive layer is used to build a drag-and-drop editor based on React / Vue. WebGL is used for accelerated rendering, supporting dynamic loading of 100,000 component instances. Multiple charts / 3D components are encapsulated, and standardized property panels are provided. Redux is used to maintain the component tree, data mapping relationships, and operation history stacks. At the layout engine level, real-time layout calculations are implemented based on mechanical simulation algorithms and constraint solvers. The separating axis theorem is used to calculate the intersection of component bounding boxes in real time, marking overlapping areas with red warnings. Detecting component position conflicts for two consecutive seconds triggers the mechanical model to recalculate the layout.

[0009] Configuration management steps: The configuration management module provides users with style management and unified interface gateway-related functions. The style governance center deeply binds CSS variables with business semantics through the design of a token system. The unified interface gateway uses protocol conversion middleware to implement intelligent routing of data pipelines and execute corresponding routing logic based on different protocols.

[0010] Operation support steps: The operation support module generates relevant program deployment packages and iteration management, and provides real-time monitoring of the system in two dimensions: performance and security. The deployment package includes a visual description file, data pipeline configuration, runtime engine, and dependency environment list. When abnormal indicators are detected, the system initiates root cause correlation analysis and automatically takes relevant measures to ensure the safe operation of the system.

[0011] Preferably, in the intelligent generation step, the specific method of background image generation is: converting the user's structured needs into a generative prompt, and the large model outputs the relevant background image based on the prompt; the specific process of the layout optimization algorithm is: partitioning the canvas, dividing the canvas area according to the component importance weight, listing the components in sequence according to user requirements and applying the ForceAtlas2 algorithm to simulate the attraction and repulsion between components, eliminating the overlap between components and optimizing the spacing, and finally calculating the information density entropy value of the layout, adjusting the component position through gradient descent, and ensuring that the visual focus is concentrated; the specific method of dynamic scalability design is: providing a plug-in architecture, supporting plug-and-play of new generation modules, communicating with the main engine through the gRPC interface, and supporting the use of YAML files for configuration management, which is convenient for defining model parameters, generation strategies and resource quotas.

[0012] Preferably, in the configuration management step, the protocol conversion middleware of the unified interface gateway implements the logic of intelligent routing of data pipelines as follows: receive requests and detect request protocols; if the protocol is MQTT, the real-time data stream is preferentially connected to the motion effect engine and sent to the specified topic through KafkaProducer; if the protocol is REST, check whether the request header contains 'X-Theme-Version', if it does, route the theme-related metadata to the style center and update it through ThemeService; if it does not, forward the business data to the sandbox or production environment and distribute it through DataRouter; if the protocol is WebSocket, enable differential updates for long connection data, and process the request stream through DiffEngine.

[0013] Preferably, in the operation support step, the specific composition of the deployment package is as follows:

[0014] Visual description file: records component layout, style parameters and interaction logic based on JSONSchema; data pipeline configuration: defines data source connection credentials, conversion rules and refresh strategies; runtime engine: integrates WebGL rendering core and data-driven update module; dependency environment list: declares the third-party library versions required for operation.

[0015] Preferably, in the operation support step, the self-healing process is as follows: anomaly detection: marking the abnormal event level (P0-P3) by monitoring the pipeline; root cause analysis: calling the AI ​​operation and maintenance model to locate the fault module; policy execution: selecting the repair action according to the predefined policy library and recording the self-healing log.

[0016] A system for developing a large-screen visualization based on a multimodal large model, comprising:

[0017] Demand parsing module: As the first processing level of the system, it is used to parse user needs into structured semantics; this module includes a multimodal input gateway, a text input parser, a speech-to-text engine, and an input validator; the multimodal input gateway receives data streams from heterogeneous input sources such as text, voice, and images through a standardized interface; the text input parser adopts a layered processing strategy, automatically extracts structured tags from Markdown format input, and initiates a semantic segmentation algorithm for natural language descriptions to identify business entities and operation instructions; the speech-to-text engine integrates the ASR service to achieve real-time voice stream conversion, triggering sentence segmentation processing when the silence period exceeds 500ms; the input validator scans for missing required fields through a preset rule engine. If a key parameter is detected to be missing, it immediately triggers a real-time feedback mechanism to highlight guidance information in the user interface;

[0018] Intelligent Generation Engine Module: As a key module of the system, it is used to generate business-adaptive visualization solutions based on the structured semantics obtained by the Demand Analysis Module. This module has multi-dimensional generation capabilities and a dynamically scalable architecture. The multi-dimensional generation capabilities simultaneously output background images, chart components, and layout solutions, ensuring the unity of functionality and aesthetics. The dynamically scalable architecture supports domain knowledge injection and lightweight model fine-tuning to adapt to the needs of different industry scenarios.

[0019] Visual Orchestration Module: Serving as the core interface for optimizing interaction between users and system-generated solutions, it includes a front-end interaction layer and a layout engine layer. The front-end interaction layer uses React / Vue to build a drag-and-drop editor, employs WebGL for accelerated rendering, supports dynamic loading of 100,000 component instances, encapsulates a variety of charts / 3D components, and provides standardized property panels. It maintains the component tree, data mapping relationships, and operation history stack through Redux. The layout engine layer implements real-time layout calculations based on mechanical simulation algorithms and constraint solvers. It uses the separating axis theorem to calculate the intersection of component bounding boxes in real time, marking overlapping areas with red warnings. If a component position conflict is detected for two consecutive seconds, the mechanical model is triggered to recalculate the layout.

[0020] Configuration Management Module: This module provides users with style management and unified interface gateway-related functions. The style governance center deeply binds CSS variables with business semantics through the design of a token system. The unified interface gateway uses protocol conversion middleware to implement intelligent routing of data pipelines and execute corresponding routing logic based on different protocols.

[0021] Operation support module: used to generate relevant program deployment packages and iteration management, and provide real-time performance-security dual-dimensional monitoring for the system; when abnormal indicators are detected, the system initiates root cause correlation analysis and automatically takes relevant measures to ensure the safe operation of the system; the deployment package includes a visual description file, data pipeline configuration, runtime engine and dependency environment list; it also has a self-healing process, including anomaly detection, root cause analysis and policy execution.

[0022] Preferably, in the intelligent generation engine module:

[0023] Background image generation: Convert the user's structured requirements into generative prompts, and the large model outputs relevant background images based on the prompts;

[0024] Layout Optimization Algorithm: The canvas is partitioned and divided according to component importance. Components are listed in order according to user requirements and the ForceAtlas2 algorithm is applied to simulate the attraction and repulsion between components. This eliminates component overlap and optimizes spacing. Finally, the information density entropy of the layout is calculated and component positions are adjusted using gradient descent to ensure visual focus.

[0025] Dynamic scalability design: Provides a plug-in architecture that supports plug-and-play of new generation modules and communicates with the main engine through the gRPC interface. It also supports configuration management using YAML files to facilitate the definition of model parameters, generation strategies, and resource quotas.

[0026] Preferably, in the configuration management module, the protocol conversion middleware of the unified interface gateway implements the logic of intelligent routing of data pipelines as follows:

[0027] Receive the request and detect the request protocol;

[0028] If the protocol is MQTT, the real-time data stream is first connected to the animation engine and sent to the specified topic through KafkaProducer;

[0029] If the protocol is REST, check whether the request header contains 'X-Theme-Version'. If so, route the theme-related metadata to the style center and update it through the ThemeService. If not, forward the business data to the sandbox or production environment and distribute it through the DataRouter.

[0030] If the protocol is WebSocket, differential updates are enabled for persistent connection data, and the request stream is processed through DiffEngine.

[0031] Preferably, in the operation support module, the specific composition of the deployment package is as follows:

[0032] Visual description file: records component layout, style parameters and interaction logic based on JSONSchema;

[0033] Data pipeline configuration: defines data source connection credentials, transformation rules, and refresh strategies;

[0034] Runtime engine: integrated WebGL rendering core and data-driven update module;

[0035] Dependency list: declares the versions of third-party libraries required for running.

[0036] Preferably, in the operation support module, the self-healing process is as follows:

[0037] Anomaly detection: Marking abnormal event levels (P0-P3) by monitoring the pipeline;

[0038] Root cause analysis: Call the AI ​​operation and maintenance model to locate the fault module;

[0039] Policy execution: Selects repair actions based on the predefined policy library and records self-healing logs.

[0040] Compared with the prior art, the present invention has the following beneficial effects:

[0041] This paper proposes a method and system for developing large-scale visualization screens based on a multimodal large model. Using a multimodal semantic alignment engine, the system simultaneously parses natural language instructions, business data parameters, and visual reference examples to generate design solutions that combine functional completeness with aesthetic consistency. In scenarios such as smart city situational awareness and real-time monitoring of industrial equipment, users simply need to enter a requirement such as "displaying energy consumption trends and anomaly points by region over the past six months" to automatically generate a complete large-scale screen solution complete with heat maps, time-series line charts, and 3D alarm markers. This reduces the development cycle by over 70% compared to traditional methods.

[0042] Based on a dynamic data response mechanism, large-screen components automatically adapt to changes in data source structure. For example, when a business metric expands from "equipment failure rate" to "repair response time," the system intelligently recommends adding new statistical cards and comparative bar charts while maintaining the consistency of the original layout style. At the interactive level, the drag-and-drop editor supports pixel-level layout adjustments and real-time data previews. For example, users can zoom in and out to adjust the hierarchy of map components and simultaneously view data rendering effects at different time granularities, completely breaking the traditional "design-development" gap. BRIEF DESCRIPTION OF THE DRAWINGS

[0043] Figure 1 Flow chart of the method of the present invention;

[0044] Figure 2 This is a system block diagram of the present invention. DETAILED DESCRIPTION

[0045] In order to clearly and completely describe the objectives and technical solutions of the present invention and make the advantages more clearly understood, the embodiments of the present invention are further described in detail below with reference to the accompanying drawings. It should be understood that the specific embodiments described herein are part of the embodiments of the present invention, not all of them, and are only used to explain the embodiments of the present invention, not to limit the embodiments of the present invention. All other embodiments obtained by ordinary technicians in this field without making creative efforts are within the scope of protection of the present invention.

[0046] For example 1, please refer to Figure 1 The present invention provides a technical solution: a method for developing a large-scale visualization screen based on a multimodal large model. Taking the development scenario of a large-scale visualization screen for a smart city command as an example, the use process of the large-scale visualization screen development device based on the multimodal large model is as follows:

[0047] (1) Multimodal large model pre-training and domain adaptation

[0048] Prepare training data containing millions of triples (requirement description-design prototype-data mapping relationship) and adopt a two-stage training strategy:

[0049] 1. Basic training: Build a text-chart-layout cross-modal alignment engine based on the CLIP architecture, and use public datasets (such as Table2Charts and ECharts case library) for pre-training.

[0050] 2. Domain fine-tuning: Inject the knowledge graph of the transportation domain (including road network topology, traffic event classification system, etc.) and use the LoRA method to efficiently fine-tune the parameters of the generation module.

[0051] (2) Multimodal demand analysis and initial solution generation

[0052] 1. User input requirement: "Display the congestion index of each main road during the morning rush hour, highlighting sections with high accident rates."

[0053] 2. The system performs the following operations: First, text parsing extracts key entities: morning rush hour, main roads, congestion index, and accident hotspots. Second, data matching automatically links the traffic flow sensor database (sampling frequency 5 minutes) with the 110 emergency call database. Third, visual generation outputs three candidate solutions (heat map matrix, 3D road network situation map, and time series comparison panel).

[0054] (3) Interactive visual orchestration and intelligent optimization

[0055] Interactive visual orchestration and intelligent optimization can mainly perform drag-and-drop operations, intelligent optimization, data binding and other related operations.

[0056] Drag operation: Move the accident marker layer from the legend area on the right to the main view floating panel.

[0057] Intelligent optimization: After the system detects layout imbalance, it automatically adjusts the proportion of map components from 70% to 65%, and adds a dynamic folding function for statistics cards.

[0058] Data binding: Use the SQL expression editor to define the warning rule "congestion threshold = historical mean + 2σ".

[0059] (4) Dynamic data pipeline configuration and effect verification

[0060] Configure real-time data source: access traffic flow API (Restful interface, QPS ≥ 200).

[0061] Stress test: simulates 100 concurrent data injections to verify that the large-screen rendering frame rate is stable above 30fps.

[0062] (5) Deployment package generation and iteration management

[0063] Output executable package and data interface description file (OpenAPI 3.0 specification).

[0064] Establish a version control system. When the program changes, the affected components are automatically synchronized through the difference comparison tool.

[0065] Example 2, refer to the attached Figure 2 Based on the first embodiment, a system for developing a large-screen visualization based on a multimodal large model is proposed, including:

[0066] 1. Requirements analysis module

[0067] The demand parsing module is the first processing level of the system, responsible for parsing user needs into structured semantics.

[0068] The multimodal input gateway receives data streams from heterogeneous input sources such as text, voice, and images through standardized interfaces. The text input parser adopts a layered processing strategy: it automatically extracts structured tags (such as requirement priority) for Markdown-formatted input, and initiates a semantic segmentation algorithm for natural language descriptions to identify business entities and operational instructions. At the same time, the speech-to-text engine achieves real-time voice stream conversion by integrating ASR services (such as WebRTC VAD endpoint detection), triggering sentence segmentation processing when the silence segment exceeds 500ms to ensure the integrity of the semantic paragraph. At this time, the input validator initiates the first round of integrity checks: it scans for missing required fields (such as unspecified time ranges or geographic dimensions) through a preset rule engine (such as Drools). If a key parameter is detected to be missing, the real-time feedback mechanism is immediately triggered - the guidance message "Please supplement the time period parameters" is highlighted on the user interface.

[0069] 2. Intelligent generation engine module

[0070] The intelligent generation engine module, a critical component of the system, is responsible for generating business-adaptive visualization solutions based on the structured semantics of user requirements generated by the requirements analysis module. This module requires multi-dimensional generation capabilities and a dynamically scalable architecture. These capabilities must simultaneously output background images, chart components, and layout solutions while ensuring functional and aesthetic consistency. The dynamically scalable architecture must support domain knowledge infusion and lightweight model fine-tuning to adapt to the needs of diverse industry scenarios.

[0071] Background image generation requires converting the user's structured requirements into generative prompts, and the large model outputs relevant background images based on the prompts.

[0072] The layout optimization algorithm partitions the canvas based on component importance weights (core graphics = 0.8, auxiliary components = 0.3). Components are then sorted according to user requirements and the ForceAtlas2 algorithm is applied to simulate the attraction and repulsion between components, eliminating overlap and optimizing spacing. Finally, the information density entropy of the layout is calculated, and component positions are adjusted using gradient descent to ensure visual focus.

[0073] Dynamic scalability requires a plug-in architecture that supports plug-and-play deployment of new build modules and communicates with the main engine via the gRPC interface. It also supports configuration management using YAML files to facilitate the definition of model parameters, build strategies, and resource quotas.

[0074] 3. Visual orchestration module

[0075] The visual layout module is the core interface for users to interact and optimize system-generated solutions. Its core technical goal is to reduce the complexity of manual operations through real-time layout conflict detection and style recommendation algorithms.

[0076] At the front-end interaction layer, a drag-and-drop editor is built based on React / Vue, using WebGL to accelerate rendering and support dynamic loading of 100,000 component instances; it encapsulates chart / 3D components such as ECharts, AntV, and Three.js, and provides a standardized property panel; at the same time, Redux is used to maintain the component tree, data mapping relationship, and operation history stack.

[0077] At the layout engine level, real-time layout calculations are implemented based on a force-directed layout algorithm and a constraint solver (Cassowary). The Separating Axis Theorem (SAT) is used to calculate the intersection of component bounding boxes in real time, marking overlapping areas with red warnings. If component position conflicts are detected for two consecutive seconds, the force model is triggered to recalculate the layout.

[0078] 4. Configuration Management Module

[0079] The configuration management module provides users with features such as style management and a unified interface gateway. The style governance center uses a token system to deeply bind CSS variables to business semantics. For example, defining --color-sales:#4CAF50 maps to the "sales" field in the data.

[0080] The unified interface gateway uses protocol conversion middleware to implement intelligent routing of data pipelines. The core routing logic is as follows.

[0081] def route_data(request):

[0082] protocol=detect_protocol(request)

[0083] if protocol == 'MQTT':

[0084] #Real-time data streams are prioritized for access to the animation engine

[0085] return KafkaProducer.send(topic='realtime',data=decode_mqtt(request))

[0086] elif protocol == 'REST':

[0087] if'X-Theme-Version'in request.headers:

[0088] #Theme related metadata is routed to the style center

[0089] return ThemeService.update(request.json)

[0090] else:

[0091] #Forward business data to the sandbox or production environment

[0092] return DataRouter.dispatch(request)

[0093] elif protocol=='WebSocket':

[0094] #Enable differential updates for long connection data

[0095] return DiffEngine.process(request.stream)

[0096] 5. Operation support module

[0097] The operation support module generates relevant program deployment packages and manages iterations. The system also provides real-time monitoring of both performance and security, ensuring the smooth operation of the entire system. When an abnormal metric is detected (such as a sudden increase in the rendering time of a component), the system initiates root cause correlation analysis and automatically takes appropriate measures to ensure safe system operation.

[0098] The deployment package consists of the following:

[0099] Visual description file (dashboard.json): records component layout, style parameters, and interaction logic based on JSON Schema;

[0100] Data pipeline configuration (pipeline.yaml): defines data source connection credentials (such as API keys), transformation rules (such as SQL expressions), and refresh strategies (polling intervals, streaming windows).

[0101] Runtime engine: integrated WebGL rendering core (based on Three.js optimization) and data-driven update module (supporting virtual DOM differential calculation).

[0102] Dependency list: declares the third-party library versions required for running (such as ECharts 5.4+, AntV G64.8+).

[0103] The self-healing process is as follows:

[0104] Anomaly detection: Mark abnormal event levels (P0-P3) by monitoring the pipeline.

[0105] Root cause analysis: Call AI operation and maintenance models (such as decision tree classifiers) to locate the faulty module.

[0106] Policy execution: Selects repair actions based on the predefined policy library and records self-healing logs.

[0107] While embodiments of the present invention have been shown and described, it will be appreciated by those skilled in the art that various changes, modifications, substitutions, and variations may be made to these embodiments without departing from the principles and spirit of the invention, and that the scope of the invention is defined by the appended claims and their equivalents.

Claims

1. A method for developing a large-scale visualization screen based on a multimodal large model, characterized by: The following steps are involved: Requirements parsing steps: The requirements parsing module serves as the first processing level of the system, parsing user requirements into structured semantics. The multimodal input gateway uses standardized interfaces to receive data streams from heterogeneous input sources such as text, voice, and images. The text input parser adopts a layered processing strategy, automatically extracting structured tags from Markdown-formatted input and initiating a semantic segmentation algorithm for natural language descriptions to identify business entities and operational instructions. The speech-to-text engine integrates the ASR service to achieve real-time voice stream conversion, triggering sentence segmentation when silence exceeds 500ms. The input validator uses a preset rule engine to scan for missing required fields. If a key parameter is detected to be missing, it immediately triggers a real-time feedback mechanism to highlight guidance information in the user interface. Intelligent Generation Step: The intelligent generation engine module generates business-adaptive visualization solutions based on the structured semantics obtained by the demand analysis module. This module has multi-dimensional generation capabilities, simultaneously outputting background images, chart components, and layout solutions, ensuring functional and aesthetic consistency. It also has a dynamically scalable architecture that supports domain knowledge injection and lightweight model fine-tuning to adapt to the needs of different industry scenarios. Visual Orchestration Steps: The visual orchestration module serves as the core interface for optimizing interaction between users and system-generated solutions. A front-end interactive layer is used to build a drag-and-drop editor based on React / Vue. WebGL is used for accelerated rendering, supporting dynamic loading of 100,000 component instances. Multiple charts / 3D components are encapsulated, and standardized property panels are provided. Redux is used to maintain the component tree, data mapping relationships, and operation history stacks. At the layout engine level, real-time layout calculations are implemented based on mechanical simulation algorithms and constraint solvers. The separating axis theorem is used to calculate the intersection of component bounding boxes in real time, marking overlapping areas with red warnings. Detecting component position conflicts for two consecutive seconds triggers the mechanical model to recalculate the layout. Configuration management steps: The configuration management module provides users with style management and unified interface gateway-related functions. The style governance center deeply binds CSS variables with business semantics through the design of a token system. The unified interface gateway uses protocol conversion middleware to implement intelligent routing of data pipelines and execute corresponding routing logic based on different protocols. Operation support steps: The operation support module generates relevant program deployment packages and iteration management, and provides real-time monitoring of the system in two dimensions: performance and security. The deployment package includes a visual description file, data pipeline configuration, runtime engine, and dependency environment list. When abnormal indicators are detected, the system initiates root cause correlation analysis and automatically takes relevant measures to ensure the safe operation of the system.

2. The method for developing a large-scale visualization screen based on a multimodal large model according to claim 1, characterized in that: In the intelligent generation step, the specific method of background image generation is: converting the user's structured requirements into a generative prompt, and the large model outputs the relevant background image based on the prompt; the specific process of the layout optimization algorithm is: partitioning the canvas, dividing the canvas area according to the component importance weight, listing the components in sequence according to user requirements and applying the ForceAtlas2 algorithm to simulate the attraction and repulsion between components, eliminating overlap between components and optimizing spacing, and finally calculating the information density entropy value of the layout, adjusting the component position through gradient descent to ensure visual focus; the specific method of dynamic scalability design is: providing a plug-in architecture, supporting plug-and-play of new generation modules, communicating with the main engine through the gRPC interface, and supporting the use of YAML files for configuration management, which facilitates the definition of model parameters, generation strategies and resource quotas.

3. The method for developing a large-scale visualization screen based on a multimodal large model according to claim 2, characterized in that: In the configuration management step, the protocol conversion middleware of the unified interface gateway implements the following logic for intelligent routing of data pipelines: receiving requests and detecting the request protocol; if the protocol is MQTT, the real-time data stream is preferentially connected to the animation engine and sent to the specified topic through KafkaProducer; if the protocol is REST, check whether the request header contains 'X-Theme-Version'. If so, the theme-related metadata is routed to the style center and updated through ThemeService; if not, the business data is forwarded to the sandbox or production environment and distributed through DataRouter; if the protocol is WebSocket, differential updates are enabled for long connection data, and the request stream is processed through DiffEngine.

4. The method for developing a large-scale visualization screen based on a multimodal large model according to claim 3, characterized in that: In the run support step, the specific composition of the deployment package is as follows: Visual description file: records component layout, style parameters and interaction logic based on JSONSchema; data pipeline configuration: defines data source connection credentials, conversion rules and refresh strategies; runtime engine: integrates WebGL rendering core and data-driven update module; Dependency list: declares the versions of third-party libraries required for running.

5. The method for developing a large-scale visualization screen based on a multimodal large model according to claim 4, characterized in that: In the operation support step, the self-healing process is as follows: anomaly detection: marking the abnormal event level (P0-P3) through the monitoring pipeline; root cause analysis: calling the AI ​​operation and maintenance model to locate the fault module; policy execution: selecting repair actions according to the predefined policy library and recording self-healing logs.

6. A system for the method for developing a large-scale visualization screen based on a multimodal large model according to claim 5, characterized in that: include: Requirements parsing module: As the first processing level of the system, it is used to parse user requirements into structured semantics; This module includes a multimodal input gateway, a text input parser, a speech-to-text engine, and an input validator. The multimodal input gateway receives data streams from heterogeneous input sources such as text, speech, and images through a standardized interface. The text input parser uses a layered processing strategy to automatically extract structured tags from Markdown-formatted input and initiates a semantic segmentation algorithm to identify business entities and operational instructions for natural language descriptions. The speech-to-text engine integrates the ASR service to achieve real-time voice stream conversion, triggering sentence segmentation when silence exceeds 500ms. The input validator uses a preset rule engine to scan for missing required fields. If a key parameter is missing, it immediately triggers a real-time feedback mechanism to highlight guidance information in the user interface. Intelligent Generation Engine Module: As a key module of the system, it is used to generate a visual solution for business adaptation based on the structured semantics obtained by the demand analysis module. This module has multi-dimensional generation capabilities and a dynamically scalable architecture. Multi-dimensional generation capabilities simultaneously output background images, chart components, and layout solutions, ensuring the unity of functionality and aesthetics. The dynamically scalable architecture supports domain knowledge injection and lightweight model fine-tuning to adapt to the needs of different industry scenarios. Visual Orchestration Module: Serving as the core interface for optimizing interaction between users and system-generated solutions, it includes a front-end interaction layer and a layout engine layer. The front-end interaction layer uses React / Vue to build a drag-and-drop editor, employs WebGL for accelerated rendering, supports dynamic loading of 100,000 component instances, encapsulates a variety of charts / 3D components, and provides standardized property panels. It maintains the component tree, data mapping relationships, and operation history stack through Redux. The layout engine layer implements real-time layout calculations based on mechanical simulation algorithms and constraint solvers. It uses the separating axis theorem to calculate the intersection of component bounding boxes in real time, marking overlapping areas with red warnings. If a component position conflict is detected for two consecutive seconds, the mechanical model is triggered to recalculate the layout. Configuration Management Module: This module provides users with style management and unified interface gateway-related functions. The style governance center deeply binds CSS variables with business semantics through the design of a token system. The unified interface gateway uses protocol conversion middleware to implement intelligent routing of data pipelines and execute corresponding routing logic according to different protocols; Operation support module: used to generate relevant program deployment packages and iteration management, and provide real-time performance-security dual-dimensional monitoring for the system; when abnormal indicators are detected, the system initiates root cause correlation analysis and automatically takes relevant measures to ensure the safe operation of the system; the deployment package includes a visual description file, data pipeline configuration, runtime engine and dependency environment list; it also has a self-healing process, including anomaly detection, root cause analysis and policy execution.

7. A system according to claim 6, characterized in that: In the Smart Generation Engine module: Background image generation: Convert the user's structured requirements into generative prompts, and the large model outputs relevant background images based on the prompts; Layout Optimization Algorithm: The canvas is partitioned and divided according to component importance. Components are listed in order according to user requirements and the ForceAtlas2 algorithm is applied to simulate the attraction and repulsion between components. This eliminates component overlap and optimizes spacing. Finally, the information density entropy of the layout is calculated and component positions are adjusted using gradient descent to ensure visual focus. Dynamic scalability design: Provides a plug-in architecture that supports plug-and-play of new generation modules and communicates with the main engine through the gRPC interface. It also supports configuration management using YAML files to facilitate the definition of model parameters, generation strategies, and resource quotas.

8. A system according to claim 7, characterized in that: In the configuration management module, the protocol conversion middleware of the unified interface gateway implements the following logic for intelligent data pipeline routing: Receive the request and detect the request protocol; If the protocol is MQTT, the real-time data stream is first connected to the animation engine and sent to the specified topic through KafkaProducer; If the protocol is REST, check whether the request header contains 'X-Theme-Version'. If so, route the theme-related metadata to the style center and update it through the ThemeService. If not, forward the business data to the sandbox or production environment and distribute it through the DataRouter. If the protocol is WebSocket, differential updates are enabled for persistent connection data, and the request stream is processed through DiffEngine.

9. A system according to claim 8, characterized in that: In the operation support module, the specific composition of the deployment package is as follows: Visual description file: records component layout, style parameters and interaction logic based on JSONSchema; Data pipeline configuration: defines data source connection credentials, transformation rules, and refresh strategies; Runtime engine: integrated WebGL rendering core and data-driven update module; Dependency list: declares the versions of third-party libraries required for running.

10. A system according to claim 9, characterized in that: In the operation support module, the self-healing process is as follows: Anomaly detection: Marking abnormal event levels (P0-P3) by monitoring the pipeline; Root cause analysis: Call the AI ​​operation and maintenance model to locate the fault module; Policy execution: Selects repair actions based on the predefined policy library and records self-healing logs.

Citation Information

Cited By

  • WebSocket-based method for realizing real-time updating of BI visual large-screen high-concurrency data

    CN121029448A

  • Visual large-screen dynamic display method and system based on data driving

    CN121071009A

  • Method and system for intelligent generation of visual large screen based on large language model

    CN122387446A

  • Method and system for intelligent generation of visual large screen based on large language model

    CN122387446B