Cesium應用篇:3控件(2)BaseLayerPicker


所有范例均在github中搜索:ExamplesforCesium

BaseLayerPicker控件非常簡單,似乎沒什么可說的,確實非常的簡單,但作為一個底圖選擇控件,可以說是最基本的一個控件。

Cesium的控件采用了knockout的MVVM框架,不要看我,我也不懂,總之會用就可以。Cesium提供的BasePicker好歸好,但里面的很多Provider並不太實用,而一些符合中國國情的Provider有沒有提供,所以本節主要介紹如何自定義BasePicker,提供給Viewer使用。

首先簡單介紹一下涉及到的類關系: clip_image002 如上就是BaseLayerPicker的主要邏輯關系,對於開發者而言,只需要提供不同的ProviderViewModel,比如BingMap的,OSM的,ArcGIS的,GoogleMaps的,這樣在BaseLayerPicker的UI中,就會有多個Provider供用戶選擇,而交互則有BaseLayerPickerViewModel類負責,用戶並不需要關心內部的實現。

有了一個全面的認識,我們就看看ProviderViewMode是如何創建的?

clip_image004

如上一目了然,至少有四個屬性,名字,縮略圖的url,鼠標懸浮時的提示內容,當然還有綁定對應的ImageryProvider(我們之前的文章已經對其詳細的介紹過)。這樣我們便構造了一個BingMap的ViewModel。

這時,我們創建一個數組,將該VM添加到數組,並作為參數傳遞給Viewer即可,非常的簡單。此時,如果我們不指定imageryProviderViewModels參數,則Viewer選用默認的BaseLayerPicker控件。

如下,我們封裝了BingMap,GoogleMaps,本地影像,MapBox,OSM,天地圖以及ArcGIS Online,基本涵蓋了國內主流的在線地圖服務,效果如下:

clip_image005

BaseLayerPicker的使用非常簡單,稍微了解一下相關接口和實現,我們也可以很方便的擴展自己的BaseLayerPicker功能。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM