arcgis 如何获取到sever服务发来的layer中的地图中路的一部分 JavaScript 离线

Question

我想做一个关于路的一部分变化样式，有经纬度的坐标，有路的长度的信息，这样选取一段路，使它变个样式，

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

要使用JavaScript从ArcGIS Online获取特定层的数据并将其应用到地图上，你需要使用arcgis-js-api库。以下是一个简单的示例，说明如何在离线模式下将地图上的路径颜色更改为绿色。

首先，确保你已经安装了arcgis-js-api库，并且你的项目中有适当的依赖项。然后，你可以按照下面的步骤操作：

1. 导入必要的模块：

import * as ArcGis from '@esri/arcgis-rest';

1. 获取ArcGIS Online的API凭证（如果尚未设置）：

const credentials = {
  username: 'your_username',
  password: 'your_password'
};

1. 创建一个GeoService实例来访问ArcGIS Online：

const geoService = new ArcGis.GeoService('https://server.arcgisonline.com/ArcGIS/rest/services');

1. 使用geoService实例创建一个GeoServerRequest对象以获取指定地理服务的层数据：

const request = new ArcGis.GeoServerRequest({
  serviceUrl: `${geoService.baseURL}/services/${serviceName}`,
  layerId: 'path_layer_id',
});

请注意，你需要替换上述行中的service_name和path_layer_id为实际的服务名称和地理服务层ID。

1. 设置请求参数以获取层的数据：

request.queryParams = {
  fields: ['geometry', 'length'],
};

这将会返回一个包含路径几何形状和长度的响应。

1. 将响应转换为适合Mapbox的地图格式：

let mapBoxData = await request.get();
mapBoxData.features.forEach((feature) => {
  feature.geometry.coordinates[0].forEach((coord) => {
    // 根据每个点的坐标计算其颜色
    const color = `rgb(${Math.floor(coord[0] * 255)}, ${Math.floor(coord[1] * 255)}, ${Math.floor(coord[2] * 255)})`;
    // 在地图上绘制路径
    console.log(`绘图: ${color}`);
  });
});

这段代码会遍历所有的路径特征，并根据它们的坐标计算颜色。然后，它可以将这些颜色应用于地图上相应的路径。

注意：这个示例是基于mapbox-gl库的，如果你没有安装mapbox-gl，则需要先安装它。

npm install mapbox

这个例子展示了如何通过ArcGIS API获取地理服务层的数据，并将其应用于地图。然而，由于限制，这个示例仅适用于基本功能。在生产环境中，可能需要考虑更多的安全性和性能因素。