노션 테이블로 차트 만들기

노션의 기본 기능으로는 차트나 그래프를 만들 수가 없다.

대신 차선책으로 외부에서 임베드해서 가져올 수는 있다.

 

그래서 이번에는 노션 테이블을 가지고 차트를 임베드하는 방법을 알아보려 한다.

 

 

 

 

1. 노션에서 테이블 만들기

먼저 노션에서 테이블을 하나 만들고 내용을 입력해준다.

나는 보유한 주식의 종목별 / 분야별 비중을 나타내는 표를 하나 만들었다. 

 

 

 

2. 테이블을 csv파일로 내보내기 -> 구글 스프레드로 열기

이것을 가지고 차트를 만들려면 일단 이 표를 csv 파일로 내보내기 한 다음 구글 스프레드로 열어줘야 한다. 

 

 

여기서 내가 필요한 열은 '종목'과 '현재가치'라고 되어 있는 열이다.

이것을 가지고 총 시드에서 각 종목이 차지하는 비율을 도넛 차트로 만들어 줄 것이다. 

 

 

 

 

3. Notion Vip

차트를 만들기 위해 필요한 사이트가 notion vip이라는 사이트이다.

회원가입 필요 없이 무료로 차트를 만들 수 있는 게 장점이다.

www.notion.vip/charts/

Notion Charts

 

 

위의 주소로 사이트에 들어가면 중간쯤에 아래와 같이 기입할 수 있는 공간이 나온다.

하나씩 살펴보자.

 

 

 

첫 번째 GOOGLE SHEETS DOCUMENT ID란에는 위에서 열어 놓은 구글 스프레드의 URL 주소를 긁어와야 하는데 주소 중에 /d/와 /edit 사이에 있는 부분만 긁어오면 된다.

즉, 아래 그림에서 밑줄 친 부분을 긁어다가 붙여 넣기 하면 된다.

 

 

❗❗❗주의할 점❗❗❗

스프레드시트의 오른쪽 상단에 보면 공유 상태가 잠겨있을 텐데 이것을 눌러서 '링크가 있는 모든 사용자에게 공개'로 바꾸어 주어야 노션에서 정상적으로 차트를 볼 수 있다. 

 

 

 

 

다음으로 SHEET NAME에는 차트 이름을 마음대로 지정해주면 된다.

 

세 번째에 DATA RANGE에는 해당 스프레드시트에서 필요한 데이터 범위를 지정해주는 것인데 나의 경우는 A1:B13까지가 필요하므로 그렇게 적어주었다. 

 

 

 

 

그다음으로 차트를 커스터마이징 할 수 있는 공간이 나온다. 

 

첫 번째 CHART TYPE에서는 차트의 종류를 고를 수 있는데 총 6개 종류가 있고 나는 도넛을 선택해 주었다. 

 

THEME에서는 라이트 모드/ 다크 모드를 설정할 수 있고 

 

HORIZONTAL AXIS FORMATTING과 VERTICAL AXIS FORMATTING에서는 X축, Y축에 어떤 포맷을 적용할지를 선택할 수 있다. 지금은 도넛 차트라서 둘 다 None으로 설정해주었다.

Bar나 Line 타입의 차트를 만들 때 원하는 포맷을 적용하면 될 것 같다.

 

마지막으로 Craft Yout Pallet에서는 노션에서 제공되는 컬러와 같은 9가지 색상으로 차트를 꾸밀 수 있다.

원하는 색상을 지정해주면 된다.

 

 

모든 설정을 마쳤다면 아래 MAKE MAGIC을 클릭! 

 

 

 

그러면 아래처럼 Bingo란 메시지와 함께 임베드할 수 있는 URL이 생긴다.

COPY YOUR URL을 클릭한 뒤 차트를 보고 싶은 노션 페이지에 가서 붙여 넣기 (Create embed) 해주면 끝이다.

 

 

 

아래는 실제 노션에 적용해본 모습이다.

범례와 도넛 차트가 지정한 색상과 함께 잘 나온 것을 확인할 수 있다.