WebGL

WebGLOverlayView 클래스

google.maps.WebGLOverlayView 클래스

WebGL 오버레이 뷰를 사용하면 Google Maps Platform에서 벡터 기본 지도를 렌더링하는 데 사용하는 동일한 WebGL 렌더링 컨텍스트에 직접 액세스할 수 있습니다. 이러한 공유 렌더링 컨텍스트를 사용하면 3D 건물 도형을 사용한 깊이 오클루전과 2D/3D 콘텐츠를 기본 지도 렌더링과 동기화하는 등의 이점을 얻을 수 있습니다.

WebGL Overlay View를 사용하면 WebGL을 직접 사용하거나 Three.js 또는 deck.gl과 같은 인기 그래픽 라이브러리를 사용하여 지도에 콘텐츠를 추가할 수 있습니다. 오버레이를 사용하려면 google.maps.WebGLOverlayView를 확장하고 WebGLOverlayView.onAdd, WebGLOverlayView.onContextRestored, WebGLOverlayView.onDraw, WebGLOverlayView.onContextLost, WebGLOverlayView.onRemove 수명 주기 후크 각각에 관한 구현을 제공합니다.

onRemove() 메서드를 트리거하려면 유효한 Map 객체로 WebGLOverlayView.setMap를 호출하여 onAdd() 메서드와 setMap(null)에 대한 호출을 트리거해야 합니다. setMap() 메서드는 생성 시 또는 나중에 오버레이를 삭제한 후 다시 표시해야 할 때 호출할 수 있습니다. 그러면 확대/축소, 중심 또는 지도 유형과 같이 요소의 위치를 변경할 수 있는 지도 속성이 변경될 때마다 onDraw() 메서드가 호출됩니다. WebGLOverlayView는 MapOptions.mapId가 있는 벡터 지도에만 추가할 수 있습니다.

이 클래스는 MVCObject를 확장합니다.

const {WebGLOverlayView} = await google.maps.importLibrary("maps")를 호출하여 액세스합니다. Maps JavaScript API의 라이브러리를 참고하세요.

생성자
WebGLOverlayView	WebGLOverlayView() 매개변수: 없음 WebGLOverlayView를 만듭니다.

방법
getMap	getMap() 매개변수: 없음 반환 값:  Map|null|undefined
onAdd	onAdd() 매개변수: 없음 반환 값: 없음 WebGL 렌더링 컨텍스트에 즉시 액세스할 필요가 없는 오버레이를 그리기 전에 중간 데이터 구조를 가져오거나 만들려면 이 메서드를 구현합니다. 렌더링하려면 이 메서드를 구현해야 합니다.
onContextLost	onContextLost() 매개변수: 없음 반환 값: 없음 이 메서드는 어떤 이유로든 렌더링 컨텍스트가 손실되면 호출되며 더 이상 필요하지 않으므로 기존 GL 상태를 정리해야 합니다.
onContextRestored	onContextRestored(options) 매개변수:  options:  개발자가 GL 컨텍스트를 복원할 수 있는 WebGLStateOptions입니다. 반환 값: 없음 이 메서드는 렌더링 컨텍스트를 사용할 수 있을 때 호출됩니다. 이를 사용하여 셰이더 또는 버퍼 객체와 같은 WebGL 상태를 초기화하거나 바인딩합니다.
onDraw	onDraw(options) 매개변수:  options:  개발자가 연결된 Google 기본 지도에 콘텐츠를 렌더링할 수 있는 WebGLDrawOptions입니다. 반환 값: 없음 지도에 WebGL 콘텐츠를 직접 그리려면 이 메서드를 구현합니다. 오버레이에 새 프레임을 그려야 하면 WebGLOverlayView.requestRedraw를 호출합니다.
onRemove	onRemove() 매개변수: 없음 반환 값: 없음 이 메서드는 WebGLOverlayView.setMap(null)가 있는 지도에서 오버레이가 삭제될 때 호출되며 여기에서 모든 중간 객체를 삭제해야 합니다. 렌더링하려면 이 메서드를 구현해야 합니다.
onStateUpdate	onStateUpdate(options) 매개변수:  options:  개발자가 GL 컨텍스트를 복원할 수 있는 WebGLStateOptions입니다. 반환 값: 없음 이 메서드를 구현하여 렌더링 애니메이션 프레임 외부의 GL 상태 업데이트를 처리합니다.
requestRedraw	requestRedraw() 매개변수: 없음 반환 값: 없음 지도를 트리거하여 프레임을 다시 그립니다.
requestStateUpdate	requestStateUpdate() 매개변수: 없음 반환 값: 없음 GL 상태를 업데이트하도록 지도를 트리거합니다.
setMap	setMap([map]) 매개변수:  map:  Map optional div, 모델, 보기 상태에 액세스하는 지도 반환 값: 없음 지도에 오버레이를 추가합니다.
상속됨: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

WebGLDrawOptions 인터페이스

google.maps.WebGLDrawOptions 인터페이스

그리기 옵션

속성
gl	유형:  WebGLRenderingContext 이 WebGLOverlayView를 렌더링할 WebGLRenderingContext를 지정합니다.
transformer	유형:  CoordinateTransformer 카메라 공간에서 위도/경도 좌표로 행렬을 변환합니다.

WebGLStateOptions 인터페이스

google.maps.WebGLStateOptions 인터페이스

GL 상태 옵션

속성
gl	유형:  WebGLRenderingContext 이 WebGLOverlayView를 렌더링할 WebGLRenderingContext를 지정합니다.

CoordinateTransformer 인터페이스

google.maps.CoordinateTransformer 인터페이스

이 인터페이스는 Google 기본 지도 위에 WebGL 장면을 렌더링하는 데 사용할 매트릭스를 생성하는 편리한 메서드를 제공합니다.

참고: 이 객체에 대한 참조는 캡슐화 WebGLOverlayView.onDraw 호출 범위 밖에서 유지되어서는 안 됩니다.

방법
fromLatLngAltitude	fromLatLngAltitude(latLngAltitude[, rotations, scale]) 매개변수:  latLngAltitude:  LatLngAltitude|LatLngAltitudeLiteral 위도, 경도, 고도 rotations:  Float32Array optional XYZ 규칙에 오일러 회전 각도를 도 단위로 포함한 배열입니다. scale:  Float32Array optional 기본 축에 적용할 XYZ 스칼라 배열을 포함하는 배열입니다. 반환 값: WebGL과 함께 사용할 Float64Array MVP 매트릭스
getCameraParams	getCameraParams() 매개변수: 없음 반환 값: 카메라 매개변수 CameraParams개

CameraParams 인터페이스

google.maps.CameraParams 인터페이스

WebGLOverlayView에 사용되는 GL 카메라의 매개변수와 같은 카메라 매개변수를 검색하는 데 사용됩니다.

이 인터페이스는 CameraOptions를 확장합니다.

속성
center	유형:  LatLng
heading	유형:  number
tilt	유형:  number
zoom	유형:  number