基于ECharts的醫療數據交互式可視化研究

摘 要：文章對基于ECharts的醫療數據交互式可視化進行了深入研究。首先，報告了使用ECharts在高效醫療數據可視化分析領域的應用現狀。研究對兩個案例進行了詳細調查：第一個案例探討在不同學習率（0.001和0.000 01）下，ECharts如何有效生成準確率和損失率曲線，以及這些曲線如何清晰展示深度學習模型在訓練過程中的動態變化；第二個案例則針對睡眠健康和生活方式數據集，展示不同職業群體中失眠、無障礙和睡眠呼吸暫停的分布比例。通過這兩個案例，不僅加深了對ECharts在醫療數據可視化中的應用理解，還為未來醫療數據分析和深度學習領域的研究提供了新視角和有力的實踐指導，突顯了ECharts在數據科學與可視化領域的關鍵作用。

關鍵詞：ECharts；可視化；交互式；醫療數據

中圖分類號：TP311 文獻標識碼：A 文章編號：2096-4706（2024）14-0076-05

Research on Interactive Visualisation of Medical Data Based on ECharts

CHEN Sinan， CHEN Jiping， HUANG Hongqian， PAN Weiquan

（School of Mathematics and Statistics， Yulin Normal University， Yulin 537000， China）

Abstract： This paper presents an in-depth study of interactive visualisation of medical data based on ECharts. Firstly， the current application status of using ECharts in the field of efficient medical data visualisation and analysis is reported. The study investigates two cases in detail. The first case explores how ECharts can efficiently generate accuracy and loss rate curves at different learning rates （0.001 and 0.000 01） and how these curves can clearly demonstrate the dynamic change of a Deep Learning model during the training process. The second case targets the sleep health and lifestyle dataset to show the distribution ratio of insomnia， accessibility and sleep apnoea in different occupational groups. Through the two cases， this paper not only deepens the application understanding of ECharts in medical data visualisation， but also provides new perspectives and strong practical guidance for future research on the fields of medical data analysis and Deep Learning， highlighting the key role of ECharts in the fields of data science and visualisation.

Keywords： ECharts; visualization; interactive; medical data

DOI：10.19850/j.cnki.2096-4706.2024.14.015

收稿日期：2023-12-14

基金項目：大學生創新創業訓練計劃項目（202110606020）

0 引 言

隨著信息技術的迅猛發展，數據可視化技術在各個領域都得到了廣泛關注和應用。近年來的研究涵蓋了多個領域，呈現出豐富多彩的發展景觀。其中一些重要的研究方向包括基于R語言Shiny包的文本可視化系統、概率統計交互可視化教學、機器學習交互式可視化平臺，以及以Vue+Flask為基礎的圓極化天饋系統數據可視化和基于Flask框架的疫情數據可視化分析[1-6]。這些研究成果不僅為各個領域提供了強大的數據可視化工具，還推動了數據可視化技術的不斷創新。通過基于R語言Shiny包的文本可視化系統，研究人員能夠以更直觀的方式呈現文本信息，使其更易理解和分析。概率統計交互可視化教學為教育領域帶來了新的可能性，通過可視化手段提高學生對統計概念的理解。機器學習交互式可視化平臺為研究人員和數據科學家提供了直觀而靈活的工具，以探索和理解機器學習模型的性能和行為。而以Vue+Flask為基礎的圓極化天饋系統數據可視化和基于Flask框架的疫情數據可視化分析，則在工程和公共衛生領域取得了顯著的成果。

未來，我們有望進一步探索數據可視化技術的創新和跨學科應用。這包括更加智能化的可視化系統、更廣泛的領域應用，以及更加直觀的用戶交互方式。通過不斷推動數據可視化技術的前沿，我們將更好地滿足不同領域對于可視化工具的不斷增長的需求，推動信息傳遞和決策制定的更高水平。

