“該項目案例由萬博思圖提交申報，參與數(shù)據(jù)猿推出的《尋找新冠戰(zhàn)“疫”，中國數(shù)據(jù)智能產(chǎn)業(yè)先鋒力量》的公益主題策劃活動。

疫情當(dāng)前 萬博思圖的企業(yè)責(zé)任與初心

一場突如其來的新冠疫情，讓全世界的人都始料不及。正值闔家團(tuán)圓的春節(jié)時期，中國卻拉開了一場生死時速的救援，海內(nèi)外社會各界紛紛行動起來，同心抗“疫”。在這場生死較量中，中國企業(yè)紛紛站了出來，結(jié)合自身業(yè)務(wù)模式，以技術(shù)、物資、服務(wù)等多種形式馳援戰(zhàn)疫，成為抗疫大潮中一道溫暖的風(fēng)景。
而萬博思圖自疫情初始就沒有缺席。春節(jié)期間，萬博思圖領(lǐng)導(dǎo)頭帶頭向武漢捐款，萬博思圖員工們雖然身在四方，卻積極響應(yīng)，通過各種渠道、形式支援武漢抗疫。

數(shù)據(jù)戰(zhàn)役 萬博思圖發(fā)力疫情監(jiān)測防控

疫情期間，謠言與真相齊飛，而疫情實時動態(tài)數(shù)據(jù)對于居民提高自我防護(hù)意識，做好疫情防控工作，起著至關(guān)重要的作用。而疫情數(shù)據(jù)的可視化呈現(xiàn)（包括地圖、圖表等形式），能夠讓大眾即看即懂，對疫情發(fā)展態(tài)勢和分布有更加直觀的了解，也能助力政府進(jìn)行疫情監(jiān)測管控。

作為一家數(shù)據(jù)可視化企業(yè)，為了切實支持疫情防控工作，萬博思圖全體員工放棄春節(jié)假期，臨危受命，于2月初緊急開發(fā)上線疫情可視化監(jiān)測大屏，幫助政府在疫情的可視化監(jiān)控、疫情態(tài)勢研判、資源部署調(diào)度等方面發(fā)揮作用，方便管理人員整體把握疫情，支撐科學(xué)決策，并面向政府機(jī)構(gòu)免費開放3個月，助力疫情防控。

疫情監(jiān)測防控指揮大屏1

疫情監(jiān)測防控指揮大屏2

除了通過大數(shù)據(jù)可視化助力科學(xué)防疫，公司也試圖從社會人文層面對此次疫情進(jìn)行探析。從2月初開始，萬博思圖陸續(xù)推出疫情熱點信息圖報告，希望以圖文結(jié)合、生動明晰的形式，解讀疫情中的經(jīng)濟(jì)民生百態(tài)，從更深入更全面的角度幫助大眾了解疫情、戰(zhàn)勝疫情。

在整個疫情可視化項目期間，萬博思圖深刻地了解了疫情數(shù)據(jù)呈現(xiàn)的邏輯，積累了豐富的疫情數(shù)據(jù)可視化經(jīng)驗，為新冠全球疫情地圖的上線做了鋪墊。

疫情蔓延，國際疫情追蹤成當(dāng)務(wù)之急

從3月底開始，國內(nèi)疫情趨于平復(fù)，而國際疫情加速蔓延，全球累計確診新冠肺炎病例和死亡人數(shù)不斷攀升，全球疫情陷入焦灼狀態(tài)。國內(nèi)疫情防控重點也開始轉(zhuǎn)向境外輸入防控。

為了追蹤全球疫情演變，同時幫助國內(nèi)做好國際人口流動管控，萬博思圖再次緊急上線新冠全球3D數(shù)據(jù)地圖疫情，以強(qiáng)大的系統(tǒng)交互、酷炫的視覺體驗，實現(xiàn)對全球疫情的可視化追蹤呈現(xiàn)。

項目開發(fā)起止時間

1、2020年4月6日項目正式啟動

4月初，國際疫情呈現(xiàn)加速蔓延趨勢，為了可視化追蹤國際疫情演變，助力國際人口流動管控，萬博思圖正式啟動新冠全球疫情可視化地圖項目。

2、2020年5月5日項目一期上線

克服了數(shù)據(jù)源獲取、前端可視化呈現(xiàn)等眾多挑戰(zhàn)，歷時1個月，萬博思圖新冠全球疫情地圖一期重磅上線，并正式面向大眾開放。

