Skip to main content
맞춤형 차트를 사용하면 패널에 로드할 데이터와 그 데이터를 시각화하는 방식을 모두 직접 제어할 수 있습니다. 이 튜토리얼에서는 데이터를 로깅하고, 쿼리를 구축하고, 차트의 Vega 사양을 맞춤 설정한 뒤, 결과를 저장해 재사용하는 과정을 단계별로 안내합니다. 기본 차트 유형만으로는 부족하여 특정 데이터에 맞는 시각화를 만들고 싶은 사용자를 위한 튜토리얼입니다. 이 튜토리얼을 마치면 프로젝트에 프리셋으로 저장할 수 있는 맞춤형 차트가 완성되며, 보너스로 자신의 데이터에 맞게 응용할 수 있는 합성 히스토그램도 얻을 수 있습니다.

W&B에 데이터 로깅하기

맞춤형 차트에서 데이터를 시각화하려면 먼저 run에서 표시할 데이터를 로깅해야 합니다. 하이퍼파라미터처럼 트레이닝 시작 시점에 한 번 설정되는 단일 값은 wandb.Run.config를 사용하세요. 시간에 따라 기록되는 여러 값은 wandb.Run.log()를 사용하고, 맞춤형 2D 배열은 wandb.Table()로 로깅하세요. 로깅하는 키 하나당 데이터 포인트는 최대 10,000개까지 로깅하는 것을 권장합니다.
간단한 예시 노트북을 사용해 보세요. 데이터 table을 로깅하고, 다음 단계에서 맞춤형 차트를 설정합니다. 결과 차트가 어떻게 표시되는지 라이브 보고서에서 확인하세요. 데이터를 로깅했으므로 이제 맞춤형 차트 패널로 가져올 준비가 되었습니다.

쿼리 만들기

쿼리는 맞춤형 차트에서 불러올 로깅된 데이터를 지정합니다. 시각화할 데이터를 로깅했다면 프로젝트 페이지로 이동하여 + 버튼을 클릭해 새 패널을 추가한 다음 Custom Chart를 선택하세요. custom charts demo workspace에서 직접 따라 해 볼 수 있습니다.
비어 있는 맞춤형 차트

쿼리 추가

  1. summary를 클릭하고 historyTable을 선택하여 run 이력에서 데이터를 가져오는 새 쿼리를 설정하세요.
  2. wandb.Table()을 로깅한 키를 입력하세요. 이전 코드 스니펫에서는 custom_data_table이었습니다. 예시 노트북에서는 pr_curve와 roc_curve입니다. summaryTable, historyTable, **tableKey**에 대한 자세한 내용은 GraphQL 쿼리 구축을 참조하세요.

Vega 필드 설정

쿼리가 준비되면 Vega 필드 드롭다운 메뉴를 사용하여 로깅한 열을 차트의 시각적 인코딩에 매핑할 수 있습니다.
쿼리 결과에서 열을 가져와 Vega 필드를 설정
  • x-axis: runSets_historyTable_r (recall)
  • y-axis: runSets_historyTable_p (precision)
  • color: runSets_historyTable_c (클래스 레이블)

차트 사용자 지정하기

기본 시각화로 시작해도 좋지만, Vega 사양을 편집하면 차트 유형을 변경하고, 제목을 추가하고, 모양을 세밀하게 조정할 수 있습니다. 산점도를 선형 플롯으로 전환하려면 Edit를 클릭하여 이 내장 차트의 Vega 사양을 변경하세요. custom charts demo workspace에서 직접 따라 해 보세요.
맞춤형 차트 선택
Vega 사양을 업데이트하여 시각화를 사용자 지정하세요.
  • 플롯, 범례, X축, Y축에 제목을 추가하세요(각 필드에 “title” 설정).
  • “mark” 값을 “point”에서 “line”으로 변경하세요.
  • 사용하지 않는 “size” 필드를 제거하세요.
PR 곡선 Vega 사양
프리셋을 저장하면 프로젝트의 다른 패널에서도 동일한 차트 설정을 재사용할 수 있습니다. 이 프로젝트의 다른 곳에서도 사용할 수 있도록 프리셋으로 저장하려면 페이지 상단의 Save as를 클릭하세요. 다음은 ROC 곡선과 함께 표시된 결과입니다.
PR 곡선 차트

보너스: 합성 히스토그램

이 섹션에서는 Vega 사양 편집에 익숙해진 후 어떤 작업을 할 수 있는지 보여주기 위해, 같은 뷰에 두 분포를 겹쳐 표시하는 합성 히스토그램이라는 고급 맞춤형 차트를 만드는 방법을 설명합니다. 히스토그램은 수치 분포를 시각화하여 대규모 데이터셋을 이해하는 데 도움이 됩니다. 합성 히스토그램은 동일한 구간에 여러 분포를 표시하므로, 서로 다른 모델이나 모델 내 서로 다른 클래스에 걸쳐 두 개 이상의 메트릭을 비교할 수 있습니다. 주행 장면에서 객체를 감지하는 시맨틱 분할 모델의 경우, 정확도 최적화와 IoU(Intersection over Union) 최적화의 효과를 비교하거나, 서로 다른 모델이 자동차(데이터에서 크고 흔한 영역)와 교통 표지판(훨씬 작고 드문 영역)을 얼마나 잘 감지하는지 알아볼 수 있습니다. 데모 Colab에서는 생물의 10개 클래스 중 두 클래스의 신뢰도 점수를 비교할 수 있습니다.
합성 히스토그램
맞춤형 합성 히스토그램 패널을 직접 만들려면 다음 단계를 따르세요.
  1. 워크스페이스나 보고서에 새 맞춤형 차트 패널을 만드세요(Custom Chart 시각화를 추가하세요). 오른쪽 위의 Edit을 클릭하여 기본 제공 패널 유형의 Vega 사양을 수정하세요.
  2. 기본 제공 Vega 사양을 Vega 합성 히스토그램 시작 코드로 바꾸세요. Vega 구문을 사용하여 이 Vega 사양에서 기본 제목, 축 제목, 입력 도메인 및 기타 세부 사항을 직접 수정할 수 있습니다. 예를 들어 색상을 변경하거나 세 번째 히스토그램을 추가할 수 있습니다.
  3. 오른쪽 패널의 쿼리를 수정하여 wandb 로그에서 올바른 데이터를 불러오세요. summaryTable 필드를 추가하고 해당 tableKey를 class_scores로 설정하여 run이 로깅한 wandb.Table을 가져오세요. 이렇게 하면 드롭다운 메뉴에서 class_scores로 로깅한 wandb.Table의 열을 선택하여 두 히스토그램 구간 집합(red_bins 및 blue_bins)을 채울 수 있습니다. 예를 들어 빨간색 구간에는 animal 클래스 예측 점수를, 파란색 구간에는 plant 클래스 예측 점수를 선택할 수 있습니다.
  4. 미리보기에 렌더링된 플롯이 원하는 모습이 될 때까지 Vega 사양과 쿼리를 계속 수정할 수 있습니다. 완료되면 상단의 Save as를 클릭하고 맞춤형 플롯에 이름을 지정하여 재사용할 수 있도록 하세요. 그런 다음 Apply from panel library를 클릭하여 플롯을 완성하세요.
다음은 간단한 실험의 결과 예시입니다. 단 1,000개의 예시로 한 에포크 동안 트레이닝한 모델은 대부분의 이미지가 식물이 아니라고 확신하지만, 어떤 이미지가 동물인지에 대해서는 확신하지 못합니다.
차트 설정
차트 결과
마지막 수정일 2026년 9월 30일