Vehicle-mounted charging verification visualization method based on VUE framework

Abstract

The invention relates to a vehicle-mounted charging verification visualization method and device based on a VUE framework, computer equipment, a computer readable storage medium and a computer program product, and can be applied to the technical field of computers. The method comprises the steps of obtaining vehicle-mounted verification operation data and vehicle-mounted verification device attribute data, performing data format conversion processing corresponding to a VUE framework on the vehicle-mounted verification operation data to obtain target data of vehicle-mounted charging verification display, and constructing a vehicle-mounted charging verification device display model, a vehicle-mounted charging verification device display model is added into a VUE framework display page to obtain a vehicle-mounted charging verification real-time monitoring scene, finally, vehicle-mounted charging verification process data is added to the vehicle-mounted charging verification scene, dynamic and interactive performance is achieved, the series of steps form an efficient working process, and the working efficiency is improved. According to the method, portable verification of the on-site charging pile is effectively achieved, a series of steps form an efficient working process, the problem that verification of the on-site charging pile is difficult is effectively solved, the whole vehicle-mounted charging verification process can be observable, measurable and visible, and the verification capacity of the on-site charging pile is improved.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a method, device, computer equipment, computer-readable storage medium and computer program product for on-board charging verification visualization based on a VUE framework. Background Art

[0002] With the popularity of electric vehicles, charging piles, as key facilities for charging electric vehicles, have attracted attention from all parties. Their performance and safety are crucial to the operation of electric vehicles. In order to ensure the measurement accuracy and safety of charging piles, compulsory inspection of charging piles is carried out. Due to the scattered construction locations and high failure rates of charging piles, the inspection agency needs to invest resources to carry out compulsory inspection of charging piles, which makes the inspection process of charging piles non-intuitive and complicated to operate, resulting in high inspection costs.

[0003] With the continuous development of intelligent verification technology, 3D visualization technology has become one of the mainstream technologies for intelligent vehicle verification. It presents information in the most intuitive way, improves the efficiency of information interaction, reduces information loss and time loss, and allows charging pile verification personnel to greatly improve control efficiency, speed up response time, and shorten processing time.

[0004] Therefore, constructing a visualization method for on-board charging calibration of charging piles can solve the problem of portable calibration of charging piles, making the entire on-board charging calibration process "observable, measurable, and visual", and improving the on-site charging pile calibration capabilities.

[0005] The existing technologies have the following deficiencies to a greater or lesser extent:

[0006] Limited interactivity: Traditional vehicle verification software modules may have limited interactivity, and users may not be able to interact, explore, and operate in real time. This may be limited in simulation operations.

[0007] Complexity and learning curve: Using some power system simulation software may require a certain technical background and learning curve. This may make it difficult for general users to use and understand easily.

[0008] Lack of real-time performance: Traditional on-board verification may have difficulties in processing real-time data and events, limiting its application in real-time monitoring and decision-making.

[0009] Data sharing and collaboration: In some existing technologies, multi-person collaboration and data sharing may be limited, restricting teamwork and collaborative work. Summary of the invention

[0010] Based on this, it is necessary to provide a visualization method for on-board charging verification based on the VUE framework to address the above technical problems.

[0011] In a first aspect, the present application provides a VUE-based on-board charging verification visualization method, the method comprising:

[0012] Obtaining on-board verification operation data and on-board verification device attribute data;

[0013] According to the vehicle-mounted verification operation data, the vehicle-mounted verification operation data is converted into a data format corresponding to the VUE framework to obtain the target data displayed by the vehicle-mounted charging verification;

[0014] According to the attribute data of the vehicle-mounted verification device, a device display model is constructed to obtain the vehicle-mounted charging verification device display model;

[0015] According to the on-board charging verification device display model, the on-board verification display model is added to the VUE framework display page to generate the on-board charging verification visualization scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events;

[0016] The target data displayed by the on-board charging verification is added to the on-board charging verification visualization scene to obtain the on-board charging verification real-time monitoring scene.

[0017] In a second aspect, the present application further provides a computer device. The computer device includes a memory and a processor, the memory stores a computer program, and the processor implements the following steps when executing the computer program:

[0018] Obtaining on-board verification operation data and on-board verification device attribute data;

[0019] According to the vehicle-mounted verification operation data, the vehicle-mounted verification operation data is converted into a data format corresponding to the VUE framework to obtain the target data displayed by the vehicle-mounted charging verification;

[0020] According to the attribute data of the vehicle-mounted verification device, a device display model is constructed to obtain the vehicle-mounted charging verification device display model;

[0021] According to the on-board charging verification device display model, the on-board verification display model is added to the VUE framework display page to generate the on-board charging verification visualization scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events;

[0022] The target data displayed by the on-board charging verification is added to the on-board charging verification visualization scene to obtain the on-board charging verification real-time monitoring scene.

[0023] In a third aspect, the present application further provides a computer-readable storage medium. The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the following steps are implemented:

[0024] Obtaining on-board verification operation data and on-board verification device attribute data;

[0025] According to the vehicle-mounted verification operation data, the vehicle-mounted verification operation data is converted into a data format corresponding to the VUE framework to obtain the target data displayed by the vehicle-mounted charging verification;

[0026] According to the attribute data of the vehicle-mounted verification device, a device display model is constructed to obtain the vehicle-mounted charging verification device display model;

[0027] According to the on-board charging verification device display model, the on-board verification display model is added to the VUE framework display page to generate the on-board charging verification visualization scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events;

[0028] The target data displayed by the on-board charging verification is added to the on-board charging verification visualization scene to obtain the on-board charging verification real-time monitoring scene.

[0029] In a fourth aspect, the present application further provides a computer program product. The computer program product includes a computer program, and when the computer program is executed by a processor, the following steps are implemented:

[0030] Obtaining on-board verification operation data and on-board verification device attribute data;

[0031] According to the vehicle-mounted verification operation data, the vehicle-mounted verification operation data is converted into a data format corresponding to the VUE framework to obtain the target data displayed by the vehicle-mounted charging verification;

[0032] According to the attribute data of the vehicle-mounted verification device, a device display model is constructed to obtain the vehicle-mounted charging verification device display model;

[0033] According to the on-board charging verification device display model, the on-board verification display model is added to the VUE framework display page to generate the on-board charging verification visualization scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events;

[0034] The target data displayed by the on-board charging verification is added to the on-board charging verification visualization scene to obtain the on-board charging verification real-time monitoring scene.

[0035] The above-mentioned on-board charging calibration visualization method, device, computer equipment, computer-readable storage medium and computer program product based on the VUE framework obtain on-board calibration operation data and on-board calibration device attribute data, convert the on-board calibration operation data into the data format corresponding to the VUE framework, obtain the target data for on-board charging calibration display, and construct an on-board charging calibration device display model, add the on-board charging calibration device display model to the VUE framework display page, and obtain the on-board charging calibration real-time monitoring scene. Finally, by adding the on-board charging calibration process data to the on-board charging calibration scene, it is conducive to achieving dynamics and interactivity. This series of steps forms an efficient workflow, effectively solves the portable calibration of on-site charging piles, realizes the "observable, measurable and visible" of the entire on-board charging calibration process, and improves the on-site charging pile calibration capability. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the related technologies, the drawings required for use in the embodiments or the related technical descriptions are briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0037] Figure 1 A schematic diagram of a method for visualizing on-board charging verification based on a VUE framework in one embodiment. DETAILED DESCRIPTION

[0038] In order to make the purpose, technical solution and advantages of the present application more clearly understood, the present application is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0039] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with relevant regulations.

[0040] In an exemplary embodiment, Figure 1As shown, a method for visualizing vehicle charging verification based on the VUE framework is provided. This embodiment uses the method applied to a terminal as an example. It can be understood that the method can also be applied to a server, and can also be applied to a system including a terminal and a server, and is implemented through the interaction between the terminal and the server. Among them, the terminal can be, but is not limited to, various personal computers, laptops, smart phones, tablet computers, etc.; the server can be an independent physical server, or a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides cloud computing services. In this embodiment, the method includes the following steps:

[0041] Q1. Based on the new energy vehicle-mounted verification device, obtain the vehicle-mounted verification operation data and the vehicle-mounted verification device attribute data;