3、2020年6月5日項目英文版上線

萬博思圖新冠全球疫情地圖一期英文版上線。

應(yīng)用場景

本次上線的新冠全球疫情地圖，是一個具有強(qiáng)大交互功能的全球疫情數(shù)據(jù)實時呈現(xiàn)系統(tǒng)。它面向全球每一個關(guān)心疫情態(tài)勢的人開放，每個人都可以通過系統(tǒng)查看自己所在國家或所關(guān)心地區(qū)的疫情發(fā)展態(tài)勢。

整體立意創(chuàng)新 強(qiáng)大3D感知

為了以更藝術(shù)化、具象化的形式幫助大眾了解新冠病毒在全球的蔓延態(tài)勢，萬博思圖可視化設(shè)計師在系統(tǒng)首頁下足了功夫。

基于美國CDC發(fā)布的新冠病毒球體模型，可視化設(shè)計師創(chuàng)造性地模擬了人體肺部被新冠病毒入侵后的場景，并通過巧妙使用地球肌理，形象地展示了新冠病毒的入侵場景和全球疫情態(tài)勢。

使用鼠標(biāo)滾輪縮放，進(jìn)入首屏3D模式，主視覺由新冠球體變成3D疫情地圖，可立體感知各國疫情態(tài)勢。同時，系統(tǒng)支持3D立體與2D平面雙視圖切換，方便橫向比較各國的疫情風(fēng)險等級。

3D立體視圖

2D平面視圖

全球疫情熱力追蹤 實時權(quán)威數(shù)據(jù)

為了方便用戶更加直觀地評估、比較各國疫情風(fēng)險等級， 系統(tǒng)整體以熱力圖的形式呈現(xiàn)，從綠色至紫色，顏色越深，疫情風(fēng)險等級越高，越需要引起警惕。同時，熱力圖支持查詢各國、各地區(qū)現(xiàn)存確診、累計確診、累計治愈、累計死亡的實時數(shù)據(jù)，鼠標(biāo)挪至熱力圖上對應(yīng)國家板塊，各維度實時數(shù)據(jù)，數(shù)據(jù)實時更新，權(quán)威準(zhǔn)確。

多維指標(biāo)體系 疫情態(tài)勢多維呈現(xiàn)

除了全球疫情熱力地圖，系統(tǒng)通過設(shè)置 重點國家新增確診趨勢圖、全球累計確診現(xiàn)有確診趨勢圖、病死率國家TOP10排名等多維圖表，構(gòu)建起全球疫情態(tài)勢的多維疫情指標(biāo)體系。

重點國家新增確診趨勢圖

全球累計確診現(xiàn)有確診趨勢圖

病死率國家TOP10

重點國家數(shù)據(jù)聯(lián)動下鉆 疫情逐級探析

為了方便用戶重點了解某個國家的疫情態(tài)勢，系統(tǒng)提供強(qiáng)大的聯(lián)動下鉆功能，支持對單個國家的疫情數(shù)據(jù)進(jìn)行省/州/市下鉆，并聯(lián)動相應(yīng)數(shù)據(jù)圖表進(jìn)行展示。從宏觀的全球態(tài)勢，到微觀的省市疫情，系統(tǒng)構(gòu)建起了一個疫情逐級探析體系。

以美國為例，在平面視圖中點擊美國，即可下鉆展示美國疫情熱力地圖，同時，旁邊相應(yīng)的疫情圖表也會聯(lián)動變成美國疫情實時數(shù)據(jù)，方便對美國疫情進(jìn)行多維探析。

重點國家數(shù)據(jù)下鉆

強(qiáng)大時間軸組件 三級時間顆粒

系統(tǒng)底部設(shè)置萬博思圖自主研發(fā)的強(qiáng)大時間軸組件，并設(shè)置“年”、“月”、“日”三級時間顆粒，可逐級查看各時間節(jié)點的疫情數(shù)據(jù)。

同時，時間軸支持進(jìn)程播放，點擊播放按鈕，即可聯(lián)動系統(tǒng)其它圖表，動態(tài)查看某一時間范圍內(nèi)的疫情變化趨勢。

面臨挑戰(zhàn)

針對本次疫情可視化系統(tǒng)，為了能夠有一定突破和提升，在項目立項的時候就指定較高的目標(biāo)，因此我們付出了很多的努力和挑戰(zhàn)，最大的挑戰(zhàn)有以下5點：

