ArcGIS中导入2000系的OSGB数据后发布服务，并在前端调用

本文在上一篇文章的基础之上，介绍下OSGB的倾斜摄影数据如何导入ArcGIS平台做数据处理、服务发布和前端ArcGIS JS API调用显示的一整套流程。

环境要求

ArcGIS Pro 2.2+
Portal 10.8或者Online

以上portal版本为自测版本，具体支持的版本号请查看ArcGIS官网。

数据准备

OSGB数据(2000坐标系)
一份2000坐标系的shp数据，作为底图(或者用天地图底图，具体使用见昨天的文档)

以上的OSGB数据应该是带有相应元数据信息的xml文件的，单个的OSGB数据在制作slpk时会报错

具体操作步骤

数据处理

1、从ArcGIS Pro 2.2开始，我们就没必要先将OSGB转为multipatch，然后再发布服务。在Pro 2.2往后的版本中，我们直接用Create Integrated Mesh Scene Layer Package这个工具将OSGB转为slpk，然后发布服务即可，具体操作如下。

2、打开ArcGIS Pro，然后配置相应的Online或者Portal连接。

3、在Pro的菜单栏找到分析菜单，然后点击打开工具面板，如下：

4、在工具面板的顶部搜索框里输入Create Integrated Mesh Scene Layer Package来查找转换工具，打开转换工具面板，如下图：

5、然后依次按照下图为此工具面板中配置各个参数：

6、然后点击下方运行按钮来转换数据，最终结果如下：

服务发布

1、打开Portal或者Online登陆后选择Content面板，然后选择左上角的【添加项目】按钮，将我们生成的slpk数据上传，如下：

2、因为我们Portal或者Online提供了上传文件时自动发布服务的功能，所以我们上图中勾选发布服务的选项之后，点击【添加项目】按钮，最终我们的slpk会发布成一个数据服务。

3、发布后的服务我们可以在Portal或者Online的ontent面板中看到，如下：

4、具体服务地址可以点击相应的服务后，在右下角看到地址，如下：

前端调用

1、发布后的服务在前端需要调用的话需要用到ArcGIS JS API，所以我们要编写相应的代码，具体的调用代码如下:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>Intro to SceneView - Create a 3D map</title>
    <style>
      html,
      body,
      #viewDiv {
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }
    </style>
    <link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css" />
    <script src="https://js.arcgis.com/4.16/"></script>
    <script>
      require(["esri/Map", "esri/views/SceneView","esri/Basemap",
      "esri/layers/MapImageLayer","esri/layers/IntegratedMeshLayer"], function(Map, 
      SceneView,Basemap,MapImageLayer,IntegratedMeshLayer) {
        var basemap = new Basemap({
              baseLayers: [
                new MapImageLayer({
                  url: "https://www.arcgisonline.cn/server/rest/services/YNbasemapcgcs2000/MapServer",
                  title: "Basemap"
                })
              ],
              title: "basemap",
              id: "basemap"
        });
    
        var map = new Map({
          basemap: basemap,
          //ground: "world-elevation"
        });
        var view = new SceneView({
          container: "viewDiv", // Reference to the scene div created in step 5
          map: map, // Reference to the map object created before the scene
          zoom: 16, // Sets the initial scale to 1:50,000,000
          //scale: 50000,
          //center: [118.889198,28.915444] // Sets the center point of view with lon/lat
          center: {
                x: 118.889198,
                y: 28.915444,
                spatialReference: {
                    wkid: 4490,
                },
            },
        });
        
        IntegratedMeshLayer = new IntegratedMeshLayer({
            url: "https://www.arcgisonline.cn/server/rest/services/Hosted/result05/SceneServer"
        });
        view.map.add(IntegratedMeshLayer);
        
        console.log(view);
      });
    </script>
  </head>
  <body>
    <div id="viewDiv"></div>
  </body>
</html>

2、以上代码中需要更改的是两处的服务地址，第一个是文章刚开始时提到的关于底图地址，第二个是发布后的倾斜摄影的服务地址，然后将代码保存在html文件中，通过本地服务访问即可，最后效果如下: