基于Vue框架的多源WEB前端页面数据可视化方法  

Visualization method for multi⁃source WEB front⁃end page data based on Vue framework

作　　者：宋文凯 王利萍 荆巍巍[1] SONG Wenkai;WANG Liping;JING Weiwei(Nanjing Research Institute of Electronics Technology,Nanjing 210000,China)

机构地区：[1]南京电子技术研究所,江苏南京210000

出　　处：《电子设计工程》2025年第6期63-66,71,共5页Electronic Design Engineering

基　　金：国家重点社科基金项目(JCKY2022608C001)。

摘　　要：为了提升WEB前端页面数据的呈现效果与用户体验,提出基于Vue框架的多源WEB前端页面数据可视化方法。利用网络爬虫技术,通过数据清洗、数据补充操作,采集多源WEB前端页面数据。利用Vue框架确定页面数据的布局结构,根据输出介质与Vue框架之间的比例关系,将页面数据转换为坐标形式。通过渲染输出,实现数据可视化处理。通过性能测试可知,与传统方法相比,应用新方法后,数据完整性可视化系数最高可提升至0.995,可视化页面分辨率明显提升,可视化时延较短,由此证明新方法具有更优的可视化与交互性能。In order to improve the presentation effect and user experience of WEB front-end page data,a multi-source WEB front-end page data visualization method based on Vue framework is proposed.Utilizing WEB crawling technology,data cleaning and data supplementation operations are carried out to collect multi-source WEB front-end page data.The layout structure of the page data is determined using the Vue framework,and the page data is converted into coordinate form based on the proportional relationship between the output medium and the Vue framework.Data visualization processing is achieved through rendering output.Through performance testing,it can be seen that compared with traditional methods,the application of the new method can increase the data integrity visualization coefficient up to 0.995,significantly improve the visualization page resolution,and shorten the visualization latency.This proves that the new method has better visualization and interaction performance.

关 键 词：Vue框架 WEB前端 多源数据 页面数据 数据可视化 

分 类 号：TP311[自动化与计算机技术—计算机软件与理论]