特別值得一提的是，ECharts [7]是一款功能強大的JavaScript圖表庫，因其簡便易用和豐富的圖表類型而備受關注。作為一項基于JavaScript的開源工具，ECharts為用戶提供了便捷的方式來創建多樣化且交互式的圖表。ECharts被廣泛認可為全球領先的可視化開發工具，尤其在中國的Web前端行業，其識別率高達90%，使用率更是達到驚人的74% [8]。這不僅證明了ECharts在全球范圍內的卓越地位，也突顯了它在中國的獨特地位，成為最受歡迎的可視化工具包之一。在百度內部，高達90%的軟件產品選擇采用ECharts，在外部機構，包括中國外交部、中國國家統計局、中國國家專利局、阿里巴巴、騰訊、華為、聯想等知名公司中，ECharts同樣得到了廣泛的應用[9]。

本文的主要目標是利用ECharts圖表應用程序對經過TensorFlow [10]深度學習處理的醫療數據結果以及睡眠健康和生活方式數據進行可視化呈現。數據可視化[11]是一種通過圖解方式將抽象數據呈現出來的方法，以使信息更加清晰和明確，從而實現對數據的深入觀察和分析。在數據庫中，復雜的數據可以通過數據可視化技術進行分解，將其表示為單個圖元元素。同時，通過多維數據的形式，不同的屬性值得以以多個維度展現，使觀察者能夠從不同的角度和維度全面審視數據。這種方法提供了一種直觀而有效的手段，有助于更好地理解和解釋數據。

隨著醫療大數據的廣泛應用，對醫療數據進行可視化分析顯得愈發重要。然而，隨著醫療數據規模的不斷擴大，醫學診療方法的不斷升級，以及信息化水平的提高，未來醫療數據的數量將持續增加，從中快速提取有效數據信息成為當前迫切需要解決的問題。基于ECharts的數據可視化分析技術的出現為解決這一難題提供了有效途徑和改進方法。ECharts技術的運用使得醫療專業人士能夠更直觀、更有效地理解和分析復雜的醫療數據，為提升醫療數據分析的效率和精度提供了嶄新的可能性。

本研究的數據主要來源于互聯網上公開的網頁數據。我們在收集數據的過程中，嚴格遵守相關的規范，并盡最大努力確保數據的可信度和準確性。我們對數據來源的網頁進行了充分的篩選和驗證，確保所使用的數據來自權威和可靠的來源。

1 案例一

以下是對學生CGPA數據集在心理健康方面的統計研究。該數據集通過由Google Forms發起的調查收集，調查對象為大學生。調查的目的在于深入了解他們目前的學業狀況以及心理健康狀況，以進一步分析二者之間的關聯。

在此案例中，我們采用了深度學習方法[12]，利用TensorFlow框架的Keras接口構建了一個基線（baseline）模型。為了優化訓練過程，我們引入了Adam優化器，這是一種廣泛應用于神經網絡訓練的優化算法。接下來，我們使用Keras的Sequential API定義了一個順序模型。該模型包括多個密集層，涵蓋了一個輸入層（9個節點）、兩個使用ReLU激活函數的隱藏層（分別有18和9個節點），以及一個使用Sigmoid激活函數的輸出層。這種架構通常用于解決二元分類問題。

在模型構建之后，我們創建了Adam優化器的實例，并通過設置不同的學習率，以研究學習率對模型性能的影響。具體而言，我們分別采用了學習率為0.001和0.000 01的情況。

隨后，我們使用二元交叉熵損失函數（通常用于處理二元分類任務），并以之前定義的Adam優化器和準確率作為評估指標對模型進行編譯。編譯的目的是最小化訓練過程中的損失，從而提高模型的性能。我們選擇了準確度作為模型性能的評估指標。

然后，我們調用“fit”函數來訓練模型。該方法接受訓練數據和驗證數據，并將訓練的時期數設定為50。一旦訓練過程完成，我們記錄了準確率和損失率的變化，以備后續分析或可視化之用。

我們通過ECharts工具進行數據可視化，繪制了不同學習率下模型在訓練集和測試集上的準確率和損失率曲線，如圖1所示。

