커뮤니티 시각화에서 변경사항을 확인하는 일반적인 워크플로는 파일을 GCS에 업로드한 다음 데이터 스튜디오 보고서를 새로고침하는 것입니다. 이 방법은 작동하지만 변경사항을 확인하는 데 많은 시간을 할애해야 합니다. dscc-gen을 사용하면 시각화 코드 변경사항을 즉시 확인할 수 있는 워크플로가 지원되어 커뮤니티 시각화를 작성하는 데 걸리는 시간이 줄어듭니다.
시작하려면 npm 5.2.0 이상과 gsutil이 설치되어 있어야 합니다. 그런 다음 다음을 실행합니다.
npx @google/dscc-gen viz
최초 구성
dscc-gen에는 시각화하려는 데이터를 대표하지 않을 수 있는 기본 로컬 데이터 세트가 함께 제공됩니다. 필요에 맞게 이 데이터 세트를 업데이트하려면 다음 단계를 따르세요.
src/index.json에서 구성을 업데이트합니다.npm run update_message을 실행합니다. 이렇게 하면 복사하기 쉬운 형식으로 message를 표시하는 시각화가dev버킷에 배포됩니다.- 새 보고서를 만들고 시각화하려는 데이터를 대표하는 데이터 세트에 연결합니다.
dev버킷을 구성요소 ID로 사용하여 커뮤니티 시각화를 추가합니다.- 시각화의 콘텐츠를
scripts/data/localData.js에 복사합니다. 이 데이터는 로컬에서 개발할 때 사용됩니다.
스크립트
dscc-gen로 만든 시각화 프로젝트에 사용할 수 있는 스크립트는 다음과 같습니다.
| 명령어 | 작업 |
|---|---|
npm run start
|
로컬 서버를 시작하고 시각화 미리보기 |
npm run update_message |
objectFormat을 사용하여 메시지 업데이트 |
npm run build:dev
|
캐싱이 사용 중지된 상태로 ./src에서 ./build로 파일을 빌드합니다. |
npm run push:dev |
build에서 dev 버킷으로 파일을 복사합니다. |
npm run build:prod
|
캐싱이 사용 설정된 상태로 ./src에서 ./build로 파일을 빌드합니다. |
npm run push:prod
|
build에서 prod 버킷으로 파일을 복사합니다. |
update_message 명령어는 기본적으로 objectFormat을 사용합니다. tableFormat을 사용하려면 package.json의 update_message 스크립트에서 -f object부터 -f table까지의 매개변수를 수정합니다.
Codelab
도구를 사용하는 방법을 알아보려면 dscc-gen Codelab을 검토하세요.
