圆

在几何绘制中，除了点、线、面这三种之外，还有一种圆，它是面的子类。

圆是通过指定中心点和半径创建的多边形。该点可提供为Point对象或纬度、经度值数组。

圆有2D和3D两种不同的绘制方式。

1. 数据结构

1.1 圆

interface IGraphicCircle {
  // 位置
  circleGeometry: ICircleGeometry
  // 样式
  style: Circle2DStyle | CircleStyle
  // 参考坐标系
  spatialReference?: {
    wkid: number | string
  }
}

1.2 圆位置

interface ICircleGeometry {
  // 圆心坐标
  position: number[]
  // 为true时会使所画圆形符合地理坐标(即更符合圆形而非椭圆) 默认为true
  geodesic?: boolean
  // 绘制圆形的线段数 默认为60
  numberOfPoints?: number
  // 圆形半径 默认为1000
  radius: number
  // 半径单位 默认单位为meters(米)
  radiusUnit?: string
}

1.3 圆样式

圆的样式继承自面的样式

interface Circle2DStyle extends Polygon2DStyle {}

interface CircleStyle extends PolygonStyle {}

2. 使用

2.1 定义圆的位置

const circleGeometry= {
        position: [116.30022, 39.90056, 10],
        geodesic: false,
        numberOfPoints: 60,
        radius: 30,
        radiusUnit: "meters"
      },

2.2 定义绘制圆的样式

有两种情况:

const style2D = {
        color: '#f1f1b8',
        outline: {
          size: 3,
          color: 'red',
          //线的类型，实线solid 虚线dash 点虚线dot 点和虚线交叉dash-dot long-dash-dot long-dash-dot-dot short-dash short-dash-dot short-dash-dot-dot short-dot 在此为实线
          pattern: 'solid',
        },
        pattern:'solid' //solid vertical horizontal forward-diagonal diagonal-cross cross backward-diagonal
      },

const style3D = {
        color: '#f1f1b8',//立方体填充颜色
        size: 20,//立方体 高度
        //立方体边框设置 粗细 类型 颜色
        edges: {
          size: 1,
          type: 'solid',
          color: '#f3d751'
        }
      }

2.3 绘制图形

有两种情况:

使用Circle2D类来绘制。

const circle2D = new ubm.Circle2D(circleGeometry,style2D, {wkid: 4326})

使用Circle3D类来绘制。

const circle3D = new ubm.Circle3D(circleGeometry,style3D, {wkid: 4326})

面

面是由环数组组成。

底图与高程