1、首先可視化設(shè)計是可視化系統(tǒng)最重要的環(huán)節(jié)。針對本次可視系統(tǒng)設(shè)計我們更多的創(chuàng)新，從整體結(jié)構(gòu)，布局，動畫效果，數(shù)據(jù)表現(xiàn)方式以及每一處的色彩搭配，均需考慮采用了全新的設(shè)計理念和方式；

2、pc端尺寸及兼容性適配問題。一般定制化可視化項目是專門針對大屏端進(jìn)行設(shè)計開發(fā)的，所以我們需要對頁面和圖表組件進(jìn)行自適應(yīng)和兼容性的考慮；

3、業(yè)務(wù)操作邏輯繁多，數(shù)據(jù)聯(lián)動關(guān)系復(fù)雜。有統(tǒng)計數(shù)據(jù)圖表、時間維度數(shù)據(jù)、地理緯度數(shù)據(jù)，不同緯度數(shù)據(jù)間還需要聯(lián)動下鉆，比如地圖下鉆、單日疫情時間軸與地圖聯(lián)動、時間軸歷史數(shù)據(jù)播放與地圖數(shù)據(jù)聯(lián)動以及下鉆地圖的時間軸聯(lián)動等等多層級聯(lián)動邏輯開發(fā)需求；

4、pc端性能優(yōu)化。在展示形式上面我們有3D顯示要求、時間軸平滑操作要求，還有歷史播放接口的頻繁調(diào)取， 這一切的功能需求都對我們后端和前端的性能要求提出了巨大挑戰(zhàn)；

5、項目中對疫情可視化展示，要解決疫情數(shù)據(jù)源，疫情數(shù)據(jù)主要通過國家衛(wèi)健委和世界衛(wèi)健委官方網(wǎng)站發(fā)布。這兩個官方網(wǎng)站發(fā)布的疫情數(shù)據(jù)都不能直接用于可視化展示，數(shù)據(jù)必須經(jīng)過下載文本內(nèi)容，抽取疫情數(shù)據(jù)，清洗處理為結(jié)構(gòu)化數(shù)據(jù)才可以進(jìn)行可視化。

實施過程

該項目在我們不斷的打磨改進(jìn)，經(jīng)過努力，終于讓疫情數(shù)據(jù)以一種全新的展示方式呈現(xiàn)出來，既美觀絢麗，又簡單全面直觀的展示了疫情的演變歷程和當(dāng)前國美外實時狀況。

接下來將從美術(shù)設(shè)計，技術(shù)實現(xiàn)和疫情數(shù)據(jù)采集三個方面介紹本次項目的具體實施過程。

可視化設(shè)計創(chuàng)意

針對疫情系統(tǒng)的可視化展示，我們在外觀設(shè)計上也采用了全新的設(shè)計理念。

1、首先入場動畫我們采用了刺突糖蛋白與地球結(jié)合的形式形成了新冠病毒的形態(tài)，漂浮在人體的肺部，生動的體現(xiàn)了此次疫情對人類的傷害以及在全世界范圍內(nèi)的嚴(yán)重性。

2、當(dāng)鼠標(biāo)滾輪向上滑動，便進(jìn)入到了新冠全球數(shù)據(jù)地圖的展開頁面，整個頁面我們是從功能清晰，交互便捷的出發(fā)點上加上了我們的創(chuàng)意進(jìn)行最終的呈現(xiàn)。包括頁面中顏色的使用以及圖表的形態(tài)我們始終遵循一個理念：創(chuàng)意新穎、展示美觀、交互邏輯清晰。

3、在中央主視覺上，我們以顏色以及分布點的大小來區(qū)分了各個國家現(xiàn)存確診的數(shù)量以及累計確診的數(shù)量，并以在地圖上高低不同的柱來表示各個國家累計死亡的數(shù)量。并且當(dāng)鼠標(biāo)經(jīng)過某一國家，可以清晰查看該國家的現(xiàn)存確診、累計確診、累計死亡、累計治愈的具體數(shù)據(jù)。

4、在主視覺兩側(cè)的圖表中我們可以清晰直觀的看到全球的累計確診、現(xiàn)有確診、新增確診、累計死亡、累計治愈等具體數(shù)據(jù)以及發(fā)展趨勢。在圖表上我們不僅是形態(tài)上的創(chuàng)意，顏色的使用上我們也從美觀與功能上也充分考慮了整個頁面的和諧統(tǒng)一，例如：黃色代表確診、紅色代表死亡等。

