arcgis 前端部分基础知识

发表于

添加图层

1
2
3
4
5
6
7
let FeatureLayer = await arcgisPackage.FeatureLayer//加载图FeatureLayer图层类
const layer = new FeatureLayer({
  id: '',
  url: '',
  popupTemplate:'弹框模板'
})
this.map.add(layer);//加入图层

添加点

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 var Graphic = await arcgisPackage.Graphic;
 var Point = await arcgisPackage.Point;
 var TextSymbol = await arcgisPackage.TextSymbol;
 var point = new Graphic({
  geometry: new Point({
    x: 104.51993504054901,
    y: 28.783612050877007,
  }),
  symbol: new TextSymbol({
    color: "white",
    haloColor: "#ff0000",
    haloSize: "2px",
    horizontalAlignment:"left",
    text: "我是点",
    font: {
      size: 10,
      family: "sans-serif",
      weight: "normal"
    }
  })
});
this.pointLayer.add(point)

添加线

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 var Polyline = await arcgisPackage.Polyline;
 var Graphic = await arcgisPackage.Graphic;
 var SimpleLineSymbol = await arcgisPackage.SimpleLineSymbol;
 var paths = [
                [  
                    [104.50458346971867,28.792993566384563]
                    , 
                    [104.51993504054921,28.783612050877007],
                ]
            ];
var line = new Graphic({
  geometry:new Polyline({
                hasZ: false,
                hasM: true,
                paths: paths,
                spatialReference: { wkid: 4326 }
            });,
  symbol:new SimpleLineSymbol({
                color: [255,255,0],
                width: 4
            })
});
this.pointLayer.add(point)

添加面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 var Polygon  = await arcgisPackage.Polygon;
 var Graphic = await arcgisPackage.Graphic;
 const rings = [
        [  // first ring
            [-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]  // same as first vertex
            ], [  // second ring
            [-97.06326,32.759,35.4],
            [-97.06298,32.755,35.5],
            [-97.06153,32.749,35.6],
            [-97.06326,32.759,35.4]  // same as first vertex
        ]
    ];
var polygon = new Graphic({
    geometry:new Polygon({
                hasZ: false,
                hasM: true,
                rings: rings,
                spatialReference: { wkid: 4326 }
            });,
});
this.polygonLayer.add(polygon)
0%