arcgis jsapi接口入門系列（8）：鼠標在地圖畫面

初始化，每一個map執行一次

PS：畫點也差很少，都是用SketchViewModel，所以本demo沒有專門寫畫點的

drawPolygonInit: function () {
            //畫幾何對象初始化

            //新建一個圖形圖層用於存放畫圖過程當中的圖形
            let layer = new this.apiInstance.GraphicsLayer({
                //空間參考，通常要跟地圖的同樣
                spatialReference: this.mapView.spatialReference,
            });
            //圖層添加到地圖
            //PS：GraphicsLayer也是圖層之一，所以也支持通用的圖層功能
            this.map.add(layer);

            //new SketchViewModel，此對象用於畫圖
            this.sketchPolygon = new this.apiInstance.SketchViewModel({
                //mapView
                view: this.mapView,
                //一個圖形圖層
                layer: layer,
                polygonSymbol: {
                    type: "simple-fill",  // autocasts as new SimpleMarkerSymbol()
                    color: "rgba(138,43,226, 0.8)",
                    style: "solid",
                    outline: { // autocasts as new SimpleLineSymbol()
                        color: "white",
                        width: 1
                    }
                }
            });

            //綁定create-complete事件，新增畫圖完成時會觸發
            this.sketchPolygon.on("create-complete", function (event) {
                //畫的幾何對象類型，值同開始畫的create方法的參數1
                let drawGeometryType = event.tool;
                //畫的結果的幾何對象
                //PS：畫完後SketchViewModel建立的圖形會消失，所以若是要在畫完後還要顯示在地圖上，就要另外再編碼畫在地圖上，SketchViewModel只會提供畫的結果的幾何對象
                let geometry = event.geometry;

                //樣式
                //PS：其餘高級樣式配置請看樣式的章節
                let style = {
                    //線顏色
                    color: [50, 205, 50, 0.3],
                    outline: {
                        color: [255, 0, 0],
                        width: 1
                    }
                };

                let graphic = mapUtil.geometry.polygonToPolygonGraphic(this.apiInstance, geometry, style, this.mapView.spatialReference, null);

                //把圖形添加到地圖的圖形集合
                //PS：圖形要在地圖上顯示，能夠添加到兩種地方。一是mapView的graphics，這是地圖的圖形容器。第二是建立圖形圖層（GraphicsLayer），而後把圖形加入到圖層裏
                this.mapView.graphics.add(graphic);
            }.bind(this));
            //
            // //綁定update-complete事件，編輯畫圖完成時會觸發
            // this.sketchPolyline.on("update-complete", function (event) {
            //     //畫的結果的幾何對象
            //     //PS：畫完後SketchViewModel建立的圖形會消失，所以若是要在畫完後還要顯示在地圖上，就要另外再編碼畫在地圖上，SketchViewModel只會提供畫的結果的幾何對象
            //     let geometry = event.geometry;
            //
            //     //後續代碼略。。。
            // }.bind(this));
        },

開始畫面

drawPolygon: function () {
            //開始畫面
            //參數1：畫的幾何類型，有值：point=點 | multipoint=多點 | polyline=線 | polygon=面 | rectangle=矩形 | circle=原型
            this.sketchPolygon.create("polygon");
        },