HTML5如今已經(jīng)成為移動(dòng)開(kāi)辟的另一個(gè)核心，關(guān)于native app和web app以及雜交app的評論辯論也已經(jīng)不少。本來(lái)光線(xiàn)四射的Flash，Adobe公司公布放棄移動(dòng)版的開(kāi)辟，而轉向更大力度的支撐HTML5。固然說(shuō)HTML5里的Canvas可以在往后調換Flash，但小我感覺(jué)似乎也不樂(lè )觀(guān)，我們來(lái)說(shuō)幾件工作吧。

近十年前就看到flashk（一個(gè)組織后來(lái)就滅亡了）做過(guò)一個(gè)基于flash的管網(wǎng)體系，那時(shí)辰就感覺(jué)用flash做一個(gè)地圖引擎，那應當是多牛。

后來(lái)感覺(jué)SVG不錯，我都有點(diǎn)同GML有點(diǎn)相提并論了，但SVG至今依然不是HTML5的一項目組，并且這么多年也沒(méi)有一個(gè)牛的應用是用SVG做的，固然SVG看起來(lái)挺強大的，支撐熱點(diǎn)、支撐內嵌js等，并且很多瀏覽器對SVG的支撐也不錯。（最早有見(jiàn)過(guò)用SVG來(lái)做地圖的，那應當在我06年時(shí)寫(xiě)博客有提到過(guò)，但那時(shí)辰瓦片地圖都應當是在大師盡力研究的狀況吧）

昨天晚上開(kāi)端研究百度的地鐵地圖，是用flash做的，矢量化的，做的還是挺摩登的，我一向很喜好，但移動(dòng)設備根蒂根基上不克不及用（對flash不支撐或者支撐不佳）。研究這個(gè)器材呢有兩個(gè)意圖，一是把它離線(xiàn)，讓其他網(wǎng)站也能用，另一就是想直接看看他們的數據，畢竟成果本身做數據還是斗勁累人的。如今的成果是，本地顯示根蒂根基OK，項目組功能不成用（比如路徑演算就必然是須要辦事端支撐的，發(fā)明地鐵的路徑演算竟然是百度地圖的一個(gè)項目組，演算完畢后地鐵法度解析獲取到的JSON數據，可能地鐵換乘也算是百度步行導航演算的一個(gè)項目組吧，我卡殼的是地鐵的JS不克不及獲取JSON以及解析，不知道是否和跨域有必然的關(guān)系否）。地鐵數據項目組，也已經(jīng)看到數據，是一個(gè)二維平面下的一系列坐標點(diǎn)湊集，籌辦導出來(lái)看看可否直接成圖。

今天花了一點(diǎn)時(shí)候，把HTML5中的Canvas章節，簡(jiǎn)單的瀏覽了一遍。固然有不少的函數，但似乎同畫(huà)圖對象有所類(lèi)似了，讓我想到了mapinfo，什么畫(huà)線(xiàn)、畫(huà)面、畫(huà)圓、畫(huà)弧線(xiàn)、填充色彩、設置包邊的粗細和色彩等等等。我在想：若應用HTML5畫(huà)圖，那不僅僅是要將地圖繪制一遍（獲得坐標把握點(diǎn)），更須要將地圖經(jīng)由過(guò)程JS說(shuō)話(huà)往來(lái)交游實(shí)現一遍。OMG，想起來(lái)就感覺(jué)有點(diǎn)頭大，莫非flash昔時(shí)也如此麻煩？即便flash如此麻煩，那也至少是有可視化編輯景象的，那HTML5的畫(huà)圖是否會(huì )有可視化的編輯景象呢？（也許只是我還沒(méi)有發(fā)明吧）。別的補充一句：flash的題目確切斗勁多，比如很是占用CPU、斗勁耗電，那么HTML5的Canvas就不會(huì )有這題目嗎？

后來(lái)搜刮“HTML5 Canvas map”的時(shí)辰，看到兩個(gè)地圖，一個(gè)世界地圖，另一個(gè)是美國地圖，都是用HTML5繪制的，忽然感覺(jué)HTML5繪制地圖看起來(lái)欲望很大嘛，于是研究了一下這個(gè)開(kāi)源的美國HTML5地圖，但簡(jiǎn)單看了下，就感覺(jué)怕了，因為：美國地圖繪制的固然摩登，但繪制的那一系列平面坐標點(diǎn)是如何而來(lái)的呢？當然，不打消是有對象的，但我感覺(jué)，若要做到如許，那是多么的艱辛那（看他的Map.js文件，統共近1300行，地圖數據就占領(lǐng)了一半）。有愛(ài)好的伴侶就去看看吧：http://dougx.net/map/usmap.html

不過(guò)，既然HTML5大勢如此，那HTML5的將來(lái)必然是殘暴的，只是，可以獲得一個(gè)結論是：在沒(méi)有一個(gè)好用的對象之前，用HTML5來(lái)繪制地圖，是一件很是很是麻煩的工作，更不消說(shuō)將HTML5的畫(huà)圖做成引擎，實(shí)現放大縮小平移以及熱點(diǎn)響應事務(wù)等操縱了?？吹揭粋€(gè)HTML5做的巨牛網(wǎng)站，甚是欣慰，動(dòng)畫(huà)結果同flash有的一拼，觀(guān)摩地址：http://www.ro.me/。（固然是結果巨牛的HTML5動(dòng)畫(huà)網(wǎng)站，但工程其實(shí)挺大的，查看源文件，發(fā)明一個(gè)頁(yè)面加載了90多個(gè)功能js，畫(huà)圖js也是讓人目炫的坐標系列，看下這個(gè)文件會(huì )不會(huì )嚇到你，呵呵）

總結幾句空話(huà)：

1、做件工作很不輕易

2、對象（或者說(shuō)是框架或引擎之類(lèi)的器材，比如openlayers引擎、jQuery框架等）很有效

3、可用性和易用性很關(guān)鍵

最后問(wèn)大師一句：你會(huì )用HTML5去繪制地圖否？

---