CSVLayer 简介

尝试一下在线预览

CSVLayer 允许您从包含纬度和经度信息的逗号分隔值文本文件(.csv)或分隔文本文件(.txt)添加要素。该文件在 Web 上作为托管文件引用。因此,该文件必须可公开访问。该文件需要至少包含一对坐标字段,因为这些字段用于在地图上定位要素。

此示例演示如何将 CSVLayer 实例添加到 SceneView 中的 aMap。生成的点要素可以通过 API 进行查询,然后用作其他操作的输入。

如果 CSV 文件与您的网站不在同一域中,则需要启用 CORS 的服务器或代理

工作原理

此示例使用来自 USGS 的数据。

创建一个新的 CSVLayer 并在其构造函数中设置属性。在此特定示例中,除了 copyrightpopupTemplate 属性之外,还添加了 USGS 地震 csv 文件的 url。

     
1
2
3
4
5
const csvLayer = new CSVLayer({
  url: url,
  copyright: "USGS Earthquakes",
  popupTemplate: template
});

然后,在图层上设置 SimpleRenderer,并将图层添加到地图中。

                       
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// Set a simple renderer on the layer
csvLayer.renderer = {
  type: "simple", // autocasts as new SimpleRenderer()
  symbol: {
    type: "point-3d", // autocasts as new PointSymbol3D()
    // for this symbol we use 2 symbol layers, one for the outer circle
    // and one for the inner circle
    symbolLayers: [{
      type: "icon", // autocasts as new IconSymbol3DLayer()
      resource: { primitive: "circle"},
      material: { color: [255, 84, 54, 1] },
      size: 5
    }, {
      type: "icon", // autocasts as new IconSymbol3DLayer()
      resource: { primitive: "circle"},
      material: { color: [255, 84, 54, 0] },
      outline: {color: [255, 84, 54, 0.6], size: 1},
      size: 25
    }]
  }
}
// Add the layer to the map
map.add(csvLayer);

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.