arcGis for javaScript 4.x 간단 하고 실 용적 인 그리 기 점,선,면 geometry 함수 와 symbol 함수 방법

1,new 대상 의 기본 방법 사용
점.

const pointGeometry = new Point({
     
	longitude：-118.29026, 
	latitude：34.1816
});

const pointSymbol = new SimpleMarkerSymbol({
     
	color: [226, 119, 40],
	outline: {
     
		color: [255, 255, 255],
		width: 1
	}
})

실.

const lineGeometry = new Polyline({
     
	paths: [
		[-118.29026, 34.1816],
		[-118.26451, 34.09664]
	]
});

const lineSymbol = new SimpleLineSymbol({
     
	color: [226, 119, 40],
	width: 2
});

얼굴

var polygonGeometry = new Polygon({
     
	rings: [
		[-118.27653, 34.15121],
		[-118.2446, 34.15462],
		[-118.22915, 34.14439],
		[-118.23327, 34.12279],
		[-118.25318, 34.10972],
		[-118.26486, 34.11625],
		[-118.27653, 34.15121]
	]
});

var fillSymbol = new SimpleFillSymbol({
     
	color: [227, 139, 79, 0.8],
	outline: {
     
		color: [255, 255, 255],
		width: 1
	}
});

2,다른 방식 으로

export default {
     
    methods: {
     
        createPointGeometry(longitude, latitude) {
     
            //     Geometry new Point()
            return {
     
                type: 'point',
                longitude,
                latitude
            }
        },
        createPointSymbol(color, style = 'circle', size, outlineColor, outlineWidth) {
     
            //     Symbol
            return {
     
                type: "simple-marker",
                style,  // "circle"|"square"|"cross"|"x"|"diamond"|"triangle"|"path"
                color,
                size,
                outline: {
     
                    color: outlineColor,
                    width: outlineWidth
                }
            };
        },
        createPictureMarkerSymbol(url, width, height) {
     
            //       Symbol
            return {
     
                type: "picture-marker",
                url, width, height
            };
        },
        createPolylineGeometry(paths) {
     
            //     Geometry new Polyline()
            return {
     
                type: 'polyline',
                paths
            }
        },
        createSimpleLineSymbol(color, width = 2, style = 'solid') {
     
            //     simpleLineSymbol
            return {
     
                type: 'simple-line', 
                color, width, 
                style // "dash"|"dash-dot"|"dot"|"long-dash"|"long-dash-dot"|
                	 // "long-dash-dot-dot"|"none"|"short-dash"|"short-dash-dot"
                	 // |"short-dash-dot-dot"|"short-dot"|"solid"
            }
        },
        createFillGeometry(rings = []) {
     
            //      polygon new Polygon()
            return {
     
                type: 'polygon',
                rings
            }
        },
        createFillSymbol(color, style = 'solid', width, outlineColor) {
     
            //     Symbol
            return {
     
                type: "simple-fill",    
                style,		// "backward-diagonal"|"cross"|"diagonal-cross"
                			//|"forward-diagonal"|"horizontal"|"none"|"solid"|"vertical"
                color,
                outline: {
     
                    color: outlineColor,
                    width
                }
            };
        },
        createToScreenGeometry(x, y) {
     
            //    mapView.toScreen(geometry)    geometry,      
            return {
     
                x, y,
                spatialReference: {
     
                    wkid: 4326
                }
            }
        }
    }
}