[0042] Q2. Based on the data required for the on-board charging verification display, extract and process the on-board charging verification data to obtain the target data for the on-board charging verification display;

[0043] Q3. Based on the data processed in Q2, configure the display page DOM nodes according to the UI design diagram, plan the page component ID, place multiple groups of chart components with different category IDs, and display the same group of data through different charts;

[0044] Q4. Standardize the data processed in Q2 and convert it into a data format that can be recognized by the VUE framework;

[0045] Q5. Based on the attribute data of the vehicle-mounted calibration device, a display model of the vehicle-mounted charging calibration device is constructed, and the vehicle-mounted charging calibration display model is added to the VUE framework page display to obtain the vehicle-mounted charging calibration scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events;

[0046] Q6.Integrate data from different data sources into a unified data set through data interfaces;

[0047] Q7. By establishing a virtual-real mapping relationship, the relationship between the physical object and the digital space is realized, the data of the vehicle charging verification process is obtained in real time, and the real-time display of the vehicle charging verification process is realized through the two-way binding principle of the front-end framework.

[0048] In some embodiments of this specification, the key information includes data such as the appearance of the calibration device, the size of the calibration device, the status of the calibration device, electrical performance test, communication function test, safety protection test, environmental reliability test, as well as the type and status attribute information of the equipment.

[0049] In some embodiments of this specification, the process of using the VUE framework to process and extract data in Q2 is as follows:

[0050] Q21.Data processing and extraction through JavaScript built-in methods and functions;

[0051] Q22. Extract, replace, and filter data by writing appropriate regular expressions;

[0052] Q23. Third-party libraries and tools in the VUE framework for data processing and extraction;

[0053] Q24.Data processing and extraction through template engine.

[0054] In some embodiments, custom methods are used in Q21 to operate string data, such as captureStr(), reorderStr(), escapeStr(), etc.

[0055] In some embodiments, custom methods are used in Q21 to process and extract array data, such as structureArry(), filterArry(), convertArry(), etc.

[0056] In some embodiments, in Q23, Lodash is used to process array, object, string data, such as compact(), reject(), forEach(), etc.

[0057] In some embodiments, in Q23, Moment.js is used to parse, format and manipulate date and time data, such as moment().format('YYYY-MM-DD'),

[0058] moment(value).format('YYYY-MM-DD HH:mm:ss'), this.moment().subtrac t(), etc.

[0059] In some embodiments, in Q23, Axios is used to obtain and process data returned by the server, such as axios(config), axios.get(), axios.request.bind(axios), etc.

[0060] The technical concept of the present invention is as follows:

[0061] This technology builds a vehicle charging verification monitoring display scene based on the front-end framework VUE and the ECharts visualization library. Combining the key data of vehicle charging verification and the visualization library, the data visualization of the vehicle charging verification process is realized, and the electrical performance test, communication function test, safety protection test, environmental reliability test, etc. of the charging pile are displayed through charts and dashboards, which helps us understand the vehicle charging verification process more intuitively and improve the on-site charging pile verification capabilities.

[0062] VUE: A progressive JavaScript framework for building user interfaces. It is based on the MVVM (Model-View-ViewModel) architecture and uses a componentized programming model to efficiently develop user interfaces. Vue's core library focuses on the view layer, supports bottom-up incremental development, and can gradually introduce different functional modules according to project needs. Vue's advantages include small size, high operating efficiency, and two-way data binding, which allows developers to focus more on business logic rather than tedious DOM operations. Vue's componentized design improves code reuse and maintainability, and the declarative coding method makes development more efficient. It uses virtual DOM and an excellent Diff algorithm to minimize the number of DOM operations, thereby improving performance. Vue has a rich ecosystem, with many Vue-based UI frameworks and tools for rapid development.

[0063] ECharts: An open source visualization library based on JavaScript, which can run smoothly on PC and mobile devices and is compatible with most current browsers. ECharts provides conventional charts, such as bar charts, pie charts, line charts, etc., as well as some extended charts, such as maps, treemaps, force-directed graphs, bubble charts, etc.

[0064] Main features of ECharts:

[0065] Provides common chart types, such as bar charts, line charts, pie charts, etc.

