蔡杰英 劉致中 鄭程遠(yuǎn)

摘? 要： 為解決傳統(tǒng)商業(yè)智能存在的報(bào)表形式單一、時(shí)間滯后等問題，搭建了集數(shù)據(jù)分析與數(shù)據(jù)可視化于一體的信息管理系統(tǒng)，應(yīng)用于企業(yè)管理決策。該系統(tǒng)設(shè)計(jì)上采用Flask框架開發(fā)，利用Python進(jìn)行海量數(shù)據(jù)分析，將Echarts作為可視化工具，在系統(tǒng)搭建方法上具有創(chuàng)新性。采用“5W1H”研究方法，對(duì)商業(yè)智能可視化系統(tǒng)進(jìn)行分析，設(shè)計(jì)出客戶產(chǎn)品需求、最佳銷售時(shí)段、倉(cāng)庫(kù)選址、人群畫像等模塊，為智能商業(yè)的發(fā)展設(shè)計(jì)提供更為詳細(xì)的思路和決策分析。

關(guān)鍵詞： 大屏可視化； 商業(yè)智能； Flask； 數(shù)據(jù)分析系統(tǒng)； 管理決策； 5W1H

中圖分類號(hào)：TP274? ? ? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A? ? ?文章編號(hào)：1006-8228（2023）06-124-05

Design and implementation of large-screen display system for business intelligence

Cai Jieying1， Liu Zhizhong2， Zheng Chengyuan3

（1. Guangdong University of Foreign Studies， School of Finance， Guangzhou， Guangdong 510000， China;

2. Guangdong University of Finance and Economics， School of Information; 3. Guangdong University of Technology）

Abstract： In order to solve the problems of information lacking and delay in traditional business intelligence （BI）， a BI information system integrating data analysis and data visualization is proposed for improving enterprise management decision-making. Flask framework is used in the design of the system， Python language is used for mass data analysis， and Echarts is used as a visual tool. The "5W1H" （What， When， Where， Who， Why and How） research method is used to analyze the business intelligence visualization system and design modules such as customer product demand， optimal sales time， warehouse location and crowd portrait. It provides more detailed ideas and decision analysis for the development of intelligent business design.

Key words： large screen visualization; business intelligence; Flask; data analysis system; management decision; 5W1H

0 引言

大數(shù)據(jù)時(shí)代，國(guó)內(nèi)的越來(lái)越多企業(yè)正利用商業(yè)智能技術(shù)來(lái)提升自身的數(shù)據(jù)分析能力，從而創(chuàng)新商務(wù)模式[1]。研究表明，人們已知的信息來(lái)源有80%是通過視覺獲得的[2]，且當(dāng)前商業(yè)智能正不斷向現(xiàn)代模式轉(zhuǎn)化[3]，將可視化技術(shù)與商業(yè)智能相結(jié)合，構(gòu)建更加新型現(xiàn)代的商業(yè)模式具有良好發(fā)展前景。

推動(dòng)商業(yè)智能的發(fā)展需要借助動(dòng)態(tài)交互、可視化較強(qiáng)的分析工具，而傳統(tǒng)的分析工具如Excel和SQL Server在數(shù)據(jù)挖掘上都存在一定不足[3]。一是Excel數(shù)據(jù)容量有限，可創(chuàng)建的圖表類型單一、交互性較差；二是SQL Server對(duì)表格篩選、排序等操作涉及到復(fù)雜查詢時(shí)，需借助大量SQL語(yǔ)句，較為冗雜，且其本身缺乏可視化功能。故而這兩者均不適合作為商業(yè)智能的數(shù)據(jù)分析工具。利用Python集成各種數(shù)據(jù)分析方法，可完成復(fù)雜的數(shù)據(jù)準(zhǔn)備、建模工作，挖掘數(shù)據(jù)背后的價(jià)值[4]，Python是良好的數(shù)據(jù)分析工具。

