?????? 星期一的早上，我在辦公區鳥瞰窗外，目光所到之處，用顧城的那首“你看天時很近，看我時很遠”倒是格外的應景。作為一名父親，看著工位上3M的口罩，想想此刻還在熟睡的孩子，多少有些無奈——又是PM25指數200+的一天。這么大的中國，如何給孩子找一方凈土，讓孩子能夠健康快樂的成長。正是帶著這樣的一個想法，我查詢了幾個我比較關注的城市的PM值，比如北京，成都，杭州，深圳，廈門等地方，都不理想，一種趕盡殺絕的節奏，難道在中國只能做君子，自強不吸？同時，我個人發現一個情況，我的手機是華為榮耀6plus，天氣數據顯示來自中國天氣網，PM25指數相比AQI（Air Quality Index）上的要偏低。比如我所在的城市成都，此刻手機上顯示PM25指數為162，而AQI上顯示為212，對比如下：

?????? 這個過程中，體現了我對數據的三點需要：實時性，準確性和易對比。首先數據必須是準確的，及時的，這樣最有價值，這兩點不難理解。易對比的涵義則比較寬泛，并沒有一個絕對的標準。首先數據量上要豐富，這樣客觀上才有有代表性，其次可視化上要便于理解，比如數據都有自己的大小和位置，如何形象高效的展現這些信息，怎樣把數字更好的轉化為易于人類感官理解的形式，最后就是一個抽象的過程，提煉有價值的數據，降低過多數據帶來的噪音。當然，我在做這個小應用的時候并沒有考慮這么多，只是做完后自己的總結知新，看似有用，實則完全為了提升逼格。

????? 帶著這些疑問，我個人認為，AQI的數據是全球各個監測站的數據，更原始一些，更具有代表性和權威性，在中國呆久了，如果不對政府提供的數據有懷疑，只能證明自己too young too naive了。所以很自然的覺得AQI的數據在準確性和實時性上是目前的最佳選擇。而且我知道某網站上是有實時的全球的AQI數據，反編譯代碼獲取里面請求數據的方法應該可行。所以，從技術上是可以搞定數據需求的。

?????? 有了數據，可視化上如何展示呢，如何找到一種直觀，簡單的形式來？作為一個GIS行業的 碼農 Coder（以前我并不介意碼農這個稱呼，但工作時間越久，發現真的大部分程序員只配做碼農，所以本著謙讓的態度，還是把這個稱號讓給他們吧），當然要在地圖上展示了。這是某網站上的一個展示效果，也是我的參照物，這里通過地圖來解決對經緯度的理解，通過數字和顏色來解決對PM指數的感官體驗：

?????? 但從細節處，我覺得還可以做到更好，第一，地圖本身就是對地球的一次抽象，因此這個抽象過程中，在數據的形象和對比上是存在損失的，第二，該網站的技術較為傳統，數據都是以HTML標簽的形式來展現，在數據較大的情況下存在性能的瓶頸，第三，如下圖，按照AQI的標準來做的顏色區分，但這個Level是區間分段的方式，而不是單值的一一映射的關系。比如PM值300和500是有差別的，但卻對應同一個顏色，可以更好的體現這種差別。

?????? 當我看到這里就想到用球的形式來展現全球的PM數據，應該會有一個不錯的視覺效果，而且也可以很好的體現WebGL在大數據渲染上的性能優勢，這是吸引我的一個因素。同時我覺得霧霾目前是一個大眾比較關注的問題，所以不應該只是我一個人的小眾喜好，對很多人或地球人而言都是一個興趣點，坦白說，我當時覺得想想就好，上班了，撞鐘時間開始了。這時候是羅胖的一句話開導了我“如果一件事情可做可不做，而你又有時間做的話，那你最好去做，萬一有什么意料之外的收獲的，這就是機會”。開工。

?????? 首先就是反編譯某網站的JS代碼，把請求PM數據的url和參數規范找到，url里面竟然有key參數，所以就得看看在自己的環境下是否能走通。說明一下，據我了解，該網站是一個在中國北京？居住的外國人搞的，而且數據比較敏感，畢竟有損墻國形象，我從AirNow網站取到的中國數據才幾十個監測點，就可以看到墻國對該數據的重視程度。所以我是出于尊重該網站，欽佩作者的這種精神而刻意不分享。而如果你有這個能力做到這個事情，也希望你能夠保護它而不是謀私。有了數據，直接在WebGL Earth下展現的效果：????