5、通過鼠標(biāo)滾輪的操作我們可以無縫下鉆到平面世界地圖，更加方便查看各個國家的疫情數(shù)據(jù)。

6、下方的時間軸我們設(shè)計了歷史回放按鈕，可以從時間選擇框內(nèi)選取想要觀看回放的時間區(qū)間，點擊回放按鈕，在歷史回放的過程中，中間主視覺地圖的變化可以清楚生動的看到這個時間區(qū)間內(nèi)各個國家的累計確診與現(xiàn)存確診在選定時間范圍內(nèi)的發(fā)展變化趨勢。

可視展示技術(shù)

我們從架構(gòu)、技術(shù)選型、數(shù)據(jù)對接上都做了相對應(yīng)的實施方案，以確保項目的落地成型。

1、保證客戶在觀看的時候有良好的用戶體驗，也便于項目傳播推廣。

2、技術(shù)選型上，我們針對地圖部分采用了WebGL技術(shù)，做到了從新冠球體到疫情地球再到平面地球，最后下鉆到國家層面地圖的平滑過渡；對3D編程也使用了GLSL編程方式，這樣能充分調(diào)動硬件性能，提高渲染效率。

3、數(shù)據(jù)對接上的難點主要在于時間軸的聯(lián)動和歷史數(shù)據(jù)的播放，這主要取決于時間軸組件的設(shè)計架構(gòu)和數(shù)據(jù)接口對接是否合理。我們設(shè)計的時候按歷史播放數(shù)據(jù)和地圖鉆取數(shù)據(jù)進(jìn)行了詳細(xì)區(qū)分和篩選，以減少歷史播放時實時變化的圖表數(shù)量來控制前端顯示的性能開銷；在數(shù)據(jù)上我們也是主要針對歷史數(shù)據(jù)進(jìn)行數(shù)據(jù)流的形式處理數(shù)據(jù)，這樣就能讓歷史數(shù)據(jù)播放的時候能更平滑流暢。

數(shù)據(jù)采集

為了保證數(shù)據(jù)的權(quán)威性和可持續(xù)采集，我們先后嘗試了各種方案，如直接爬取騰訊、百度、國家疫衛(wèi)健委官網(wǎng)情等疫情數(shù)據(jù)或接摘錄疫情網(wǎng)站的數(shù)據(jù)。這些方案前者會被不斷改變的反扒技術(shù)限制，數(shù)據(jù)采集存在不可持續(xù)性，后者工作量太大。同時也考慮過一些第三方服務(wù)接口，但是這些接口數(shù)據(jù)不完整。經(jīng)過分析后還是覺得國家衛(wèi)健委官網(wǎng)和世界衛(wèi)健委官網(wǎng)數(shù)據(jù)源最權(quán)威可靠。

因此，通過以下兩種方式解決國內(nèi)和世界疫情數(shù)據(jù)的采集。

1、采集國家疫情數(shù)據(jù)。我們先從國家以及各省衛(wèi)健委官網(wǎng)將每天發(fā)布的疫情內(nèi)容保存為html文件，然后通過本地解析頁面DOM元素找到疫情內(nèi)容，抽取疫情數(shù)據(jù)，結(jié)構(gòu)化后持久化存儲。

國家衛(wèi)健委官網(wǎng)疫情數(shù)據(jù)

處理持久化的國家疫情數(shù)據(jù)

2、世界疫情數(shù)據(jù)采集。從世界衛(wèi)健委官網(wǎng)下載發(fā)布的疫情數(shù)據(jù)pdf文件，在本地批量解析pdf文件的中數(shù)據(jù)表格內(nèi)容，抽取疫情數(shù)據(jù)持久化存儲。

世界衛(wèi)健委官網(wǎng)疫情數(shù)據(jù)

處理持久化的世界疫情數(shù)據(jù)

3、經(jīng)過計算，翻譯處理后數(shù)據(jù)通過接口，提供疫情標(biāo)準(zhǔn)的JSON格式數(shù)據(jù)為各種可視化圖表提供實時可篩選查詢的數(shù)據(jù)。

應(yīng)用效果