（a）在學習率為0.001下Epoch8的結果圖

（b）在學習率為0.001下Epoch40的結果圖

（c）在學習率為0.000 01下Epoch12的結果圖

（d）在學習率為0.000 01下Epoch49的結果圖

通過ECharts動態折線圖，我們生動地展示了在學習率為0.001的情況下，模型在訓練過程中的性能變化。此圖表不僅提供了直觀的數據可視化，而且支持用戶交互，使得在鼠標移動時，y軸數據能夠相應變化。如圖1所示，我們特別關注了兩個關鍵的數據點，以更深入地理解模型的訓練進展。

首先，我們聚焦于Epoch8這一時間點。通過點擊x軸上的該數據點，我們詳細觀察到模型在學習率為0.001時的性能表現。在訓練集上，準確率達到約0.600，而在驗證集上為 0.500；相應地，訓練集和驗證集的損失分別約為0.684和0.712。這一數據揭示，在模型經過8個周期的訓練后，學習率為0.001的情況下，模型取得了相應的性能進展。

其次，我們深入研究了Epoch40這一關鍵時刻。點擊x軸上的該數據點，我們觀測到在學習率為0.001的情況下，模型在訓練至第40個周期時的性能指標。在這個時間點，訓練集的準確率達到約0.688，驗證集上為0.600；同時，訓練集和驗證集的損失分別約為0.589和0.647。這進一步表明，隨著訓練的進行，模型在學習率為0.001的情況下取得了顯著的性能提升。

除此之外，我們將目光轉向學習率為0.000 01的情況，并關注了Epoch12這一具有代表性的時間點。通過點擊x軸上的Epoch12，我們發現在學習率為0.000 01的情況下，模型在經過12個周期的訓練后，表現出準確率為0.625和0.75（訓練集和驗證集），損失分別約為1.305和0.562。這意味著即便在較低的學習率下，模型在一定程度上依然能夠取得令人滿意的性能。

最后，我們再次聚焦于學習率為0.000 01的情況，并關注Epoch49。通過點擊x軸上的該數據點，我們觀察到在訓練至第49個周期時，模型在訓練集和驗證集上的準確率分別為0.625和0.75，損失分別約為1.231和0.546。這再次印證了在學習率為0.000 01的情況下，模型在經過49個周期的訓練后，取得了令人滿意的性能進展。這一系列的數據點和觀察為我們提供了深入理解模型訓練過程的關鍵信息。

圖清晰展示了學習率對模型性能的影響，為后續優化提供有價值的參考。在圖1中，我們觀察到不同學習率下模型的收斂速度、穩定性等性能差異，為進一步優化模型的學習過程提供了重要線索。這一分析為我們深入理解模型行為提供有力支持，為模型調優和改進提供指導方向。

2 案例二

以下是對睡眠健康和生活方式數據集在不同職業領域中睡眠障礙分布的統計研究。該數據集包括了400行13列的詳細信息，涵蓋了與睡眠和日常習慣相關的廣泛變量。研究的目的是深入了解不同職業領域中個體的睡眠狀況，特別關注失眠、無障礙和睡眠呼吸暫停三種睡眠障礙的分布情況。

在此案例中，我們通過使用Python中的pandas庫對數據進行交叉表分析，得到了不同職業領域和睡眠障礙之間的關系。并通過使用ECharts可視化工具，創建了堆疊條形圖，展示了失眠、無障礙和睡眠呼吸暫停在各個職業中的分布比例，如圖2所示，這讓我們能夠直觀地比較不同職業中這些睡眠障礙的發生率。

（a）不同職業與不同睡眠質量的關系

（b）不同職業與無障礙（None）睡眠質量的關系

（c）不同職業與睡眠呼吸暫停（Sleep Apnea）睡眠質量的關系

（d）不同職業與失眠（Insomnia）睡眠質量的關系

通過ECharts堆疊條形圖的詳細分析，我們深入研究了不同職業領域在無障礙（None）、睡眠呼吸暫停（Sleep Apnea）、失眠（Insomnia）三種睡眠狀況下的分布情況，如圖2所示。

2.1 無障礙（None）分布

在無睡眠障礙方面，醫生（Doctor）、工程師（Engineer）、護士（Nurse）和教育工作者（Teacher）表現卓越，分別達到64、57、61和9。這可能反映了這些職業具有相對規律的工作生活和較好的工作環境，為維護良好睡眠創造了有利條件。醫生和護士可能因為其專業背景，對于睡眠健康相關知識有較為深刻的了解，從而能夠更好地維護自己的睡眠質量。他們可能具備有效的應對工作壓力和規律的工作時間表，有助于保持良好的生物鐘和睡眠習慣。工程師可能在創造性的工作中找到了一種平衡，創造性的工作既能夠滿足其職業需求，又有助于提高工作滿足度，可能減輕了工作壓力對睡眠的負面影響。教育工作者可能因為其相對固定的教學時間表而表現出相對較低的無睡眠障礙比例。教學工作通常遵循固定的課程表，相較于其他職業，他們可能更容易維持規律的作息時間，有助于維持良好的睡眠模式。

2.2 睡眠呼吸暫停（Sleep Apnea）分布

在睡眠呼吸暫停方面，護士呈現最高比例，達到61。這可能與護士在工作中需要應對復雜的患者情況以及常常參與輪班工作的工作模式相關。護士的工作特性可能導致他們更容易受到睡眠呼吸暫停的影響，因為這些工作條件可能與正常的生物鐘和睡眠模式產生沖突。相比之下，銷售代表和銷售人員的睡眠呼吸暫停比例相對較低，分別為2和1。這可能是因為這兩個職業相對較少涉及與睡眠呼吸暫停相關的工作場景。銷售工作通常涉及規律性的辦公室工作，較為規律的工作時間可能減少了睡眠呼吸暫停的發生概率。此外，與護士相比，銷售代表和銷售人員可能更少涉及與患者生理狀況直接相關的醫療工作，因此其工作性質可能不太容易導致睡眠呼吸暫停的發生。

2.3 失眠（Insomnia）分布

在失眠方面，銷售人員（Salesperson）和教育工作者（Teacher）顯示出顯著的高比例，分別占29和27。這引發了對這兩個職業群體的工作壓力和生活方式的關注，突顯了他們可能面臨的心理健康挑戰。銷售人員通常需要不斷應對市場競爭、達成銷售目標和應對激烈的銷售壓力，這可能導致工作生活的緊張和高度的工作壓力。這種高度的競爭和目標導向性的工作環境可能使得銷售人員更容易經歷失眠問題。教育工作者可能在面對學生需求、教學壓力以及教育系統的變革等方面感到壓力重重。教育領域的工作壓力可能與學術要求、學生管理和教學負擔等相關，這些因素都可能對教育工作者的睡眠產生負面影響。此外，會計師和軟件工程師也呈現相對較高的失眠比例，分別為7和1。這可能與高強度的工作和需求緊迫的項目有關。會計師可能因季度末工作壓力、報表制定等任務而感到壓力，而軟件工程師可能受到項目交付時間的壓力和不斷變化的技術要求的影響，這可能導致他們經歷失眠問題。

通過可視化分析[13]，我們可以更全面地了解不同職業領域在不同睡眠狀況下的表現，為改善職業生活和睡眠健康提供有益的參考。通過ECharts的可視化工具，我們不僅僅得知不同職業群體在不同睡眠狀況下的分布情況，而且也深入了解這些分布背后的潛在原因。這些發現對于制定未來的健康管理和工作生活平衡策略提供有力的指導。例如，對于銷售人員和教育工作者，可以考慮實施更有針對性的壓力管理和睡眠促進措施。對于護士這一高比例的睡眠呼吸暫停，可能需要關注其工作環境和工作時間的調整，以促進更好的睡眠質量。

這些深入的分析結果為未來更深入的研究提供了堅實的基礎，也為相關領域的決策者提供指導，幫助他們制定更有效的工作生活平衡和健康管理策略。