本文利用Flask框架進(jìn)行系統(tǒng)開發(fā)，搭建前、后端分離的可視化系統(tǒng)，同時(shí)引入Python數(shù)據(jù)分析工具來(lái)進(jìn)行數(shù)據(jù)挖掘。將數(shù)據(jù)分析與可視化結(jié)合，以此構(gòu)建大屏可視化系統(tǒng)，將其應(yīng)用于電商等行業(yè)，以充分挖掘數(shù)據(jù)背后的有用信息。并以此來(lái)構(gòu)建特定的營(yíng)銷策略，提高企業(yè)決策效率，對(duì)推動(dòng)商業(yè)智能的發(fā)展具有研究?jī)r(jià)值。

1 相關(guān)工作

1.1 商業(yè)智能

商業(yè)智能技術(shù)（Business Intelligence，簡(jiǎn)稱：BI）提供使企業(yè)迅速分析數(shù)據(jù)的技術(shù)和方法， 將數(shù)據(jù)轉(zhuǎn)化為有用的信息[5]。當(dāng)前，市場(chǎng)上有兩種BI類型。一是傳統(tǒng)BI，主要指內(nèi)部技術(shù)人員分析交易數(shù)據(jù)并生成決策報(bào)告。二是現(xiàn)代BI，主要指用戶與數(shù)據(jù)可視化系統(tǒng)間的交互，實(shí)現(xiàn)以更快、更直觀地分析數(shù)據(jù)來(lái)進(jìn)行決策[2]。

傳統(tǒng)BI模式的具體數(shù)據(jù)由下層往上層傳遞，會(huì)出現(xiàn)報(bào)表形式單一、表現(xiàn)力不強(qiáng)，時(shí)間存在滯后等問題，不能適應(yīng)當(dāng)下急速發(fā)展的數(shù)據(jù)時(shí)代[6]。

1.2 數(shù)據(jù)可視化

縱觀國(guó)內(nèi)外數(shù)據(jù)可視化技術(shù)研究[7]，較為流行的有：①前端可視化庫(kù)D3.js，將可視化、動(dòng)態(tài)交互和數(shù)據(jù)驅(qū)動(dòng)的DOM容器完美結(jié)合，高自由度操作，但學(xué)習(xí)難度高；②Plotly.js，便于實(shí)現(xiàn)動(dòng)態(tài)交互，但其支持的圖表種類太少；③Highcharts.js，可支持超過20種圖表的渲染，但其購(gòu)買成本較高；④Echarts.js，兼容性較高，支持多達(dá)20種的圖表，更方便圖表的使用和切換，其完全免費(fèi)、開源和易讀性，被廣泛應(yīng)用于大屏可視化領(lǐng)域。

1.3 主要相關(guān)技術(shù)

搭建大屏數(shù)據(jù)可視化系統(tǒng)的現(xiàn)有相關(guān)技術(shù)有很多，如jsp、aspx等系統(tǒng)開發(fā)技術(shù)，如plotly.js，Echarts.js等可視化技術(shù)，但本研究涉及的技術(shù)最主要有以下三類。

⑴ Echarts可視化庫(kù)：ECharts是開源免費(fèi)的可視化庫(kù)，基于JavaScript語(yǔ)言編寫，支持多圖表在同一DOM容器中混合展現(xiàn)，適用于目前流行的絕大部分瀏覽器，還具有高度自由化等優(yōu)點(diǎn)。

⑵ Flask框架：Flask是基于Python編寫的Web應(yīng)用框架，其WSGI工具箱采用Werkzeug，模板引擎則使用Jinja2。Werkzeug和Jinja2兩個(gè)核心函數(shù)庫(kù)，分別負(fù)責(zé)業(yè)務(wù)處理和安全方面的功能，提供眾多基礎(chǔ)組件。此外，該框架的基本模式為：在應(yīng)用端將函數(shù)分配給一個(gè)URL，當(dāng)用戶訪問該URL時(shí)，系統(tǒng)就會(huì)執(zhí)行分配好的函數(shù)，獲取函數(shù)返回值并將其顯示到瀏覽器上[8]。其工作過程如圖1所示。

⑶ Ajax技術(shù)：使用Ajax技術(shù)網(wǎng)頁(yè)應(yīng)用能快速地將增量更新呈現(xiàn)在用戶界面上，無(wú)須重載整個(gè)頁(yè)面，使得程序能夠更快地回應(yīng)用戶的操作。

1.4 研究方法

