2021-12-9

ArcGis

ArcGis For Android

ArcGis For Javascript

实例

最基本的地图

<!DOCTYPE html>
<html >
<head>
 <script>
    require(["esri/config","esri/Map", "esri/views/MapView"], function (esriConfig,Map, MapView) {
        esriConfig.apiKey = "YOUR_API_KEY";
        const map = new Map({
            basemap: "arcgis-topographic" // Basemap layer service/基本图层
        });
 
        const view = new MapView({
            map: map,
            center: [-118.805, 34.027], // Longitude, latitude /经纬度
            zoom: 13, // Zoom level 
            container: "viewDiv" // Div element
        });
    });
      </script>
</head>
<body>
    <div id="viewDiv"></div>
</body>
</html>

使用 `Locate` 小组件定位自己

Locate API参考

Provides a simple widget that animates the View to the user’s current location.

The Locate widget is not supported on insecure origins. To use it, switch your application to a secure origin, such as HTTPS. Note that localhost is considered “potentially secure” and can be used for easy testing in browsers that supports Window.isSecureContext (currently Chrome and Firefox).

简而言之: 只有HTTPS才显示这个按钮! localhost 也会显示

require([
    "esri/config",
    "esri/Map",
    "esri/views/MapView",
    "esri/widgets/Locate",//定位小部件 //The Locate widget uses HTML5 to find your device location 
    "esri/Graphic"
  ], function( esriConfig, Map, MapView, Locate, Graphic){
      esriConfig.apiKey = "YOUR_API_KEY";
      const map = new Map({
          basemap: "arcgis-imagery" // Basemap layer service /基本图层 arcgis-imagery
      });
      const mainView = new MapView({
          map: map,
          center: [-40, 28], // Longitude, latitude
          zoom: 5, // Zoom level
          container: "viewDiv" // Div element
      });
      const locate = new Locate({
          view: mainView,
          useHeadingEnabled: false,
          goToOverride: function(view_, options) {
              options.target.scale = 1500;
              return view_.goTo(options.target);
          }
      });
      mainView.ui.add(locate, "top-left");
  })

图层更改 Change the basemap layer

文档 BasemapToggle API参考

The BasemapToggle provides a widget which allows an end-user to switch between two basemaps.

