arcgis 4.x 入门学习四 (创建几何)

1.几何的构成由 图形(geometry) 和 样式(symbol)来组合的

2.图形(geometry) 是用来描述几何的构成形状 结构 等等

3.样式(symbol) 使用来描述几何的颜色 透明度 等等

4. 实例

       创建一个多边形

       第一步 创建对应的图形来表达这个多边形的形状

       我选择的polygon类 (https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-Polygon.html)

       polygon 类型主要用来表达多边形的形状 有多个定点组成围成一个闭合的形状

  

//3D polygon rings with m-values (note that the second ring does not have m-values defined for it)
const rings = [
 [  
  [-97.06138,32.837,35.1,4.8],
  [-97.06133,32.836,35.2,4.1],
  [-97.06124,32.834,35.3,4.2],
  [-97.06138,32.837,35.1,4.8]  
 ]
];

const polygon = new Polygon({
  hasZ: true,
  hasM: true,
  rings: rings,
  spatialReference: { wkid: 4326 }
});

  

  由上面的代码已经可以得到一个由4个3个点组成的一个三角形的形状 (虽然是4个数值值,但是最后一个和第一个是相同的表示闭合)

 

  然后就是创建一个样式(symbol)来形容这个几何的样子

        我选择 SimpleFillSymbol类

  api https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleFillSymbol.html

        代码如下

        

var symbol = {
  // 表示类型
  type: "simple-fill", 
  // 表示颜色 黑色
  color: [ 0, 0, 0, 0.9 ],
  // 表示填充类型 
  style: "solid",
  // 边线配置 白色的边框 宽度1
  outline: { 
    color: "white",
    width: 1
  }
};

 

  应该很好理解把, 有上面这些代码就可以得到一个简单的信息 

       我们创建一个  黑色内部白色边框的三角形

 

  下一步就是将他们合并成为 几何(graphic)

       注意 graphic对象只有一个唯一的选择 就是 Graphic类;

  https://developers.arcgis.com/javascript/latest/api-reference/esri-Graphic.html

var polylineGraphic = new Graphic({
  // 这里是图形
  geometry: polyline,
  // 这里是样式
  symbol: polylineSymbol,
  // 这个是属性 对象是一个json 是用来保存这个几何数据的
  attributes: {  }
});

 

  由此  这就是创建一个几何的全部过程了,

  不同的几何不同的只是 geometry 和 symbol的选择问题 

  大家可以去看api  esri/geometry   和  esri/symbol 来查看更多的类型

       比如 折线  polyline https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-Polyline.html

       比如 折线的symbol  SimpleLineSymbol https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleLineSymbol.html

       比如点的  园的  

 

       对了  地图的图标  本质是也是  点 图形 +  图片symbol来表示的

  图片symbol类 PictureMarkerSymbol https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-PictureMarkerSymbol.html

 

 

5. 将几何添加到地图中

       几何是无法直接添加到地图中的, 就和开头说的那样, 几何和地图中间还隔着一个layer

       layer的创建 ,我个人比较喜欢 GraphicsLayer类  https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-GraphicsLayer.html

  大概流程就是  将几何添加到layer中  然后 将layer添加到map里

  上代码

var layer = new GraphcisLayer( { id: "唯一名称" } )

// 将几何添加到图层中
layer.add( graphic );

// 将图层添加到地图中
view.map.add( layer );

// 几何删除自己
graphic.layer.remove(graphic);

// 图层删除自己
view.map.remove(layer);

// 图层查询自己
view.map.findLayerById(id);

 

OK 还有没听懂的欢迎留言。。。

  

上一篇:ArcGIS API For Javascript 4.15 绘制地图:在地图上绘制点和面


下一篇:ArcGIS API For Javascript之影像服务分析