[0066] Provides a combination of graphics and charts.

[0067] Supports multiple data formats, such as Array, JSON, etc.

[0068] Support theme customization.

[0069] Support gestures, such as pan, zoom, etc.

[0070] Support dynamic data update.

[0071] Supports chart event handling, such as click, hover, etc. Developed and maintained by the Baidu team.

[0072] It provides a rich variety of chart types and interactive capabilities, allowing developers to easily create interactive, beautiful and functional data visualization charts.

[0073] VUE is the basic carrier and display of the vehicle charging verification system. The data needs to be processed and converted in a specific way to be accurately presented in VUE. The following are the detailed steps of the import process:

[0074] Data preprocessing and extraction: First, combine relevant data processing and visualization libraries to extract the key information to be displayed from the data. And establish DOM nodes. Involving data parsing, format conversion and other operations. The goal of these steps is to obtain the appearance, size, verification status and data of the vehicle charging verification.

[0075] Data format conversion: The extracted data is converted into corresponding data, and then converted into a data format recognizable by VUE using corresponding conversion methods.

[0076] Calibration and adjustment: In the scene, fine-tuning and calibration may be required to ensure that the on-board charging calibration is consistent with the scale and position of the 3D model. This may involve operations such as rotation, translation, and scaling to maintain the accuracy and authenticity of the data.

[0077] Real-time data integration: The real-time data interface connects the on-board charging verification display information with the actual operation data, allowing users to check the operating status of the on-board charging verification system in real time in the on-board charging verification display. By establishing a virtual-real space mapping relationship and realizing the connection between the virtual space and the actual verification data, data such as the verification device status, verification device usage rate, charging times, charging time, charging power, and charging pile failure can be obtained in real time. These real-time data can be displayed dynamically in real time through the two-way binding principle of VUE. This enables users to observe the operation of the on-board charging verification on the web page, conduct real-time analysis and decision-making, and thus improve the verification efficiency.

[0078] 1. Data preprocessing and extraction

[0079] (2) Combined with relevant information, it can be extracted according to the data processing method provided by the front-end framework VUE;

[0080] ① JavaScript built-in methods and functions: For example, you can use string captureStr(), reorderStr(), escapeStr() and other methods to intercept and process string data; you can use array structureArry(), filterArry(), convertArry() and other methods to process and extract array data; you can use object attribute access and operation methods to process and extract object data. You can use encapsulation functions to process more complex data, and use the VUE responsive principle to achieve correct data display. You can use VUE's built-in listener watch to listen to data changes and achieve real-time data display.

[0081] ②Regular Expression: By writing a suitable regular expression, you can perform various operations such as extraction, replacement, and filtering. For example, you can add login account and password format verification through regular expressions.

[0082] ③ Third-party libraries and tools: There are many excellent third-party libraries and tools in front-end development, which provide rich functions and methods to process and extract data. For example, Lodash is a popular JavaScript utility library that provides many convenient methods to process arrays, objects, strings and other data, such as compact(), reject(), forEach(), etc.; Moment.js is a date and time processing library that can easily parse, format and operate date and time data, such as

[0083] moment().format('YYYY-MM-DD'),

[0084] moment(value).format('YYYY-MM-DD HH:mm:ss'), this.moment().subtract(), etc.; Axios is a commonly used network request library that can easily obtain and process data returned by the server, etc.

[0085] ④ Template engine: If you need to dynamically generate HTML or other text content on the front end, you can use a template engine to preprocess and extract data. The template engine can insert data into the specified location according to certain rules and placeholders to generate the final text content. Common template engines include Mustache, Handlebars, EJS, etc.

[0086] (3) Combined with the processed data structure, configure the page DOM nodes according to the UI design diagram, place multiple groups of chart components with different category IDs, so that the same group of data can be displayed in different charts. You can configure the series configuration items in ECHARTS to display different charts according to different types, such as bar for bar charts, line for line charts, and pie for pie charts. Customized chart configuration can be achieved through ECHARTS.

[0087] 2. Data format conversion

[0088] (1) After preprocessing the data, the data is stored in the backend database. The frontend needs to configure the proxy server and other related operations, as well as the front-end and back-end joint debugging, configure related AJAX requests and other operations. By specifying the request URL, request method (such as GET, POST), request header and parameters, etc., data can be obtained from the server and processed after the response is returned.

