当前位置：首页 > news >正文

ArcGIS 气象风场等示例数据制作、服务发布及前端加载

news 2025/9/2 15:11:19

1. 原始数据为多维数据

以nc数据为例。
首先在pro中需要以多维数据的方式去添加多维数据，这里的数据包含uv方向：
在这里插入图片描述

加载进pro的效果：

这里注意数据属性需要为矢量uv：
在这里插入图片描述
如果要发布为服务，需要导出存储为tif格式，然后发布影像服务（Image Service）即可（发布影像服务可参考服务发布相关博客）。（如果原始数据为crf等数据，同样也导出保存为tif格式，确认source type是uv vector-uv类型）

2. 原数据为tif多波段数据

如果source type 不是矢量uv，加入数据，并通过设置数据源类型工具，设置为矢量uv：
在这里插入图片描述

同样发布服务在catalog中右键数据发布影像服务即可。

3. 前端测试代码参考

官网地址参考：
https://developers.arcgis.com/javascript/latest/sample-code/layers-imagery-afrenderer/

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Flow</title><style>html,body,#viewDiv {width: 100%;height: 100%;margin: 0;padding: 0;overflow: hidden;}</style><link rel="stylesheet" href="https://js.arcgis.com/4.27/esri/themes/light/main.css" /><script src="https://js.arcgis.com/4.27/"></script><script>require(["esri/Map","esri/views/MapView","esri/layers/MapImageLayer","esri/layers/ImageryLayer"], function(Map, MapView,MapImageLayer,ImageryLayer) {const layer = new ImageryLayer({url: "http://localhost:6080/arcgis/rest/services/uvtest/ImageServer",title: "Winds",renderer: {type: "flow", // autocasts to new FlowRenderertrailWidth: "2px",color: [50, 120, 240, 1],density: 1,flowSpeed: 10,},effect: "bloom(1.5, 0.5px, 0)"});var map = new Map({basemap: "streets-navigation-vector",layers:[layer]});var view = new MapView({container: "viewDiv",map: map,center: [104.5, 31],zoom: 13});});</script>
</head><body><div id="viewDiv"></div>
</body></html>