“5W1H”分析法，是管理工作中對(duì)目標(biāo)計(jì)劃進(jìn)行分解和決策的思維模式，為人們提供科學(xué)的工作分析方法[9]。強(qiáng)調(diào)對(duì)選定的項(xiàng)目從What，When，Where，Why，Who，How六個(gè)方面來(lái)考慮，從而提出行動(dòng)計(jì)劃和方案。

2 研究架構(gòu)

本系統(tǒng)采用B/S結(jié)構(gòu)[10]，在該結(jié)構(gòu)的基礎(chǔ)上將系統(tǒng)分為三層：數(shù)據(jù)層、服務(wù)層、應(yīng)用層，如圖2所示。

2.1 數(shù)據(jù)層：多源數(shù)據(jù)配置

數(shù)據(jù)層主要是為服務(wù)層的業(yè)務(wù)邏輯提供各類型的數(shù)據(jù)支持，清洗數(shù)據(jù)、存儲(chǔ)數(shù)據(jù)，將底層數(shù)據(jù)傳給上層業(yè)務(wù)邏輯層處理。

為了讓系統(tǒng)能適應(yīng)多種數(shù)據(jù)變化，并且在交互過程中能對(duì)圖表數(shù)據(jù)進(jìn)行聯(lián)動(dòng)修改，系統(tǒng)提供了靜態(tài)JSON數(shù)據(jù)連接和文件數(shù)據(jù)連接。前者可以是從API接口獲取到的實(shí)時(shí)數(shù)據(jù)，后者指將數(shù)據(jù)存儲(chǔ)到csv中，通過Python連接數(shù)據(jù)源并對(duì)其統(tǒng)計(jì)，然后轉(zhuǎn)化成JSON數(shù)據(jù)格式，以方便可視化表達(dá)編寫代碼的實(shí)現(xiàn)。

2.2 服務(wù)層：數(shù)據(jù)挖掘的實(shí)現(xiàn)

服務(wù)層是連接數(shù)據(jù)層與應(yīng)用層的橋梁，由Flask請(qǐng)求數(shù)據(jù)源并對(duì)數(shù)據(jù)進(jìn)行分類統(tǒng)計(jì)。

為了更好地實(shí)現(xiàn)數(shù)據(jù)分析，本系統(tǒng)選擇Python工具而非 SQLite數(shù)據(jù)庫(kù)，因此選用Flask框架，創(chuàng)新性地以Python實(shí)現(xiàn)后端，負(fù)責(zé)數(shù)據(jù)清洗，連接數(shù)據(jù)源，并對(duì)數(shù)據(jù)進(jìn)行建模處理，再通過路由器里定義的函數(shù)連接前后端，將處理后的數(shù)據(jù)進(jìn)行渲染，展示到前端。

2.3 應(yīng)用層：可視化組件配置

應(yīng)用層利用Echarts對(duì)服務(wù)層統(tǒng)計(jì)后的數(shù)據(jù)進(jìn)行渲染展示在前端頁(yè)面中，通過Ajax技術(shù)可以實(shí)現(xiàn)局部數(shù)據(jù)實(shí)時(shí)替換，提高渲染效率。

為了讓系統(tǒng)直觀化、易用化，在設(shè)計(jì)時(shí)要考慮其可視化布局的合理性以及靈活性。

最終，得到系統(tǒng)運(yùn)作圖如圖3。瀏覽器獲取靜態(tài)頁(yè)面，運(yùn)行js并向后端發(fā)起數(shù)據(jù)請(qǐng)求，應(yīng)用服務(wù)器（Flask）接收請(qǐng)求并向數(shù)據(jù)源（DataSource）請(qǐng)求操作數(shù)據(jù)。

3 系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

3.1 系統(tǒng)整體架構(gòu)設(shè)計(jì)

通過對(duì)系統(tǒng)的需求分析與架構(gòu)分析，可得到系統(tǒng)總體設(shè)計(jì)如圖4所示。系統(tǒng)前端為可視化配置，系統(tǒng)后端為數(shù)據(jù)源配置[7]。以某電商平臺(tái)的銷售數(shù)據(jù)為實(shí)驗(yàn)對(duì)象進(jìn)行分析，可視化配置可以分為四個(gè)模塊——銷售產(chǎn)品模塊、熱銷時(shí)段模塊、人口屬性模塊、地圖模塊。數(shù)據(jù)源可以接受實(shí)時(shí)API數(shù)據(jù)和本地的csv文件兩種，csv文件是經(jīng)由清洗過后的數(shù)據(jù)。