[0089] (2) If you need to obtain real-time data, you can configure an interval timer to send a request at the agreed time. Or you can use WebSocket to achieve real-time communication or two-way data transmission. WebSocket is a protocol that provides full-duplex communication on a single TCP connection, which can achieve instant data push between the client and the server.

[0090] (3) After the data is acquired, the data format returned by the background needs to be checked. If the data format is not recognizable by VUE, the data processing method provided by the VUE framework needs to be used to convert the background data into recognizable information. For example: use the JSON.parse() and JSON.stringify() methods to process the parsing and serialization of JSON data. After the data is acquired, the data format returned by the background needs to be checked. If the data format is not recognizable by VUE, the data processing method provided by the VUE framework needs to be used to convert the background data into recognizable information. For example: use the array method

[0091] axios(config), axios.get(), axios.request.bind(axios) and other methods are used to handle the parsing and serialization of the data returned by the background, and the methods provided by the Intl object are used to localize and format data such as dates, numbers and currencies. After the data is processed, the ECharts icon configuration items are configured according to the actual data according to the project requirements, such as: title, legend, grid, xAxis, yAxis, series and other configuration items, and the data is displayed in the form of a visual chart.

[0092] 3. Calibration and adjustment: Get the appearance and size of the on-board charging verification, build a display model of the on-board charging verification, add the on-board charging verification display model to the VUE display page, set click events according to the front-end VUE position positioning characteristics, enhance the interactive effect, and display different effects according to different events.

[0093] 4. Real-time data interface

[0094] (1) Integrate data from different data sources into a unified data set through data interfaces.

[0095] (2) By establishing a data connection between the physical and digital spaces, the data of the on-board charging verification process is obtained in real time, and the on-board charging verification process is displayed in real time through the two-way binding principle of the front-end framework.

[0096] In summary, the technical points are as follows:

[0097] (1) Data preprocessing and extraction can be completed through the VUE framework's built-in function methods and third-party plug-ins;

[0098] (2) Data format conversion can be done by configuring the service server agent to convert the data format returned by the backend into a data format that can be recognized by the VUE framework;

[0099] (3) Real-time data interface can be realized through database or webservice technology;

[0100] The embodiments of the present invention can achieve at least the following beneficial effects:

[0101] Real-time data association: VUE-based responsive data binding principle can be combined with real-time data sources to associate real-time control cabinet verification data with the on-board charging monitoring system. In this way, users can view the actual verification information at any time and understand the real-time operation of the on-board charging verification.

[0102] Interactivity and operation: VUE allows users to interact, explore and operate the page in real time. Users can operate virtual scenes through virtual reality devices, mice and keyboards, and simulate the operation effects in different situations.

[0103] Real-time and responsiveness: VUE's real-time rendering capability can respond to the verification process instantly during the on-board charging verification process and display the latest verification data in real time. This is very useful in real-time monitoring, emergency response and decision-making.

[0104] The above-described embodiments are used to illustrate the present invention, not to limit the present invention, so changes to the exemplified numerical values ​​or equivalent substitutions should still fall within the scope of the present invention.

[0105] From the above detailed description, it can be understood by those skilled in the art that the present invention can indeed achieve the aforementioned objectives and is in compliance with the provisions of the Patent Law.

[0106] Although the preferred embodiments of the present invention have been described, those skilled in the art may make additional changes and modifications to these embodiments once they are aware of the basic creative concepts. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments and all changes and modifications that fall within the scope of the present invention. The above description is only a preferred embodiment of the present invention and is not intended to limit the present invention. It should be pointed out that any modifications, equivalent substitutions and improvements made within the spirit and principles of the present invention should be included in the scope of protection of the present invention.

[0107] It should be noted that the above description of the relevant process is only for example and explanation, and does not limit the scope of application of this specification. For those skilled in the art, various modifications and changes can be made to the process under the guidance of this specification. However, these modifications and changes are still within the scope of this specification.

