Esri的開源JS項目雜談

   一提到Esri你們首先想到的是龐大的ArcGIS產品你們族，其產品包含從桌面端，到服務器/雲端，再到web/移動端。做爲一名極客，不聊開源逼格彷佛上不去啊。其實，Esri做爲一個開放的平臺，不只有穩定強大的商業軟件也有不少好玩實用的開源項目。今天咱們就來聊聊Esri的那些JS的開源項目。

首先要給你們隆重介紹一下Esri在Github上的主頁（這年頭，沒個Github主頁都很差意說本身是程序員）

http://esri.github.io/

裏面有衆多Esri的開源項目，不只有JavaScript的還有C++、C#、python、Java…那爲啥今天只聊JS開源，那是…其實小編是作前端的啦，嘿嘿！

經過組織內搜索，咱們找到了155個JavaScript的項目，固然這裏面有很大一部分都是小的實驗項目，今天小編就爲你們介紹幾個實用的開源項目。

 

• esri-leaflet

leaflet是一個輕量級的展示交互式地圖的開源的JavaScript庫。其官網的訪問地址爲：http://leafletjs.com/

Esri在其基礎上擴展了這個庫的服務接入能力，使其能夠接入ArcGIS服務器發佈的切片服務、要素服務、動態地圖服務以及影像服務。這個庫對於Esri來講並非要替代原有的ArcGIS API for JavaScript，而是爲WebGIS的開發提供一個新的選擇，利用leaflet能夠快速上手構建一個基於地圖展現的簡單WebGIS應用，想開發一個功能強大的WebGIS？想展現三維模型？仍是老老實實用ArcGIS API for JavaScript吧！

esri-leaflet庫的文檔及demo訪問地址：http://esri.github.io/esri-leaflet/

開源庫的Github下載地址爲：https://github.com/Esri/esri-leaflet

• bootstrap-map-js

提到bootstrap前端開發人員應該都有所耳聞，因其漂亮的UI和方便的調用普遍的應用於Web端的程序的界面設計（https://getbootstrap.com/）。那你是否嘗試將bootstrap與ArcGIS API for JavaScript配合使用？相信大多數人使用bootstrap是採用bootstrap+jquery的形式，卻不知bootstrap早已開發出了dojo擴展模塊（http://xsokev.github.io/Dojo-Bootstrap/）

bootstrap-map-js項目在bootstrap庫的基礎上開發了一個輕量級的擴展插件用來構建地圖應用（目前還只能用於3.x版本的ArcGIS API for JavaScript）經過bootstrap-map-js能夠在地圖上添加bootstrap風格的控件，而且能夠實現多種屏幕尺寸應用的自適應效果。

由於ArcGIS API for JavaScript是基於dojo構建的，因此這個庫的引用方式有兩種，一種是dojo+jquery的方式另一種是純dojo的方式。

文檔及在線demo能夠訪問：http://esri.github.io/bootstrap-map-js/demo/ 

開源項目下載地址爲：https://github.com/Esri/bootstrap-map-js

給你們感覺一下bootstrap風格的WebGIS應用，是否是跟平時的demo畫風不太同樣…

另外在ArcGIS API for JavaScrip 4.0中UI進一步的開放，不只bootstrap，其餘的第三方UI庫也能方便的接入到應用中。

• angular-esri-map

要說今年什麼前端庫最火，jQuery？no，那已經成爲過去時了，最火的前端庫非AngularJS莫屬，Angular.js 是一個MV*（Model-View-Whatever，無論是MVC或者MVVM，統歸MDV(model Drive View)）JavaScript框架，其是Google推出的SPA（single-page-application）應用框架，其爲咱們的web應用開發增長很多魔法變換。官網地址：https://www.angularjs.org/

   angular-esri-map正是在此基礎上對ArcGIS API for JavaScript進行封裝使其能夠在AngularJS中使用，Angular 1.x可使用ArcGIS API 3.15以上版本，Angular 2.0可使用ArcGIS API for JavaScript 4.0版本（也就是說能夠支持3D展現）。

        文檔及demo的在線訪問地址爲：http://esri.github.io/angular-esri-map/#/home 。

        開源項目地址爲：https://github.com/Esri/angular-esri-map

 

• Story Maps

 還記得上個星期那一組炫酷的地圖故事模板麼？地圖與炫酷的插圖和視頻聲音等多媒體配合真正的將地圖成爲講述故事的一種方式。

地圖故事集合的訪問地址：http://storymaps.arcgis.com/en/，

更讓人興奮的是，地圖故事都是基於JavaScript開發的，而且其源碼都是在Github上開放的，這也就意味着，你能夠對地圖故事的講述方式進行自定義的修改，點擊每一個地圖故事，最後都會有一個Github的下載頁面。

點擊便可進入Github的下載頁面，這裏我就不一一貼地址了…