?????? 這樣一個完整的流程算是走通了，下面就是渲染效果了。最開始，我是希望能做成熱點圖那種效果的，午飯時間也在思考這個問題，主要是原始數據結構，還有工作量兩個要素，對這樣一個實時的數據做全球的熱點圖，至少需要服務端能夠對數據存儲策略和傳輸方式上做優化，假設全球有10萬個監測點（遠遠大于實際數），位置，監測站名稱這類不會頻繁變更的內容，都可以放在配置文件中，通過ID來索引，唯一變化的就是pm25這個數值，一個unsigned short就足夠了，這樣全球數據就是10萬字節，約等于100K，這樣數據量就小太多了，完全可以做到實時的全球范圍的數據傳輸，而目前json格式，基于可視范圍的呆滯型傳輸就不行了。服務端怎么來做這個優化呢，其實可以每小時做一次更新，生成一張紋理圖片，紋理值就是pm的數值，以后還有其他數據，比如pm10，臭氧或硫化物，風向等都是一個思路，這樣也是一個不錯的數據優化策略。所以，不管你怎么繞，最后服務端不吊你，你也沒轍。

?????? WebGL的優勢在于能夠發揮顯卡的性能，所以盡管在數據傳輸和解析上需要受限于服務端，但在渲染上還是有不錯的自由度，退而求其次，根據PM25值做一個點的單值專題圖，也是可接受的。通過批次，即使點數據量很大，渲染上并不會造成瓶頸。于是我決定選擇點+顏色的展現效果，其實這就和某網站的展現方式很相似了。總得做出一個微創新吧，那好，你是分段專題圖效果，只有6個顏色，我就給你搞一個漸變顏色（如上圖），這個也難不倒我，先搞一個0~500的色帶，其實就相當于一個哈希表，然后根據PM值對號入座，有了PM值->顏色這個映射表，只需要初始化時先創建色帶的消耗而沒有額外的計算，算是性能優化上的一個技巧。這是目前的效果，依次為中國&日韓，歐洲和美國，看完后整個人的心情都不好了：

?????? 如上，基本上要做的都已經結束了，但實際瀏覽的時候還是會有卡頓的現象。當然，我可以歸咎到請求的數據是JSON格式，而Earth瀏覽的范圍都比較大，且是實時的，所以這是性能瓶頸。我個人也覺得這是一個很充分的理由。計算需要消耗，請求需要等待，但通過Workers技術，可以把這部分放到線程中，避免卡頓的效果。這也是前端代碼可以優化的一點。于是昨天晚上我又對代碼進行了優化，把大量的請求，漸變色計算，json解析等工作都放到Workers線程來完成，主線程主要負責Earth球本身的內容。至此，我覺得對于這樣一個應用，可以告一段落了。

?????? 總結這個過程，我覺得有三點收獲，第一，無論簡單還是復雜的事情，在理論上都要講的通，模型是簡單的，這個范例級別的應用，本質上就是AQI+顏色分段，所以AQI數值要具有準確實時易對比的特點，同時顏色的意義也是有依據的，不是自己憑空捏造的。第二，目前各類實時數據很多，數據固然有價值，但該應用的本質并不是獲取數據，而是過濾數據，是對數據的一次加工，在廣度和深度上抓住數據對人類有價值的部分。我覺得在大數據時代，獲取數據的渠道會很多，數據固然重要，但關鍵還在于過濾數據的能力，這種應變能力可以有效的降低噪音，通過數據的加工而產生服務價值。

?????? 第三點可能有點牽強，但我最想借題發揮了，所以單獨列出來。前幾天聽了吳軍講的眾籌經濟，吳軍老師通過滴滴，Airbnb舉例說明通過資源的有效整合擴大了市場的規模，分析了未來經濟的發展趨勢。個人認為，所謂的眾籌，如何能夠突破零和博弈，通過市場規模的擴大而達到共贏，要做到這點并不容易。正好在TED里聽到的一個老外的演講，也舉了滴滴，Uber和Airbnb的例子，我覺得總結的更深刻。關鍵在于信任（Trust）：首先，你要認可這個想法，愿意嘗試，其次，你認可這個平臺，愿意使用，最后，基于已有的這種認可，基于這個平臺，你愿意相信你不認識的人。通過這三個層次的信任達到共贏，可以有效整合資源，別人能夠更容易的得到有價值的資源，自然也愿意購買這種資源，這樣的良性循環可以更好的擴大市場規模。套用這個想法，如果我繼續做這個PM的應用，該怎樣繼續呢？首先，PM值是當下大眾很關心的一個內容，如何高效，及時，準確，全面，形象的，有針對性的展現出來，這個想法是有價值的，從這個點子來看是經得起考驗的。其次，要做一個有影響力的平臺，除了數據的權威性，其次就是數據的統計分析可視化以及個性化，比如歷史數據的推演，預報預警，多樣的可視化效果，通過服務端了解用戶的焦點，基于位置的個性化推送，內容深度和廣度的綜合性，提高大家對平臺的認可。

?????? 好了，以上就是一個大概流程和本人事后的思考，雖然并不能改變什么現狀，但我想，環保面前，人人無法逃避，人人都可以盡力而為。對我個人而言，如果不能用手改變，那就只好用腳改變了。

總結

以上是生活随笔為你收集整理的全球PM25实时可视化的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。