임베딩 SDK
이 페이지의 내용
Embedding SDK를 사용하여 차트나 대시보드를 웹 애플리케이션에 임베드하여 설정 및 렌더링을 보다 유연하게 조정할 수 있습니다.
학습 내용은 임베딩 SDK 시작하기를 참조하세요.
임베딩 SDK 설치
간단한 웹 앱이 있는 경우 스크립트 태그에서 Embedding SDK를 참조할 수 있으며 설치가 필요하지 않습니다. UMD를 사용하여 브라우저에서 직접 @mongodb-js/charts-embed-sdk를 실행할 수 있습니다.
<script src="https://unpkg.com/@mongodb-js/charts-embed-dom"></script>
npm 또는 yarn을 사용하여 더 복잡한 웹 앱을 구축하는 경우 임베딩 SDK를 설치하여 스크립트 파일에서 바로 사용할 수 있습니다.
npm으로 임베딩 SDK를 설치하려면 다음 명령을 사용합니다:
npm install @mongodb-js/charts-embed-dom
yarn으로 설치하려면 다음을 따릅니다:
yarn add @mongodb-js/charts-embed-dom
예시
임베딩 SDK를 사용하는 예시 앱 는 에서 찾을 수 codesandbox.io 있습니다. 예시 앱 은 인터랙티브 필터하다 및 수동 새로 고침 버튼을 포함하여 임베딩 SDK에서 사용할 수 있는 몇 가지 인터랙티브 기능을 보여줍니다.
예시 앱은 해당 앱 전용 차트 ID와 기본 URL로 구성됩니다. 올바른 차트 ID나 대시보드 ID 및 기본 URL을 사용하여 자체 앱을 구성합니다.
예시 앱에서는 두 가지 SDK 메서드를 사용합니다.
메서드 | 설명 | Args | 반환 |
|---|---|---|---|
refresh() | 데이터 소스의 최신 데이터로 차트를 다시 로드합니다. | none | Promise<void> |
setFilter() | 지정된 MQL 필터 문서를 기반으로 임베딩된 차트를 필터링합니다. 필터에 포함된 모든 필드는 임베드 차트(Embed Chart) 모달에서 지정되어야 합니다. SDK를 사용하여 임베딩된 차트 필터링을 참조하세요. | 필터 객체 | Promise<void> |
다른 예시는 MongoDB 임베딩 SDK 예시 GitHub 리포지토리에서 확인할 수 있습니다.