Arcgis for Js實現Spline插值、區域裁剪以及頁面的輪播效果
概述:
本文講述如何利用Arcgis 的Gp服務實現Spline插值,並將插值的結果按照指定的區域進行裁剪,最後將裁剪的結果根據特定的樣式渲染,並在頁面實現多期輪播的這樣一個效果。
實現效果:
實現步驟:
1、模型構建
a、確定需要工具
該功能需要兩個工具:1、Spline,實現插值計算;2、Extract by Mask,實現指定區域的裁剪。
b、確定模型引數
輸入引數:1、計算點;
2、計算欄位;
輸出引數:1、裁剪後柵格;
常 量:裁剪區域
c、設定輸出樣式
1)執行模型,驗證模型正確性;
2)設定結果樣式,並匯出為lyr圖層;
設定樣式
存為lyr
3)設定輸出柵格樣式;
2、服務釋出
a、再執行一遍模型
b、設定引數,釋出服務
將服務釋出為一個MapService
填寫引數
3、前臺呼叫
/** * 插值計算 */ var gpUrl = "http://localhost:6080/arcgis/rest/services/lzugis/MaskSpline/GPServer/Spline"; var jobIds = []; var calcFlag = 0;//迴圈請求 $("#calgp").on("click", function () { $("#modal").show(); calcFlag = setInterval(calSplineGp,3000); } ); function calSplineGp(){ var gpFeatures = []; var features = gpData.features; for(var i in features){ var feature = features[i]; var gpFeature = { "attributes": { "id": i, "name": feature.attributes.name, "heat": Math.random()*100 + 1 }, "geometry": { "x": feature.geometry.x, "y": feature.geometry.y } }; gpFeatures.push(gpFeature); } var inputFeature = { "features":gpFeatures }; $.ajax( { type : "POST", cache : false, url : gpUrl + "/submitJob?InputFeatures="+JSON.stringify(inputFeature)+"&Field=heat&f=json", async : false, success : function (result) { result = eval("(" + result + ")"); var jobId = result.jobId; if (jobId) { submitJob(jobId); } else { console.log("計算失敗"); } } } ); } function submitJob(jobId) { $.ajax({ type: "POST", cache: false, url: gpUrl+"/jobs/"+jobId+"?f=json", async: false, success: function (result1) { result1 = eval("("+result1+")"); if(result1.jobStatus==="esriJobSucceeded"){ jobIds.push(jobId); if(jobIds.length===5){ clearInterval(calcFlag); loadResultLayer(); } } else if(result1.jobStatus==="esriJobFailed"){ console.log("計算失敗"); } else{ submitJob(jobId); } } }); } var showFlag = 0, showIndex=0; var gpLayer; var gp = new Geoprocessor(gpUrl); function loadResultLayer(){ $("#modal").hide(); showFlag = setInterval(function(){ var jobId = jobIds[showIndex]; gp.getResultImageLayer(jobId, null, null, function(_gpLayer){ if(gpLayer)map.removeLayer(gLayer); gpLayer = _gpLayer; gpLayer.setOpacity(0.9); map.addLayer(gpLayer); gpLayer.on("load",function(){ showIndex++; if(showIndex===jobIds.length-1){ showIndex = 0; } }); }); },2000); }
---------------------------------------------------------------------------------------------------------------
技術部落格
http://blog.csdn.NET/gisshixisheng
線上教程
http://edu.csdn.Net/course/detail/799
Github
https://github.com/lzugis/
聯絡方式
q q:1004740957
e-mail:[email protected]
公眾號:lzugis15
Q Q 群:452117357(webgis)
337469080(
相關推薦
Arcgis for Js實現Spline插值、區域裁剪以及頁面的輪播效果
概述:本文講述如何利用Arcgis 的Gp服務實現Spline插值,並將插值的結果按照指定的區域進行裁剪,最後將裁剪的結果根據特定的樣式渲染,並在頁面實現多期輪播的這樣一個效果。實現效果:實現步驟:1、模型構建a、確定需要工具該功能需要兩個工具:1、Spline,實現插值計算
arcgis for js實現GP服務建立、釋出、呼叫(呼叫GP釋出服務)
1.本例中使用的地圖服務和GP服務都可以從arcgis server manage中拿到; 2.資料型別,這是GP服務的資料型別。每一個GP服務資料型別和JS資料型別進行對應,比如緩衝區模型製作中使用的FeatureClass,,釋出服務說明(對於說明可以參考這裡http:
arcgis for js 實現點、線、面、手動線、手動面緩衝區分析功能
1.案例中使用的地圖服務都可以在arcgis server manager中建立地圖伺服器切片地址和buffer服務地址; 實現全部程式碼如下; 2.可以自定義動態選擇緩衝區距離長度,緩衝區投影座標系,緩衝區距離單位等; 3.先實現過程中在緩衝區座標系中遇到些問題(
Arcgis for Js實現graphiclayer的空間查詢
var outline edm == .net result aps family -c 本節講的是Arcgis for Js的針對graphiclayer的空間查詢,內容非常easy。代碼例如以下: <!DOCTYPE html> <html>
Arcgis for Js實現graphiclayer的空間查詢(續)
上文中,實現了簡單的針對graphiclayer的空間查詢工作,在本節,將更加詳細的介紹針對graphiclayer的空間查詢。首先,空間查詢的方式:提供多種型別的空間查詢,包括點周邊、線周邊、面內等多種方式;其次,圖形繪製完成後狀態的展示;再次,結果的顯示。實現後的結果如
swipe.js實現支援手拔與自動切換的圖片輪播
一、Html程式碼如下: <div id='mySwipe' style='max-width:500px;margin:0 auto' class='swipe'> <div class='swipe-wrap'> <li style="no-repeat
ArcGIS API for js 實現點、線、面等圖形的繪畫
今天總算敲定實習的事,也不知道未來等待我的將是什麼,但是我知道我既然選擇了就要把它做好,選擇就不要後悔,走下去====開車開車一、實現的思路首先宣告一個GraphicLayer的圖層,(該圖層是客戶端型別圖層,與ArcGIS Server釋出的圖層沒有任何聯絡,繪畫的物件也在
ArcGIS API for JS實現要素的查詢與定位
1、實現多要素查詢與定位 a、線查詢與定位 線要素主要是那些到路線,在查詢下下拉選擇某種道路型別,便可以獲得該圖層的layerid,將該ID值傳遞給要查詢的URL,形成完整的查詢URL,通過Quer
arcgis for js 開發系列之地圖實現右鍵點選事件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv
arcgis api for js實現距離測量和麵積測量(完整版本)
一、距離測量和麵積測量是GIS必備的功能效果圖如下:二、量算函式(核心) //量算函式 function mapClick(evt) { if(disFun){
【ArcGIS】ArcGIS 10.0插值、密度分析等結果圖按照指定多邊形、掩膜輸出
ArcGIS空間分析當中的插值、密度分析是我們經常會用到的工具,但是一般情況下,輸出結果圖的大小範圍是原始插值點的最小外接矩形,如對以下資料利用Kriging插值 一般設定如下: 則得到的插值結果如下圖所示: 即上文所說的,以包含所有插值點的最小外接矩形為結果輸出範圍
arcgis for js 點投影實現
1.本例中使用服務連結可以在arcgis server manager中拿到; 2.實現點投影功能; 程式碼如下: <!DOCTYPE html> <html> <head> <title>墨卡託投影一個點</t
Arcgis for Js之GeometryService實現測量距離和麵積
距離和麵積的測量時GIS常見的功能,在本節,講述的是通過GeometryService實現測量面積和距離。先看看實現後的效果: 距離
(轉)Arcgis for Js之Graphiclayer擴展詳解
不同的 nes library 創建 都是 拖拽 oms hang graph http://blog.csdn.net/gisshixisheng/article/details/41208185 在前兩節,講到了兩種不同方式的聚類,一種是基於距離的,一種是基於區域範圍
vue.js實現單選框、復選框和下拉框
new type 方式 避免 -- js實現 處理 scrip 按鈕 Vue.js可以很方便的實現數據雙向綁定,所以在處理表單,人機交互方面具有很大的優勢。下邊以單選框、復選框和下拉框為例介紹他們在HTML和Vue.js中的具體實現方式。 一、單選框 在傳統的HTML
Python實現牛頓插值法(差商表)
插值 ima proc 保存 append ces fun shadow 計算 def func(x,y,X,infor=True): list2=[y[0]] # 差商表的對角線的第一個元素始終是y0 count=1 while(T
拉格朗日插值、快速排序
namespace 拉格朗日插值法 { class Program { private static int Cha(int[] shuzhu, int key) { int left = 0; //陣列中起始位置下標
vue模板語法:插值、指令
插值:{{}} 指令:v- (在{{}}和v-指令進行資料繫結時,支援js單個表示式) <p v-text='msg'></p>,就相當於插值表示式的功能 <p v-html='title'></p>,可以解析標籤 data:{
arcgis for js SSL證書無效
只需要在jupyter notebook的最前面加入 import ssl ssl._create_default_https_context = ssl._create_unverified_context 即可解決 第二種解決方案:在GIS初始化值,將verify_cer
Python 實現牛頓插值演算法
匯入標頭檔案 import matplotlib.pyplot as plt from pylab import mpl import numpy as np import pandas as pd import math %matplotlib inline 得到差商表函