3 結 論

在本研究中，我們深入利用了ECharts工具進行醫療數據可視化。ECharts作為一款開源、基于Web的跨平臺框架，具備構建交互式可視化的便捷能力。其獨特之處在于提供了一套聲明性的可視化設計語言，使用戶能夠輕松自定義各類內置圖表。通過底層的流文件結構，并結合基于HTML5 canvas的高性能圖形渲染器，ECharts展現出卓越的可擴展性和出色的性能表現。通過使用ECharts，用戶無須深入研究JavaScript、R語言或Python語法，就能夠創建出直觀而富有信息量的圖表。這種可視化方法為深度學習結果以及睡眠健康和生活方式數據提供了更加生動、易懂的展示方式，使醫療數據深度學習結果和睡眠健康數據的解讀變得更加直觀和可交互。同時該圖表應用程序有助于激發學生對醫療數據分析的興趣，并促使他們更主動地探索數據背后的信息。

總體而言，通過充分發揮ECharts在醫療數據結果可視化方面的優勢，我們成功構建了一套直觀、交互式的可視化界面。這項研究為醫療數據可視化領域的發展提供了有力的支持。我們對未來的研究和應用充滿信心，相信ECharts將繼續在數據科學和可視化領域發揮關鍵作用，為該領域的進步貢獻力量。

參考文獻：

[1] 淦亞婷，安建業，苗漉欣.基于R-Shiny的中文文本可視化系統設計研究 [J].現代信息科技，2023，7（7）：24-27.

[2] 榮民希，黃士國，曲雙紅.基于R語言Shiny包的概率統計交互可視化教學研究與實踐 [J].數學學習與研究，2021（6）：146-147.

[3] 潘偉權，李麗潔，羅小青.基于Shiny的統計學交互式可視化教學研究 [J].中阿科技論壇：中英阿文，2020（7）：164-166.

[4] 任鵬，王廷偉，GRECOS C.基于Shiny框架的海洋浮標大數據處理實驗平臺[J].實驗室研究與探索，2018，37（8）：46-49.

[5] 沃葉紅.基于Vue+Flask的圓極化天饋系統數據可視化與預警軟件的設計 [J].數字技術與應用，2023，41（2）：207-209+233.

[6] 李相霏，韓珂.基于Flask框架的疫情數據可視化分析 [J].計算機時代，2021（12）：60-63+68.

[7] 張文肖.基于改進CANN算法的入侵檢測系統設計與實現 [D].西安：西安電子科技大學，2019.

[8] LI D Q，MEI H H，SHEN Y，et al.Echarts： A Declarative Framework for Rapid Construction of Web-Based Visualization [J].Visual Informatics，2018，2（2）：136-146.

[9] 張倫裕.醫療檢測大數據分析及其可視化 [D].北京：北京郵電大學，2020.

[10] ABADI M，AGARWAL A，BARHAM P，et al. TensorFlow： Largescale Machine Learning on Heterogeneous Systems [J/OL].arXiv：1603.04467 [cs.DC].（2016-04-14）.https：//arxiv.org/abs/1603.04467.

[11] 李鑫.永川區醫療大數據可視化系統的設計與實現 [D].重慶：重慶大學，2018.

[12] 李強，王彬彬.基于Echarts的神經網絡教學系統設計與實現 [J].無線互聯科技，2023，20（13）：87-90.

[13] 連曉丹，黃坤平，劉林.基于數據挖掘的醫療大數據可視化分析系統設計 [J].自動化與儀器儀表，2023（6）：170-174.

作者簡介：陳思楠（2001—），女，漢族，廣西浦北人，本科在讀，研究方向：統計學；陳吉平（2002—），女，漢族，廣西南寧人，本科在讀，研究方向：統計學；黃紅倩（2002—），女，漢族，廣西南寧人，本科在讀，研究方向：統計學；潘偉權（1980—），男，漢族，廣西平南人，副教授，博士，研究方向：統計學。