當前位置:首頁 » 網頁前端 » 前端和webgis
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

前端和webgis

發布時間: 2023-01-13 23:16:58

⑴ webgis前端開發有雙休嗎工資為什麼很高。不包吃住

雙休,發展好。webgis前端開發工程師主要負責GIS國產化產品開發,負責項其功能研發實現等,發展好,因此工資高,並且該職位的招聘均為雙休,入職後就會又五險一金,節假日還有會有節日福利、通訊補貼等。

⑵ 大學畢業設計做webgis難嗎

認真學,不算難得。
需要配合用戶體驗研究,才有前途;當然,如果你的富媒體技術很強,或則是HTML5牛人,那還是很吃香的。
1、積累並完善WebGIS開發框架, 優化現有的地圖引擎。
2、使用JavaScript或Flex或Silverlight技術豐富網站功能,增強用戶體驗。
3、使用XHTML/CSS/Javascript開發符合Web標準的網站前端頁面 。

⑶ 怎麼學好webgis開發

前端開發,需要配合用戶體驗研究,才有前途;當然,如果你的富媒體技術很強,或則是HTML5牛人,那還是很吃香的。
工作職責:
1.積累並完善WebGIS開發框架, 優化現有的地圖引擎
2.使用JavaScript或Flex或Silverlight技術豐富網站功能,增強用戶體驗
3.使用XHTML/CSS/Javascript開發符合Web標準的網站前端頁面
4.和後端工程師一起研討技術實現方案,制定服務介面等;
5.積極探索並積累WebGIS開發模式和規范
職位要求:
1.了解Google Map/openlayers/SharpMap等系統架構,熟悉ArcIMS、ArcGIS Server開發或開源
openlayers、MapFish、openscale、GEOExt開發並有相關WebGIS應用系統開發經驗
2.精通各種Web前端技術,包括XHTML/XML/JSON/CSS/Javascript等
3.深刻理解Web標准,對可用性、可訪問性等相關知識有實際的了解和實踐經驗
4.有基於Ajax或Flex或Silverlight的RIA應用開發經驗
5.掌握至少一門非Web前端腳本的語言(如Java/C#/C++),並有實際項目經驗,熟悉如何與後端進行數據通信
6.遵守團隊共同制定的行為規范,能對團隊發展提出合理化建議
7.個性樂觀,邏輯性強,強烈的責任心並善於和各種背景的人合作
8.熟悉OGC標准及ArcGIS 產品開發者優先
9.GIS、計算機、數學、自動化等相關專業本科以上學歷優先
有GIS(地理信息系統)專業背景或開發經驗,並且對三維模擬、三維地理信息系統有一定的認識或開發經驗。對GIS系統有開發經驗者優先。
1、測繪、地理、計算機等相關專業,本科以上學歷,25-30歲,有2年以上工作經驗,應屆畢業生勿投遞簡歷;
2、具有2年以上DB2或SQL SERVER的GIS應用經驗;
3、具有HTML、JavaScript、Java、.NET、C++等一種或多種語言開發經驗;
4、熟悉至少一種GIS軟體(ArcGIS、MapInfo、GeoServer);
5、熟悉WEB GIS應用。

⑷ 胡中南:Web端GIS技術新進展 | (PPT+速記)

在GTC 2020『GIS基礎軟體新技術論壇』上,超圖研究院副院長胡中南作《雲原生GIS及Web端技術新進展》報告,他首先系統講解了雲原生GIS技術的三大新進展:微服務更微、可擴展,容器化部署更全、更易用,自動化編排適配更多平台等,介紹了這些技術如何支撐雲南地質大數據等系統實現高可用、高並發、高彈性「三高」價值;也系統闡述了Web端GIS技術從基礎庫、組件庫、模板庫到WebApps的多層次結構及相關新進展,讓GIS前端應用開發定製更快速便捷。

本文將分為雲原生GIS(點擊左側藍色文字可直接查看)與Web端GIS兩大部分,現分享Web端GIS技術部分資料如下:

演講PPT

上半部分主要講雲原生GIS技術如何助力GIS系統快速部署與運維。

接下來我為大家介紹Web端GIS技術。

以前大家可能認為SuperMap的Web端就是一個SuperMap iClient JavaScript,僅僅是將Leaflet等開源技術做一些封裝集成、改進,和SuperMap伺服器產品的REST API做了對接,其實這只是我們Web端技術棧的組成之一,也即圖上所示的基礎的iClient Libraries類庫(L1)。

我們在上面還提供了iClient Components,就是所謂的WebGIS組件庫(L2),適配了Vue框架和React框架。在這之上我們面向行業應用共性,基於組件庫進一步封裝,提供了Web模板庫iClient Templates(L3),只需將數據、LOGO和圖片等進行簡單修改,就可以快速上線。我們還提供了可構建、可定製、可擴展的Web Apps,如MapDashboard和WebSite UI(L4),以及更偏向使用的一些Web Apps,用做制圖、分析等(L5)。

由此可見,SuperMap GIS的Web端包括這五個層次的內容,已經不僅僅是SuperMap iClient JavaScript單個產品。

在SuperMap iClient JavaScript層面,我們也有新的增強與改進。

SuperMap iClient JavaScript 2020模塊圖。Web Libraries和 Web Components都有一些增強,新增加了Web Templates。

在此,我重點介紹一下組件和模板的新特性和新技術:組件技術就是把Libararies類庫做進一步的封裝,更少的代碼做更快的開發,比如可以一行代碼加一個Web Map組件,裡面填一個服務地址和地圖資源ID,就可以出一個地圖了。歡迎大家在超圖軟體官網查看範例。

這是2019年我們提供的技術。今年我們新增了多款Vue組件,包括時間軸、卷簾地圖等。地圖、圖表等都有新的增強和改進。

今年我們新增了多款Vue組件,包括時間軸、卷簾地圖等。地圖、圖表等組件都有新的增強和改進。

這是我們做的全球新冠疫情圖範例。使用組件技術做了封裝,用戶不用一行一行寫代碼,操作更方便、開發更快捷。

新的Web模板技術,可以讓應用開發更便捷。直接提供多種行業應用模板,用戶只需修改LOGO、配色,或刪除不用的地方即可。

再上面就是大屏,可快速開發建站。

No Code無代碼開發,可以快速建站,包括SuperMap iPortal門戶首頁、地圖大屏App等,都可以進行拖拉式操作,不需要寫代碼就可以完成可視化定製。門戶首頁可以拖出來,Web應用可以用大屏拖出來。

地圖大屏也做了一些增強。

以前做了大屏只能看,不能互動,不能點,點了以後也不能操作。現在能看、能點、能互動。有了交互更好用。

包括,我們對布局也做了優化,移動端可以自己修改布局。

包括超寬屏終端都可以適配,這是一個項目的照片。

另外一個定製就是SuperMap iPortal站點定製和擴展增強。

從首頁到登錄頁、管理頁甚至各個Web Apps都支持定製和擴展。

從而實現No Code的可視化定製,同時做了一些新的組件和能力增強。

可以用這個特性快速搭建一個新的首頁,從上面的菜單、左上角的LOGO,包括Banner、橫幅各種內容都支持修改、增加和刪除。甚至用戶不懂開發都可以直接進行操作。此外,該布局是自適應的,在手機上同樣可以觀看。

這是2019年已有功能,今年我們做了新的增強。另外就是全代碼定製。

你可以基於自己的技術直接寫一個首頁。不管是我們提供的組件,還是你自己寫的組件,或是第三方組件都可以拿來使用。

包括我們的登錄頁和資源管理頁都可以進行修改和定製。

此外,大屏本身也是可以擴展的。

包括數據上圖。

數據洞察,都是可以修改和定製的。

可以加自己的圖表、UI。

前面所提到的是定製開發,再上層就是直接使用的WebApp。

如果大家感興趣,可以去我們官網:www.supermap.com,或GTC網站:http://www.gistc.com/來觀看新特性。

數據上圖,制圖能力更豐富。

可以在線列印Web地圖。

簡單回顧一下,我們講到的兩大部分技術:一個是雲原生GIS技術,讓GIS後台服務管理運維更高效,另一個是Web端GIS技術,讓GIS前端應用開發定製更快速。一個是高效,一個是快速。

總的報告可以用兩個圖連起來,第一就是K8s部署結構圖,通過它可以把雲原生GIS技術一覽無余,包括SuperMap iServer、SuperMap iPortal、SuperMap iManager之間的關系、用了什麼技術等都可以看到。

第二張圖如上所示,我們在Web端的整體技術層次都可以看到,從SuperMap iClient Libraries類庫,到組件、模板,到大屏、Site UI定製、擴展,以及WebApps等等。

以上就是我的報告,謝謝大家。

⑸ 如何自己搭建openlayers地圖伺服器

OpenLayers只是WebGIS前端。搭建地圖伺服器需要使用 MapServer,GeoServer(開源WebGIS), 或者商業的 ArcGIS Server,然後用 OpenLayers 在前端調用。

⑹ gis 開發需要學習哪些

你好,首先需要了解相關地理信息方面的基本知識是最好的,但是不是必須的,但是做一些常識也是好的,然後就是會一門基礎語言,這里會是指至少要能熟練編寫基本的應用程序,然後從一種GIS平台開始掌握,推薦arcgis系列,根據c/s還是b/s不同,可以再細化,先說到這里。Good luck~

⑺ 求問做一個webgis的基本流程

首先說明一下,如果題主想成為一名webgis開發者,可以參考這個鏈接小白如何成為webgis初級開發工程師

其次我們來說一下webgis的開發流程:

一般我們的開發採用兩條路線:esri方案開源方案

esri方案舉個例子:

ArcgisServer+SqlServer+IIS+Arcgis js Api+前端基礎框架

開源方案舉個例子:

GeoServer+PostgresSql+Tomcat+OpenLayers+前端基礎框架

Webgis開發的大概流程是

我們的矢量文件或者柵格文件,需要展示在網頁上的話,必須先通過GeoServver或者ArcgisServer發布成服務,然後這些地理伺服器就會提供出可供訪問的鏈接,然後用Openlayers或者Arcgis js api訪問就行。當然了我們Webgis系統不可能只有gis數據,還需要一些普通數據,這些就要在SqlServer或者PostgreSql里建表,然後我們的後台程序(C#或者Java)會連接這些資料庫,取到數據,仍然返回給前端,只不過此時數據的接收者就變成了前端那幾大框架,比如JQuery、Vue、Angular、React等等。

總結一下:

那麼開發一個Webgis到底需要些什麼呢?

GIS伺服器+基礎資料庫+網站部署環境+GIS Api框架+前端基礎框架

一個完整的Webgis系統,上面的東西都會有,歡迎補充和提問。

⑻ 有哪些 GIS+Python 的開發經驗值得分享

python之於GIS與python之於IT類似
GISer採用python的原因也在於「人生苦短,我用python」
python在gis中的應用非常之廣
1. desktop GIS:
ArcGIS從版本10開始不再支持原來的VBA,而改用python
QGIS本身大部分的代碼特別是插件部分可以採用python進行開發
2. 地圖引擎
mapnik—基於C++引擎的頂級地圖引擎庫,和python結合比較緊密
mapfish—支持部分專題地圖在線製作
3. webgis
python+geodjango 是最常用也最龐大的後台框架

GISer使用python一定要充分發揮python語言的特性
如ArcGIS集成phthon是利用了python的腳本語言特性
後台webgis等服務,可以發揮python作為語言黏合劑的特性,充分利用已有的GIS演算法庫

⑼ webgis中為什麼加入兩個地圖功能後出錯

一開始看到OpenLayers,就有一個問題。就是它作為WebGIS的前端,通俗地說,是「顯示」地圖的。那麼,它顯示的地圖是什麼,是怎麼顯示的,又是怎麼實現的?——暫且把這個問題叫做地圖表現。我覺得最關鍵的就是Map類,把這個類分析清楚了,問題就解決了一大半了。
前面第一回里說過怎麼實例化一個地圖,怎麼向地圖里加圖層加控制項。其實,地圖是這樣的,它就像一個容器,可以盛東西。要分析它光理解這些還不夠,我們要知道這個容器是怎麼做出來的,及具體都有什麼功能。
Map類有兩個常量:Z_INDEX_BASE和EVENT_TYPES,不說了,可顧名而思其意。再看它定義的一些屬性:div(The element that contains the map)、baseLayer(The currently selected base layer)、events(An events object that handles all events on the map)。是這樣,web頁的div通過以id或name的形式獲得map對象,然後layers和control在載入到map上,表現為地圖。順便說一句,控制項control和事件event是相關聯的,這以後會說。
OpenLayers.Map類提供了兩種實例化方式,舉例來看:
[代碼]js代碼:
// create a map with default options in an element with the id "map1"
var map = new OpenLayers.Map("map1");

// create a map with non-default options in an element with id "map2"
//Optional object with properties to tag onto the map.
var options = {
maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000),
maxResolution: 156543,
units: 'meters',
projection: "EPSG:41001"
};
var map = new OpenLayers.Map("map2", options);
OpenLayers.Map類實現的函數APIMethod是分組的,比如Layer Functions、Control Functions、Popup Functions、Container Div Functions、Zoom, Center, Pan Functions、Layer Options、Baselayer Functions、Zooming Functions、Translation Functions。其中,最關鍵的是Layer Functions和Control Functions,因為就是Layer對象和Control對象構成了map的主體。下面從每組函數中挑選出一兩個來,看看具體實現過程。
Layer Functions:
就看addLayer函數吧,下面的addLayers就是調用的它,代碼如下:
[代碼]js代碼:
addLayer: function (layer) {
for(var i=0; i < this.layers.length; i++) {
if (this.layers[i] == layer) {
var msg = "You tried to add the layer: " + layer.name +
" to the map, but it has already been added";
OpenLayers.Console.warn(msg);
return false;
}
}
layer.div.style.overflow = "";
this.setLayerZIndex(layer, this.layers.length);
if (layer.isFixed) {
this.viewPortDiv.appendChild(layer.div);
} else {
this.layerContainerDiv.appendChild(layer.div);
}
this.layers.push(layer);
layer.setMap(this);
if (layer.isBaseLayer) {
if (this.baseLayer == null) {
// set the first baselaye we add as the baselayer
this.setBaseLayer(layer);
} else {
layer.setVisibility(false);
}
} else {
layer.redraw();
}
this.events.triggerEvent("addlayer");
}
可以看到其中涉及到layer的一些方法,下一回具體介紹OpenLayers. Layer類。
[代碼]js代碼:
Control Functions:
addControl: function (control, px) {
this.controls.push(control);
this.addControlToMap(control, px);
}
可以看出,添加控制項的過程是由controls.Push()和addControlToMap()兩個函數共同完成的。
[代碼]js代碼:
addControlToMap: function (control, px) {
// If a control doesn't have a div at this point, it belongs in the
// viewport.
control.outsideViewport = (control.div != null);
control.setMap(this);
var div = control.draw(px);
if (div) {
if(!control.outsideViewport) {
div.style.zIndex = this.Z_INDEX_BASE['Control'] +
this.controls.length;
this.viewPortDiv.appendChild( div );
}
}
}

Popup Functions:這組函數和上兩組函數相似,是在地圖上添加或刪除Popup 對象。
Zoom, Center, Pan Functions:
[代碼]js代碼:
//Allows user to pan by a value of screen pixels
pan: function(dx, dy) {
// getCenter
var centerPx = this.getViewPortPxFromLonLat(this.getCenter());
// adjust
var newCenterPx = centerPx.add(dx, dy);

// only call setCenter if there has been a change
if (!newCenterPx.equals(centerPx)) {
var newCenterLonLat = this.getLonLatFromViewPortPx(newCenterPx);
this.setCenter(newCenterLonLat);
}
}

Zooming Functions:
這里就看看放大縮小函數吧。
zoomIn: function() {
this.zoomTo(this.getZoom() + 1);
}
zoomOut: function() {
this.zoomTo(this.getZoom() - 1);
}
顯然,zoomIn和zoomOut都使用了getZoom方法,放大就是讓zoom加1,縮小減1。

⑽ WEBGIS系統開發常用的技術框架有哪些,從前端到後端,求推薦

前端:
1、老一代兩大富應用(RIA)框架(目前已經停止更新):flex、silverlight
2、其他開源(早期項目較多):openlayer2、amap、bmap、ArcgisAPI4JS(3系列版本)
3、較新框架:openlayer3、cesiums、ArcgisAPI4JS(4.0之後版本)、
4、輕型框架(需要二次封裝):WebGL(例如d3.js、three.js)

後端:arcgisServer、geoserver、mapserver

(作者:毛小亮)