3.2 系統(tǒng)程序運(yùn)行設(shè)計(jì)

建立一個(gè)數(shù)據(jù)清洗文件data_clean.py，對(duì)csv文件進(jìn)行數(shù)據(jù)清洗，生成新的csv文件，data.py對(duì)新的csv文件進(jìn)行處理分析。

先對(duì)Flask框架實(shí)例化，繼而分發(fā)路由，通過render_template引入index.html，并根據(jù)后面?zhèn)魅氲臄?shù)據(jù)源，對(duì)html進(jìn)行修改、渲染。最終得到大屏可視化系統(tǒng)程序運(yùn)行的總流程圖如圖5。

3.3 主要功能實(shí)現(xiàn)

3.3.1 數(shù)據(jù)源配置

系統(tǒng)以某電商平臺(tái)的銷售數(shù)據(jù)為實(shí)驗(yàn)對(duì)象進(jìn)行分析，元數(shù)據(jù)來(lái)源于REES46電子商務(wù)的CDP平臺(tái)，經(jīng)過脫敏處理，描述的是2020年1月至2020年11月從一家大型家用電器和電子產(chǎn)品在線商店購(gòu)買的數(shù)據(jù)。

經(jīng)過數(shù)據(jù)類型轉(zhuǎn)換、缺失值填補(bǔ)、重復(fù)值刪除、異常值處理之后，由原來(lái)的564169行數(shù)據(jù)清洗為562149行數(shù)據(jù)，用于最終可視化分析統(tǒng)計(jì)。

3.3.2 可視化配置

系統(tǒng)采用Echarts渲染生成可視化圖表，并展示在前端的DOM容器當(dāng)中。Echarts圖表生成過程如下。

⑴ 實(shí)例化對(duì)象init

var myChart=echarts.init（document.getElementById（ ））;

調(diào)用Echarts庫(kù)的初始化方法，綁定DOM容器id，初始化之后會(huì)生成圖表實(shí)例。

⑵ 指定配置和數(shù)據(jù)Option

Option為js對(duì)象類型，其是Echarts實(shí)現(xiàn)可視化的核心部分。根據(jù)Echarts.js的官方教學(xué)文件，Option內(nèi)容包括但不局限于以下內(nèi)容：

① tooltip：提示框組件。提示指標(biāo)的每個(gè)數(shù)據(jù)項(xiàng)含義?？赏ㄟ^trigger觸發(fā)器決定其出發(fā)類型。

② legend：圖例組件。展現(xiàn)不同指標(biāo)的圖例，點(diǎn)擊圖例可控制指標(biāo)是否顯示，從而實(shí)現(xiàn)動(dòng)態(tài)變換效果。

③ toolbox：工具欄組件。其內(nèi)置有導(dǎo)出圖片，數(shù)據(jù)視圖，動(dòng)態(tài)類型切換，數(shù)據(jù)區(qū)域縮放，重置五個(gè)工具。

④ xAxis：直角坐標(biāo)系的橫坐標(biāo)。系統(tǒng)圖表的x軸中的data，是利用jinja2的引擎引用py的數(shù)據(jù)。yAxis同理。

⑤ series：系列列表?？稍谄渲幸?guī)定圖表類型（柱狀圖、折線圖、餅狀圖等），并可放入多個(gè)JSON數(shù)據(jù)，可實(shí)現(xiàn)同個(gè)DOM容器，不同的圖表內(nèi)容的展示。

⑶ 將配置給實(shí)例對(duì)象setoption

myChart.setOption（option）;

將上述配置后的Option傳給實(shí)例對(duì)象mychart，實(shí)現(xiàn)Echarts圖表渲染并展示在前端頁(yè)面。

⑷ 圖表跟隨屏幕自適應(yīng)resize

window.addEventListener（"resize"， function（） {

myChart.resize（）; }）;

在圖表渲染成功后，Echarts的resize（）方法可以獲取DOM容器的高度和寬度屬性大小，實(shí)現(xiàn)圖表的屏幕自適應(yīng)，與前端rem搭配，共同實(shí)現(xiàn)系統(tǒng)屏幕自適應(yīng)。

3.4 系統(tǒng)成果展示

系統(tǒng)開發(fā)完成后，此處對(duì)頁(yè)面進(jìn)行成果展示，如圖6所示。

按照“5W1H”分析理念，對(duì)系統(tǒng)進(jìn)行分塊展示[11]。What表示企業(yè)需要滿足顧客具體哪些需求，即哪種產(chǎn)品或品牌最受客戶青睞，本系統(tǒng)開發(fā)是由熱銷品牌（圖6①）和熱銷電子產(chǎn)品（圖6②）構(gòu)成。Who是價(jià)值所指向的對(duì)象，即目標(biāo)顧客或細(xì)分市場(chǎng)，本系統(tǒng)開發(fā)是由不同年齡段客戶（圖6⑤）和不同省份客戶分布（圖6⑥）構(gòu)成。When表示事件所發(fā)生的時(shí)間，可對(duì)應(yīng)客戶購(gòu)買需求旺盛的時(shí)段，主要由每月/時(shí)消費(fèi)情況（圖6③和圖6④）構(gòu)成。Where表示以上事件所發(fā)生的地點(diǎn)，系統(tǒng)以熱力圖的形式表明哪些地區(qū)消費(fèi)能力最高。Why是系統(tǒng)構(gòu)建過程中對(duì)數(shù)據(jù)從以上幾個(gè)維度進(jìn)行分析的依據(jù)。How是對(duì)系統(tǒng)所展示的各個(gè)模塊進(jìn)行分析之后的結(jié)果，企業(yè)可根據(jù)分析結(jié)果來(lái)制定相應(yīng)的處理措施和營(yíng)銷策略。

4 研究成果討論

利用“5W1H”分析工具[11]對(duì)實(shí)驗(yàn)所涉及的電子商店的銷售信息構(gòu)成進(jìn)行詳細(xì)的分析， 能更好地幫助企業(yè)設(shè)計(jì)適合自己的商業(yè)模式。由系統(tǒng)最終的分析結(jié)果可以得出以下結(jié)論。

⑴ What：samsung、apple、ava品牌為前三熱銷品牌，電子類、家電類產(chǎn)品較受歡迎，如冰箱、耳機(jī)、電視機(jī)等。

⑵ Who：40-50歲是主要客戶人群，占比約為30%，其余人群消費(fèi)情況差別不大。地域分布上以北上廣為主，廣東客戶是消費(fèi)主力，天津、湖南客戶消費(fèi)力較低。When：實(shí)驗(yàn)數(shù)據(jù)中第一個(gè)消費(fèi)高峰出現(xiàn)在5月，第二個(gè)高峰出現(xiàn)在7-10月，訂單集中在6：00-12：00。

⑶ Where：觀察訂單量的城市分布，發(fā)現(xiàn)廣東、上海、北京的訂單量最多。

⑷ Why：企業(yè)按照購(gòu)買力將顧客劃分成若干個(gè)顧客群，每個(gè)顧客群構(gòu)成一個(gè)子市場(chǎng)，不同子市場(chǎng)之間需求存在著明顯的差別。如對(duì)消費(fèi)人群進(jìn)行分析時(shí)，可以得到40-50歲的人群購(gòu)買力較高，20歲以下人群購(gòu)買力較低。

⑸ How：①銷售品牌維度上，電商平臺(tái)可多引入電子類和家電類產(chǎn)品進(jìn)行銷售，提高產(chǎn)品質(zhì)量，更多關(guān)注大牌產(chǎn)品。②銷售時(shí)段維度上，店鋪在五一假期、暑期、開學(xué)季和國(guó)慶等節(jié)假日期間應(yīng)多儲(chǔ)備貨物，保證貨源供給充足。③對(duì)于每日時(shí)段，中午時(shí)分是消費(fèi)高峰期，需要在該時(shí)間段維護(hù)好網(wǎng)絡(luò)穩(wěn)定。④消費(fèi)人群維度上，40-50歲的人群購(gòu)買力較高，可推薦價(jià)格較高的商品；對(duì)20歲以下人群主要推薦親民價(jià)格的商品。⑤地圖選址維度上，倉(cāng)庫(kù)的選址可多選擇在北上廣深一線城市上，可大大降低商品運(yùn)輸成本，針對(duì)一線城市客戶，要提高其售后服務(wù)，以提高客戶粘性。⑥此外，湖南、天津等地區(qū)消費(fèi)潛力巨大，因此可在該類地區(qū)加大宣傳力度。