與國外約翰霍普金斯大學(xué)推出的“網(wǎng)紅世界疫情地圖”相比，萬博思圖推出的新冠全球疫情地圖更加符合國內(nèi)用戶的閱讀習(xí)慣。同時， 大量創(chuàng)意交互元素的加入，也使得該系統(tǒng)在可視化呈現(xiàn)上更為出色，為用戶多角度、自由地發(fā)掘更多的信息提供了環(huán)境和條件，提升用戶體驗的流暢度。
 
系統(tǒng)一經(jīng)上線，便獲得網(wǎng)易新聞、搜狐網(wǎng)、極客網(wǎng)、國際在線、中國網(wǎng)、techweb、CSDN等數(shù)十家新聞媒體的轉(zhuǎn)載報道，各網(wǎng)站紛紛轉(zhuǎn)載，成為新的“網(wǎng)紅疫情地圖”，在可視化行業(yè)領(lǐng)域內(nèi)收獲了良好的口碑，平臺的日均訪問量也激增至1萬+。

為了能讓更多用戶了解到這樣一個方便強(qiáng)大的疫情數(shù)據(jù)可視化平臺，我們也積極在微博、B站、抖音、知乎等社交平臺上做了推廣，全網(wǎng)共獲得超千萬次曝光和點贊。很多用戶給萬博思圖留言互動，正如一名普通用戶在B站給萬博思圖的留言所說“疫情期間，能擠出寶貴的企業(yè)經(jīng)營時間，耗費人力物力開發(fā)這樣一個疫情可視化平臺，真的是難能可貴了。”

通過新冠全球疫情地圖項目，萬博思圖不僅履行了自己的社會責(zé)任，為疫情防控貢獻(xiàn)出科學(xué)的力量，更證明了自己在可視化領(lǐng)域的實力。在未來，萬博思圖將繼續(xù)堅守自己的初心與責(zé)任，持續(xù)優(yōu)化改進(jìn)，為疫情防控提供更加強(qiáng)大優(yōu)秀的可視化產(chǎn)品。

關(guān)于萬博思圖

萬博思圖（webstudio)，國內(nèi)卓越的大數(shù)據(jù)服務(wù)知名品牌，專注數(shù)據(jù)可視化分析與展示、可視化系統(tǒng)可視化產(chǎn)品（萬博DataVis)、企業(yè)官網(wǎng)建設(shè)與運維、營銷推廣。自2007年成立以來，堅持以品質(zhì)立足、創(chuàng)新驅(qū)動發(fā)展，提供各行業(yè)領(lǐng)域及應(yīng)用場景全覆蓋的數(shù)據(jù)可視化分析展示與官網(wǎng)營銷解決方案。

經(jīng)過多年的市場拓展，萬博思圖業(yè)務(wù)廣泛覆蓋智慧城市、智慧物流、工業(yè)互聯(lián)網(wǎng)、物聯(lián)網(wǎng)、新能源、生產(chǎn)可視化、網(wǎng)絡(luò)安全、汽車、智慧零售、電商、園區(qū)管理、經(jīng)濟(jì)民生、教育服務(wù)、綠色環(huán)保、政務(wù)系統(tǒng)等11個行業(yè)及8個應(yīng)用場景。

近年來，萬博思圖積極布局物聯(lián)網(wǎng)業(yè)務(wù)，加大物聯(lián)網(wǎng)應(yīng)用探索力度，并加速推進(jìn)“軟硬一體化‘’進(jìn)程。在整個產(chǎn)業(yè)生態(tài)中，我們致力于成為以應(yīng)用服務(wù)與運營為核心的整體解決方案提供商和服務(wù)商。

公司擁有豐富的設(shè)計經(jīng)驗、深厚的技術(shù)底蘊(yùn)搭建核心團(tuán)隊，秉承著匠人精神，提供可視化高端定制服務(wù)，先后服務(wù)于國家互聯(lián)網(wǎng)應(yīng)急中心、華潤電力、百度、京東、泰康、順豐、德邦、福田、寶沃、奔馳等國家各機(jī)關(guān)單位、央企、大型品牌集團(tuán)。

萬博思圖以成為最值得信賴的大數(shù)據(jù)可視化服務(wù)第一品牌為愿景， 承載時代賦予的使命，展示數(shù)據(jù)魅力、洞悉數(shù)據(jù)價值，助力萬千企業(yè)實現(xiàn)數(shù)據(jù)驅(qū)動的精細(xì)化運營。

來源： 數(shù)據(jù)猿