eCharts提供了遷徙圖、熱點圖、夜視圖等跟地圖能夠很好的結合起來的資料展示方式。但是如何将eCharts和我們的AGS JS架構以及自身的地圖相結合，是一個很值得研究的地方。我所在小組中的一位同僚上兩周作為主力對eChart和我們目前所使用的AGS JS的結合做了一些研究，取得了不錯的進展。我本人對其研究進行了跟進，這裡作為二傳手，将這些進展以及效果做一個小的總結，同時也利于我對他研究的進一步學習。感謝我這位優秀的同僚。
series中的geoCoord參數是用來設定标注點地理坐标的。标注點是否能正确疊加到我們釋出的地圖上，此參數至關重要。
首先，我們将此參數中的值設定為與我們釋出的地圖相吻合的坐标值。比如，我們地圖是使用的XIAN1980 的坐标系，以117度為經線做高斯投影後的地圖。此時的參數我們設定為：
我們研究eChart的源碼可以發現，每個标注點之是以能顯示在地圖上，是因為它内部會首先在geoCoord中讀取到該點的地理坐标，然後轉換為此時的螢幕坐标。但是，如果我們已經給每一個标注點的X和Y賦予了值後，eChart内部會直接使用該值而不再自身進行轉換。以下為eChart内部的該源碼部分：
在了解了此過程後，我們便有了如下思路：
a.繼承AGS上的基類Layer，擴充出一個eChartLayer。
b.将eChartLayer添加到AGS的Map中。
c.周遊Option中的Data，利用AGS提供的toScreen方法直接将geoCoord中的坐标點轉換為此時的螢幕坐标，并賦予各标注點的X和Y。
通過測試，很好的解決了标注點能正确顯示在地圖上的問題。
在将我們所寫的eChartLayer加入到Map中後，我們會發現，每次地圖開始平移時，eChart上的各種效果便開始不斷的處于重新整理重繪狀态。
解決思路時，監聽地圖的平移事件，對eChart進行重繪控制。
eChart官網上提供的示例，因為是靜止的，不會出現該問題。但是當把它們疊加到地圖，對地圖進行平移、放大、等需要經常重新整理重繪的用途上時便會發生某些功能失效的問題。
比如，下圖所示，當我們點選了圖例中的案件數量時，以案卷數量為标題的标注點都會消失。但當我們平移地圖後，是以位置點進行重繪時，相關設定便失效，之前消失的标注點又會被重繪出來。
這裡說一下我們自身的解決方法。
我們的思路時，将重繪分為兩種，一種是重新參數綁定，一種是隻改變标注點XY坐标的重繪。對于上述操作，我們進行隻改變标注點坐标的重繪方式。該問題解決。
在eChart中有大量的instanceof Array這樣的代碼。但是我們發現在Iframe中，此處會報出錯誤。是以如果在Iframe中應用eChart時，需要改寫eChart中與此相關的代碼。
熱點圖：
熒光圖：
遷徙圖：
eCharts中的地圖顯示部分提供了對GeoJson的支援。我們可以利用矢量切圖生成各個GeoJson檔案，然後通過eCharts對各矢量檔案進行展示。由于eCharts本身使用的HTML5進行渲染，對大資料渲染支援的很好，我們既可以解決加速請求矢量資料的問題，也能解決大資料渲染問題。
如果您覺得本文确實幫助了您，可以微信掃一掃，進行小額的打賞和鼓勵，謝謝 ^_^