[0108] The basic concepts have been described above. Obviously, for those of ordinary skill in the art who have read this application, the above invention disclosure is only for example and does not constitute a limitation of this application. Although not explicitly stated here, those of ordinary skill in the art may make various modifications, improvements and amendments to this application. Such modifications, improvements and amendments are suggested in this application, so such modifications, improvements and amendments still belong to the spirit and scope of the exemplary embodiments of this application.

[0109] At the same time, the present application uses specific words to describe the embodiments of the present application. For example, "one embodiment", "an embodiment", and / or "some embodiments" refer to a certain feature, structure or characteristic related to at least one embodiment of the present application. Therefore, it should be emphasized and noted that "one embodiment" or "an embodiment" or "an alternative embodiment" mentioned twice or more in different positions in this specification does not necessarily refer to the same embodiment. In addition, some features, structures or characteristics in one or more embodiments of the present application can be appropriately combined.

[0110] In addition, unless explicitly stated in the claims, the order of the processing elements and sequences described in this application, the use of alphanumeric characters, or the use of other names are not intended to limit the order of the processes and methods of this application. Although the above disclosure discusses some invention embodiments that are currently considered useful through various examples, it should be understood that such details are only for illustrative purposes, and the attached claims are not limited to the disclosed embodiments. On the contrary, the claims are intended to cover all modifications and equivalent combinations that are consistent with the essence and scope of the embodiments of this application. For example, although the implementation of the various components described above can be embodied in a hardware device, it can also be implemented as a pure software solution, for example, installation on an existing server or mobile device.

[0111] Similarly, it should be noted that in order to simplify the description disclosed in this application and thus help understand one or more embodiments of the invention, in the above description of the embodiments of the application, multiple features are sometimes combined into one embodiment, figure or description thereof. However, this method of the application should not be interpreted as reflecting the intention that the claimed object requires more features than those explicitly stated in each claim. On the contrary, the subject of the invention should have fewer features than the above single embodiment.

Claims

1. A visualization method for on-board charging verification based on the VUE framework, characterized in that: include: Obtaining on-board verification operation data and on-board verification device attribute data; According to the vehicle-mounted verification operation data, the vehicle-mounted verification operation data is converted into a data format corresponding to the VUE framework to obtain the target data displayed by the vehicle-mounted charging verification; According to the attribute data of the vehicle-mounted verification device, a device display model is constructed to obtain the vehicle-mounted charging verification device display model; According to the on-board charging verification device display model, the on-board verification display model is added to the VUE framework display page to generate the on-board charging verification visualization scene. According to the VUE location positioning characteristics, the model click event is set to enhance the interactive effect, and different effects are displayed according to different events; The target data displayed by the on-board charging verification is added to the on-board charging verification visualization scene to obtain the on-board charging verification real-time monitoring scene.

2. The on-board charging verification visualization method based on the VUE framework according to claim 1 is characterized in that: The key information includes data such as the appearance of the calibration device, the size of the calibration device, the status of the calibration device, electrical performance test, communication function test, safety protection test, environmental reliability test, as well as the type and status attribute information of the equipment.

3. The VUE-based on-vehicle charging verification visualization method according to claim 1 is characterized in that: The process of using the VUE framework for data processing includes the following steps: data processing through JavaScript built-in methods and functions, data extraction, replacement and filtering by writing appropriate regular expressions, data processing through third-party libraries and tools in the VUE framework, and data processing through the template engine.

4. According to the VUE-based on-board charging verification visualization method of claim 3, data processing is performed by JavaScript built-in methods and functions, which is characterized in that Use captureStr(), reorderStr(), and escapeStr() of strings to capture and process string data; use structureArry(), filterArry(), and convertArry() of arrays to process and extract array data.

5. According to the on-board charging verification visualization method based on the VUE framework of claim 3, the third-party library and tools in the VUE framework perform data processing, characterized in that Use Lodash to process arrays, objects, and string data; use Moment.js to parse, format, and manipulate date and time data; use Axios to obtain and process data returned by the server.

6. A computer device comprising a memory and a processor, wherein the memory stores a computer program, characterized in that: When the processor executes the computer program, the steps of the method according to any one of claims 1 to 5 are implemented.

7. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 5 are implemented.

8. A computer program product, comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 5 are implemented.

Images