require([
    "esri/config",
    "esri/Map",
    "esri/views/MapView",
    //引入
    "esri/widgets/BasemapToggle",
    "esri/widgets/BasemapGallery"
 
], function(esriConfig, Map, MapView, BasemapToggle, BasemapGallery) {
 
...
 
const basemapToggle = new BasemapToggle({
    view: mainView,
    nextBasemap: "arcgis-imagery"
});
mainView.ui.add(basemapToggle,"bottom-right");//添加到 底部右边 显示

从网络加载地图

create-a-map-from-a-web-map-or-web-scene

Web maps and web scenes are JSON structures that contain settings for a map or a scene. This includes settings for the basemap, layers, layer styling, popups, legends, labels, and more.

Web 地图和 Web 场景是包含地图或场景配置的JSON 结构; 包括基础底图, 图层, 图层样式, 弹出窗口, 图例, 标签等等;

Create a map from a WebMap Example: https://www.arcgis.com/home/item.html?id=41281c51f9de45edaf1c8ed44bb10e30

require([
        "esri/config",
        "esri/WebMap",
        "esri/views/MapView",
        "esri/widgets/ScaleBar",
        "esri/widgets/Legend"
    ], function (esriConfig, WebMap, MapView, ScaleBar, Legend) {
        const webMap = new WebMap({                        // Define the web map reference
            portalItem: {
                id: "41281c51f9de45edaf1c8ed44bb10e30",
                portal: "https://www.arcgis.com"               // Default: The ArcGIS Online Portal
            }
        });
 
        const view = new MapView({
            map: webMap,                                     // Load the web map
            container: "viewDiv"
        });
    })

核心概念

https://developers.arcgis.com/javascript/latest/maps-and-views/

Maps and Views(地图与视图)

Maps are created from the Map class. Map objects are always passed to a View object. There are two View classes used to display maps: the MapView class for 2D maps and the SceneView class for 3D maps.

地图是从 Map 类创建的; ‘Map实例’ 总是传递给 View 对象显示的; 有两个 View 类用于显示地图: 用于2d 地图的 MapView 类和用于3d 地图的 SceneView 类;

const myMap = new Map({                // Create a Map object
  basemap: "streets-vector",
  layers: additionalLayers             // Optionally, add additional layers collection
});
 
const mapView = new MapView({          // The View for the Map object
  map: myMap,
  container: "mapDiv"
});

地图(Maps)

创建地图从Map 类的创建, 同时指定基本底图和可选的图层集合

//从网络加载, 参考上: [从网络加载地图]
const webMap = new WebMap({                        // Define the web map reference
  portalItem: {
    id: "41281c51f9de45edaf1c8ed44bb10e30",
    portal: "https://www.arcgis.com"               // Default: The ArcGIS Online Portal
  }
});
 
//
const view = new MapView({
  map: webMap,                                     // Load the web map
  container: "viewDiv"
});

视图(View)

简而言之: 视图(View) 的主要作用是显示图层, 弹出窗口和 UI 小部件, 处理用户交互, 并指定地图显示的”范围”;

具体的视图对象需要一个 Map 对象和一个标识 div 元素或 div 元素引用的 id 属性的 String

主要有两个 MapView and SceneView; MapView 显示2D地图, 而 SceneView 显示3D地图

由于视图处理用户交互, 因此在MapView上处理事件; MapView 的一些默认行为MapView navigation

view.on("click", function(event) { // Listen for the click event
  view.hitTest(event).then(function (hitTestResults){ // Search for features where the user clicked
    if(hitTestResults.results) {
      view.popup.open({ // open a popup to show some of the results
        location: event.mapPoint,
        title: "Hit Test Results",
        content: hitTestResults.results.length + "Features Found"
      });
    }
  })
});

监听事件和事件处理参考文档: Handling events

Layers and data(图层和数据)

有多种图层类, 用于访问和显示数据; 所有图层继承自Layer; 每个图层类型还提供了不同的一组功能;

layer types

FeatureLayer - 显示, 查询, 过滤和编辑大量的地理特征数据; (存在线上服务器) GraphicsLayer - 在地图上以图形, 视觉辅助工具或文字的形式显示个别地理特征; (存在内存中)

CSVLayer/KMLLayer/GeoJSONLayer - 将以外部文件格式存储的数据显示为一个层; TileLayer/VectorTileLayer - 为地理上下文显示 basemaps 和其他分层数据集; (基本底图显示?) ImageryLayer - 显示卫星或其他图像数据; MapImageLayer - 显示由 ArcGIS Server 服务动态呈现的层;

GraphicsLayer 图层的数据格式

GraphicsLayer 通常用于添加具有不同几何形状的文本, 形状和图像到地图; 创建图形层的最简单方法是将图形对象创建为数组, 并将此数组传递给新的 GraphicsLayer 对象的图形属性;

每个 Graphic 类都包含以下属性:

Property	Type	Description
attributes	Object	Key-value pairs used to store geographical information about features
geometry	Geometry	Provides the location for a feature relative to a coordinate system
		Possible values are Point, Polygon, and Polyline objects
popupTemplate	PopupTemplate	The popup template for the graphic
symbol	Symbol	Defines how the graphic will be rendered in the layer

下面的代码示例创建一个新的 Graphic 对象, 该对象具有 Point 几何类型, 弹出窗口和符号; 然后, 它通过向 graphics 属性传递一个图形数组来创建一个新的 GraphicsLayer;

var pointGraphic = new Graphic({
  attributes: {
    name: "LA City Hall",
    address: "200 N Spring St, Los Angeles, CA 90012"
  },
  geometry: {
    type: "point",                     // autocasts as new Point()
    longitude: -118.24354,
    latitude: 34.05389
  },
  symbol: {
    type: "simple-marker",             // autocasts as new SimpleMarkerSymbol()
    color: [ 226, 119, 40 ],
    outline: {                         // autocasts as SimpleLineSymbol()
      color: [ 255, 255, 255 ],
      width: 2
    }
  },
  popupTemplate: {                     // autocasts as new PopupTemplate()
    title: "Places in Los Angeles",
    content: [{
      type: "fields",
      fieldInfos: [
        {
          fieldName: "name",
          label: "Name",
          visible: true
        },
        {
          fieldName: "address",
          label: "Address",
          visible: true
        }
      ]
    }]
  },
});
 
var graphicsLayer = new GraphicsLayer({
  graphics: [ pointGraphic ]
});
 
map.layers.add(graphicsLayer);

ArcGis Server

官中文档 https://enterprise.arcgis.com/zh-cn/server/latest/deploy/windows/deploy-arcgis-server.htm

ArcGIS Server是 ArcGIS Enterprise 的后端服务器软件组件, 可以使您的地理信息可供组织中的其他人使用, 也可以选择使其可供具有 Internet 连接的任何人使用; 这可通过 GIS 服务完成, 从而使服务器计算机能够接收和处理其他设备发出的信息请求;

发布自定义地图

在WebGIS开发过程中, 我们所需要的数据不仅仅来自于ArcGIS online, 有时候我们需要发布自己的数据服务;

地图服务: 地图服务是一种利用 ArcGIS 使地图可通过 Web 进行访问的方法; 我们首先在 ArcMap 中制作地图, 然后将地图作为服务发布到 ArcGIS Server 站点上; 之后, Internet 用户便可在 Web 应用程序, ArcGIS for Desktop, ArcGIS Online 以及其他客户端应用程序中使用此地图服务;
地图服务之动态地图服务: 我们常用的地图服务主要分为两种: 动态地图服务, 切片地图服务(也叫瓦片地图服务), 地图服务其实可以理解为图层的集合, 在本篇中主要说的是动态地图服务,
动态地图服务的特点:
动态地图会在用户发出请求时进行绘制;
地图服务具有允许客户端(例如 ArcGIS web API)动态更改每个图层的行为和外观;
可以执行属性查询, 空间查询等相关功能;
利用arcmap发布动态地图服务: 主要分为以下几步:
用ArcMap打开我们想要发布为服务的数据
符号化我们的数据(可选)
利用ArcMap连接ArcGIS Server发布服务

https://blog.csdn.net/snow_heavy/article/details/79953641

ArcMap

ArcMap是一个用户桌面组件，具有强大的地图制作，空间分析，空间数据建库等功能.

校准 TIF 经纬度 (Georeferncing工具)

生成的tif 文件是缺少经纬度, 可以使用 QGIS 或者 ENVI 或者 ArcMap校准

参考底图

windowns → catalog > GIS Servers → Add WMTS

天地图底图 地址: 矢量底图 http://t0.tianditu.gov.cn/vec_c/wmts?tk=您的密钥经纬度投影 http://t0.tianditu.gov.cn/vec_w/wmts?tk=您的密钥球面墨卡托投影矢量注记 http://t0.tianditu.gov.cn/cva_c/wmts?tk=您的密钥经纬度投影 http://t0.tianditu.gov.cn/cva_w/wmts?tk=您的密钥球面墨卡托投影影像底图 http://t0.tianditu.gov.cn/img_c/wmts?tk=您的密钥经纬度投影 http://t0.tianditu.gov.cn/img_w/wmts?tk=您的密钥球面墨卡托投影影像注记 http://t0.tianditu.gov.cn/cia_c/wmts?tk=您的密钥经纬度投影 http://t0.tianditu.gov.cn/cia_w/wmts?tk=您的密钥球面墨卡托投影地形晕渲 http://t0.tianditu.gov.cn/ter_c/wmts?tk=您的密钥经纬度投影 http://t0.tianditu.gov.cn/ter_w/wmts?tk=您的密钥球面墨卡托投影

token参数: tk=ab631e825xxxxxxxxxxxxxxxxx

爱心人士, 集合的图层

http://xdc.at/map/wmts

ArcGIS 发布的图层

https://www.arcgis.com/home/search.html?restrict=false&sortField=relevance&sortOrder=desc&focus=layers#content

校准过程

校准数据

自定义(customize) → 工具条(Tollbars) → 地理配准(Georeferncing)
在被激活工具条(Georeferncing) 中: 在Georeferncing 工具条上点击 Add Control Point 按钮. 在图上左键 → 然后右键输入该点实际的经纬度位置 → 或者选择其他图层左键对应的位置
重复增加三个及以上控制点
最后在工具条点击更新地理配准 (Update Georeferncing)

Georeferncing 工具灰色?

原因是图层坐标系与地图坐标系不一致, 可使用 投影和变换(Projections and Tranformations) 转换 TIF 坐标系参考下 (转换 TIF 坐标系)

校准过程(for QGis)

https://docs.qgis.org/3.34/en/docs/training_manual/forestry/map_georeferencing.html

在新版本下这个工具入口是在 raster -> Georeferencer...

Add the map image file, rautjarvi_map.tif, as the image to georeference, File ► Open raster.

Next you should define the transformation settings for georeferencing the map(定义CRS?)

Open Settings ► Transformation settings.
Set the Transformation type to Linear and the Resampling method to Nearest neighbour.
Press the Select CRS button next to the Target SRS option and select the EPSG:2392 - KKJ / Finland zone 2 CRS; it is the CRS that was used in Finland back in 1994 when this map was created.
Click the icon next to the Output raster box, go to the folder and create the folder exercise_data\forestry\digitizing and name the file as rautjarvi_georef.tif.
Check √ Load in QGIS when done
Leave the rest of parameters as default.

Zoom in to the left lower corner of the map and note that there is a cross-hair with a coordinate pair, X and Y, that as mentioned before are in KKJ / Finland zone 2 CRS. You will use this point as the first ground control point for the georeferencing your map.
Select the Add point tool and click in the intersection of the cross-hairs (pan and zoom as needed).
In the Enter map coordinates dialogue write the coordinates that appear in the map (X: 2557000 and Y: 6786000) and their CRS (EPSG:2392 - KKJ / Finland zone 2)
Click OK. The first coordinate for the georeferencing is now ready.

导出TIF

菜单: file -> export map

大小取决于DPI 的设置

转换 TIF 坐标系(Projections and Tranformations 工具)

Geoprocessing → ArcToolbox ArcToolbox > 数据管理工具(Data Management Tools) → 投影和变换(Projections and Tranformations) → 栅格(Raster) → 投影栅格 (Project Raster)

Input Raster : 选择输入文件 Ouput Raster Dataset: 输出文件, 需要指定后缀 Ouput Coordinate System 选择坐标系

WGS_1984_Web_Mercator_Auxiliary_Sphere = EPSG:3857 = Web Mercator 投影, WGS 1984 坐标系 WGS_1984_UTM_Zone_50N = EPSG:32650 = UTM投影, WGS 1984 坐标系

shp 校准 (空间校准)

自定义(customize) → 工具条(Tollbars) → 空间校正工具（spacial adjustment）

(右键图层) → 开始编辑
创建位移连接 (需要类似一个矩形的才行, 不然校正(Adjust)按钮是灰色的, 取决方法Rubbersheet则一个点就够了)
选择空间校正方法。
执行校正。
停止编辑会话并保存编辑内容。 https://desktop.arcgis.com/zh-cn/arcmap/latest/manage-data/editing-existing-features/about-spatial-adjustment.htm

shp 转 GeoJson

Geoprocessing → ArcToolbox ArcToolbox > 转换工具(Conversion Tools) → 要素 to JSON (Features To JSON)

默认导出来的是投影坐标 Environmenet Settings > Ouput Corrdinates 可以修改导出的json Corrdinates坐标

单位不是经纬度?

https://gis.stackexchange.com/questions/178085/arcgis-convert-a-shapefile-into-json-with-coordinates https://gis.stackexchange.com/questions/24340/converting-coordinates-from-meters-to-decimal-degrees-in-qgis

正解:

**一. 使用QGIS工具, 导出 geojson 选 4326 坐标系 **

Add the layer to the map canvas;
Right-click on the layer and select “Set layer CRS”;
Choose the correct coordinate reference system (CRS) from the list - it is probably in UTM (a metric grid) and you will have to know the zone and datum for the data; it may be already automatically selected! After this:
You right-click on the layer and select “Save as …”:
Click ‘Browse’ near CRS in the resulting dialog and select WGS84 EPSG:4326 as the CRS for the new file - this will save it with decimal degrees as the coordinate system.

From the values returned it seems that your layer is stored as a projected coordinate system. Try saving the layer as a geographic coordinate system (EPSG:4326) and it should work.

二. 或者先将shp先转换为4326的坐标系, 再导出为geojson

Quartz 4

Explorer

N_ArcGis全家桶

ArcGis

ArcGis For Android

ArcGis For Javascript

实例

最基本的地图

使用 `Locate` 小组件定位自己

图层更改 Change the basemap layer

从网络加载地图

核心概念

Maps and Views(地图与视图)

地图(Maps)

视图(View)

Layers and data(图层和数据)

GraphicsLayer 图层的数据格式

ArcGis Server

发布自定义地图

ArcMap

校准 TIF 经纬度 (Georeferncing工具)

参考底图

校准过程

校准过程(for QGis)

导出TIF

转换 TIF 坐标系(Projections and Tranformations 工具)

shp 校准 (空间校准)

shp 转 GeoJson

单位不是经纬度?

Graph View

Table of Contents

Backlinks

Quartz 4

Explorer

N_ArcGis全家桶

ArcGis

ArcGis For Android

ArcGis For Javascript

实例

最基本的地图

使用 Locate 小组件 定位自己

图层更改 Change the basemap layer

从网络加载地图

核心概念

Maps and Views(地图与视图)

地图(Maps)

视图(View)

Layers and data(图层和数据)

GraphicsLayer 图层的数据格式

ArcGis Server

发布自定义地图

ArcMap

校准 TIF 经纬度 (Georeferncing工具)

参考底图

校准过程

校准过程(for QGis)

导出TIF

转换 TIF 坐标系(Projections and Tranformations 工具)

shp 校准 (空间校准)

shp 转 GeoJson

单位不是经纬度?

Graph View

Table of Contents

Backlinks

使用 `Locate` 小组件定位自己