vue使用ArcGis?API?for?js創(chuàng)建地圖實(shí)現(xiàn)示例
更新時間：2023年08月22日 15:30:06 作者：無is
這篇文章主要為大家介紹了vue使用ArcGis?API?for?js創(chuàng)建地圖實(shí)現(xiàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
arcgis api在vue中創(chuàng)建地圖實(shí)例
今天分享利用arcgis的api，在vue中創(chuàng)建地圖實(shí)例，并且在地圖上顯示出來。
先是引入arcgis
這個具體可以參考上一篇文章：ArcGis API for js 在vue.js中的使用
創(chuàng)建map實(shí)例
這個Map類就是用于存儲，管理和覆蓋2D和3D查看共有的圖層的屬性和方法。
var map = new Map({
basemap:'streets' //配置底圖類型
})
視圖去引用地圖
- 地圖創(chuàng)建好后，還需要一個視圖去引用地圖，這樣才能在網(wǎng)頁中顯示出來。
//創(chuàng)建2d視圖
var view = new MapView({
container:'viewDiv',//html結(jié)構(gòu)，要用id來聲明
map:map,//引用的地圖實(shí)例
zoom: 4,//表示視圖當(dāng)前的縮放級別，通常和center一起使用，設(shè)置視圖的初始值
center: [15, 65]//設(shè)置顯示的地圖中心位置
})
創(chuàng)建3d視圖
創(chuàng)建3d視圖也是大同小異
var view = new SceneView({
container: "viewMap",
map: map,
center:[113.54,22.36],
zoom:4,
extent:{//配置初始地圖范圍
xmin: 113.53778263250001,
ymin: 22.361690773984428,
xmax: 113.56382441750009,
ymax: 22.377545955584687,
spatialReference: 4326//配置坐標(biāo)系
},
});最后運(yùn)行項(xiàng)目，就可以看到地圖已經(jīng)成功在網(wǎng)頁中展示了。
具體配置文檔可以參考arcgis官網(wǎng)的API
以上就是vue使用ArcGis API for js創(chuàng)建地圖實(shí)現(xiàn)示例的詳細(xì)內(nèi)容，更多關(guān)于vue ArcGis API for js創(chuàng)建地圖的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要介紹了Vue使用formData格式類型上傳文件的示例代碼，代碼簡單易懂，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2021-09-09
這篇文章主要介紹了Vuex 快速入門(簡單易懂)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-09-09
這篇文章主要為大家詳細(xì)介紹了vuejs事件中心管理組件間的通信，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
這篇文章主要介紹了在vue-cli3中使用axios獲取本地json操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
Vue 數(shù)組和對象更新,但是頁面沒有刷新的解決方式
今天小編就為大家分享一篇Vue 數(shù)組和對象更新,但是頁面沒有刷新的解決方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
這篇文章主要介紹了vue3.0-props、computed、自定義事件方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
Vuepress生成文檔部署到gitee.io的注意事項(xiàng)及說明
這篇文章主要介紹了Vuepress生成文檔部署到gitee.io的注意事項(xiàng)及說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
本篇文章主要介紹了vue組件jsx語法的具體使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
vue-router2.0 組件之間傳參及獲取動態(tài)參數(shù)的方法
下面小編就為大家?guī)硪黄獀ue-router2.0 組件之間傳參及獲取動態(tài)參數(shù)的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要為大家詳細(xì)介紹了Vue+Echarts實(shí)現(xiàn)簡單折線圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03