5 結(jié)束語(yǔ)

本文從商業(yè)智能、數(shù)據(jù)可視化的相關(guān)背景知識(shí)出發(fā)，以決策分析的“5W1H”為指導(dǎo)方法，開發(fā)一個(gè)數(shù)據(jù)分析與可視化系統(tǒng)合為一體的大屏可視化的商業(yè)智能系統(tǒng)雛形。以電商銷售數(shù)據(jù)為例展開研究，可視化系統(tǒng)優(yōu)化了商業(yè)智能的數(shù)據(jù)分析思維模式，提高了決策效率，支持用戶更加及時(shí)、直觀、準(zhǔn)確地發(fā)現(xiàn)數(shù)據(jù)價(jià)值。

現(xiàn)實(shí)生活中還可將其應(yīng)用到金融、醫(yī)療等其他領(lǐng)域，通過數(shù)據(jù)分析進(jìn)行決策，服務(wù)于廣大行業(yè)。運(yùn)用大屏展示與動(dòng)態(tài)技術(shù)相結(jié)合，可以更直觀地讀懂?dāng)?shù)據(jù)背后所蘊(yùn)藏的大量信息，提高管理效率。結(jié)合嶄新的信息技術(shù)，可將其應(yīng)用于大數(shù)據(jù)時(shí)代下的商業(yè)智能，以期能推動(dòng)其向科研智能的轉(zhuǎn)化[12]。

參考文獻(xiàn)（References）：

[1] 陳國(guó)青，毛基業(yè)，曾大軍.信息管理、電子商務(wù)與商務(wù)智能[J].

科學(xué)觀察，2019（2）：38-41

[2] 暢玉潔.大數(shù)據(jù)背景下web數(shù)據(jù)的可視化研究分析[J].信息

系統(tǒng)工程，2018（1）：148，150

[3] 翟學(xué)強(qiáng).商務(wù)智能在企業(yè)內(nèi)部審計(jì)中的應(yīng)用研究[D].碩士，

山東財(cái)經(jīng)大學(xué)，2021

[4] 陳華.基于Python的數(shù)據(jù)分析與可視化平臺(tái)研究[J].網(wǎng)絡(luò)

安全技術(shù)與應(yīng)用，2022（2）：57-58

[5] 左亞菲.商業(yè)智能在我國(guó)的發(fā)展現(xiàn)狀、問題及其對(duì)策研究[C]//

“決策論壇——管理決策模式應(yīng)用與分析學(xué)術(shù)研討會(huì)”論文集（上）.[出版者不詳]，2016：191

[6] 饒仕才，朱文進(jìn)，張良軒.論商業(yè)智能在大型企業(yè)中的應(yīng)用[J].

天津科技，2013，40（2）：71-73

[7] 王寧.面向大屏的圖表展示系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[D].碩士，西安

電子科技大學(xué)，2019

[8] 王安瑾. 基于Flask的金融自動(dòng)化運(yùn)維平臺(tái)的設(shè)計(jì)與實(shí)現(xiàn)[D].

碩士，東華大學(xué)，2018

[9] 安娜.高校圖書館閱讀推廣5W1H分析法應(yīng)用研究[J].圖書

館工作與研究，2020（9）：89-95

[10] 王薈奧，蔡永香，楊岸霖，等.大屏數(shù)據(jù)可視化易用工具的研究

與開發(fā)[J].計(jì)算機(jī)系統(tǒng)應(yīng)用，2022，31（2）：114-119

[11] 張敬偉，王迎軍.基于價(jià)值三角形邏輯的商業(yè)模式概念模型

研究[J].外國(guó)經(jīng)濟(jì)與管理，2010，32（6）：1-8

[12] 胡志剛，王欣，李海波.從商業(yè)智能到科研智能：智能化時(shí)代

的科學(xué)學(xué)與科技管理[J].科學(xué)學(xué)與科學(xué)技術(shù)管理，2021，42（1）：3-20