도구로 바로 가기
ViewCSV
파일을 업로드하지 않습니다

CSV로 움직이는 차트 영상 만들기

quarterly-revenue-example.csv· 예시 데이터48행 · 4열
표 형태
기간과 항목 조합마다 한 행입니다. 시간 열, 이름 열, 값 열로 이루어집니다.
미리 보기1,280 × 720픽셀
타임라인
0 / 12초

2024-Q1 표시 중

이 브라우저에서 만들 수 있는 영상 형식을 확인하는 중…

이 프레임의 값(항목 6개)
2024-Q1의 값
region값
인천76.3
광주53.3
서울52
부산39.7
대전33.9
대구26.1

48행 → 8개 기간 × 6개 항목, 사용한 숫자 48개, 값이 없는 기간·항목 칸 0개.

CSV를 영상으로 만들려면 시간 열(연도, 월, 날짜, 분기)이 있는 파일을 열고, 항목 열과 값 열을 고른 뒤 바 차트 레이스 같은 애니메이션을 정하고 ‘영상 만들기’를 누르세요. 영상은 브라우저에서 그리고 인코딩합니다. 이 브라우저가 지원하면 MP4나 WebM으로, 그렇지 않으면 움직이는 GIF로 저장하며, 원하는 프레임을 PNG로 받을 수도 있습니다. 빠진 값은 따로 정하지 않는 한 빈칸으로 남고, 같은 기간·항목이 반복되는 행은 직접 고른 방법으로 합쳐야 합니다. CSV는 업로드되지도, 바뀌지도 않습니다.

CSV 파일로 차트 영상을 만드는 방법

  1. CSV 파일을 열거나 끌어다 놓거나 붙여넣으세요. 다른 ViewCSV 도구에서 연 파일을 그대로 써도 됩니다. 예시는 가상의 분기별 매출 표입니다.
  2. 데이터에서 표 형태를 고르세요. 세로형 표에는 시간, 항목, 값 열이 있고, 가로형 표는 계열마다 열이 하나씩 있습니다.
  3. 구성에서 애니메이션과 디자인을 고르고 제목, 출처, 단위를 넣으세요. 필요하면 로고나 배경 이미지도 추가합니다.
  4. 영상에서 화면 비율(16:9, 1:1, 9:16), 해상도, 길이, 프레임 레이트, 첫 기간과 마지막 기간을 정하세요.
  5. 타임라인을 움직이거나 기간을 하나씩 넘기며 프레임을 확인한 뒤, 저장 형식을 고르고 영상 만들기를 누르세요.

10가지 애니메이션

바 차트 레이스순위가 바뀔 때마다 가로 막대가 늘고 줄며 자리를 바꿉니다. 음수 값은 0의 왼쪽으로 뻗습니다.
그려지는 꺾은선항목마다 선 하나를 기간별로 이어서 그립니다. 축이 고정되어 있어 앞서 그린 값은 움직이지 않습니다.
비율 도넛해당 기간 모든 항목의 합계에서 각 항목이 차지하는 비율입니다. 표시 개수를 넘는 항목은 ‘기타’로 묶습니다.
KPI 카드카드 최대 6장에 현재 값과 직전 기간 대비 증감률을 보여 줍니다.
목표 달성률공통 목표나 목표 열 대비 실적과 달성률을 보여 주며, 100%를 넘는 값도 그대로 표시합니다.
시간 흐름 히트맵항목 × 기간 격자가 현재 기간까지 채워집니다. 빠진 칸은 기본적으로 비어 있으며, 고른 처리 방법(마지막 값 이어 쓰기 또는 0)에 따라 채울 수도 있습니다.
버블 차트값 열은 세로축, 두 번째 열은 가로축, 세 번째 열은 원의 면적으로 나타냅니다.
폭포 차트부호가 있는 증감을 파일 순서대로 쌓아 순합계까지 보여 줍니다. 이익 증감 분석 등에 씁니다.
비율 변화기간마다 100% 막대 하나를 놓아, 여러 기간의 구성비를 한눈에 비교할 수 있습니다.
3D 막대조명이 있는 3D 무대 위에 막대를 세우며, 카메라를 천천히 돌릴 수도 있습니다. WebGL 2가 필요합니다.

시계열 데이터 준비: 기간, 중복, 빠진 값

  • 기간 순서. 자동 정렬은 시간 열 전체를 한 번 확인합니다. 모든 기간이 숫자면 숫자순으로, 그렇지 않고 모든 기간이 2024, 2024-03, 2024-03-31, 2024-Q1 같은 날짜면 날짜순으로 정렬하고, 둘 다 아니면 전체를 자연 정렬하므로 week 10이 week 9 뒤에 옵니다. 숫자, 날짜, 텍스트가 섞인 열을 칸마다 종류별로 나눠 정렬하지는 않습니다. 파일 순서를 그대로 쓸 수도 있습니다. 날짜순에서는 2023-02-29처럼 존재하지 않는 날짜를 받지 않습니다.
  • 중복 행. 같은 기간과 항목이 두 번 이상 나오면 영상 만들기가 멈추고 반복되는 조합 수를 알려 줍니다. 합계, 평균, 최솟값, 최댓값, 마지막 행 중 합치는 방법을 고르세요. 알리지 않고 합치는 일은 없습니다.
  • 빠진 값. 기본적으로 값이 없는 기간은 빈칸으로 남아, 그 기간에는 막대나 선이 나타나지 않습니다. 마지막 값을 이어 쓰거나 0으로 표시할 수도 있으며, 그러면 영상의 상태 표시줄에 그렇게 적힙니다. 뒤의 값으로 앞 기간을 채우지는 않습니다.
  • 지수와 증감률. 지수는 항목마다 0이 아닌 첫 값을 100으로 놓고 나눕니다. 0보다 작은 값으로 시작하는 계열은 지수가 의미 없으므로 비워 둡니다. 증감률은 각 기간을 바로 앞 기간과 비교하며, 앞 기간이 비어 있거나 0이면 비워 둡니다.

레이블은 적힌 그대로 쓰므로 North와 North 는 서로 다른 항목입니다. CSV 자체는 바뀌지 않습니다.

숫자를 읽고 표시하는 방식

셀 전체가 1200, -4.5, 3e5처럼 일반 숫자이고 고른 소수점 기호를 쓸 때만 값으로 씁니다. 단위, 통화 기호, 천 단위 구분 기호(1,200)가 붙은 셀이나 배정밀도로 정확히 담을 수 없는 숫자는 빼고 경고에 개수를 알려 주며, 0으로 그리지 않습니다.

두 기간 사이의 움직임은 관측된 두 값을 직선으로 보간한 것이며, 상태 표시줄에 어느 기간 사이인지 나옵니다. 중간 프레임은 데이터가 아닙니다. 값 표에는 지금 보이는 프레임의 값이 그대로 나옵니다. 상태 표시줄과 함께 보면 그 프레임이 실제 관측된 기간인지, 두 기간 사이를 보간한 것인지, 빠진 값 처리 방법으로 채운 값이 들어 있는지 알 수 있습니다. 영상 속 숫자는 표시 언어의 형식과 고른 소수점 자릿수를 따르며, 비율과 달성률은 백분율로 나타냅니다. 계산 결과가 너무 커서 정확히 그릴 수 없으면, 깨진 차트를 그리지 않고 그 사실을 알려 줍니다.

영상, GIF, PNG 다운로드

MP4와 WebM이 브라우저가 만들 수 있을 때만 표시됩니다. WebCodecs를 쓸 수 있으면 프레임을 정확한 시점에 하나씩 인코딩하므로 어떤 기기에서도 영상이 부드럽습니다. 그렇지 않으면 브라우저가 애니메이션을 실시간으로 녹화하므로 탭을 앞에 띄워 두어야 합니다.
움직이는 GIF초당 10프레임, 긴 변 640픽셀, 최대 30초입니다.
PNG타임라인 현재 위치의 프레임을 영상과 같은 크기로 저장합니다.
크기16:9, 1:1, 9:16 비율에 720p 또는 1080p, 길이 2~60초, 초당 24, 30, 60프레임. 다운로드 한 번에 최대 64 MB입니다.

영상에는 소리가 없습니다. 보는 사람이 읽을 수 있도록 처음과 끝에서는 첫 기간과 마지막 기간을 잠시 보여 줍니다. 내보내는 도중에 데이터나 설정을 바꾸거나 페이지를 떠나면 내보내기가 멈추므로, 이전 상태의 파일이 저장되는 일은 없습니다.

한도와 개인정보 보호

영상 하나에는 기간 500개, 항목 200개, 기간 × 항목 칸 10만 개까지 담을 수 있으며, 원본 파일은 25 MB, 10만 행 또는 200만 셀까지입니다. 더 큰 파일은 먼저 행을 필터링하거나 피벗 테이블로 요약하세요. 움직이지 않는 차트가 필요하면 CSV 차트 만들기를 쓰세요.

로고와 배경 이미지를 포함해 모든 것이 브라우저 탭 안에 머뭅니다. 파일과 영상은 업로드되지 않습니다.

예시: 지역별 매출 바 차트 레이스

분기와 지역마다 한 행이 있는 세로형 표입니다. 시간 quarter, 항목 region, 값 revenue로 정하면 프레임마다 막대 3개가 나옵니다. 2024-Q2의 West 값은 빠져 있어 빈칸으로 남으므로, 그 기간에는 West 막대가 없습니다.

CSV
quarter,region,revenue
2024-Q1,North,52
2024-Q1,South,33
2024-Q1,West,69
2024-Q2,North,64
2024-Q2,South,54
2024-Q3,North,76
2024-Q3,South,75
2024-Q3,West,77
영상의 바탕이 되는 시계열 데이터
{
  "periods": ["2024-Q1", "2024-Q2", "2024-Q3"],
  "series": {
    "North": [52, 64, 76],
    "South": [33, 54, 75],
    "West": [69, null, 77]
  },
  "missing": 1
}

자주 묻는 질문

MP4를 고를 수 없는 이유는 무엇인가요?

모든 브라우저가 MP4 파일을 만들 수 있는 것은 아닙니다. 형식 목록에는 이 브라우저가 실제로 인코딩할 수 있는 형식만 나오며, GIF와 PNG는 항상 쓸 수 있습니다. MP4가 필요하면 최신 Chrome, Edge, Safari를 사용해 보세요.

국가마다 열이 따로 있는 데이터도 되나요?

네. 가로형 표 형태를 고르고 애니메이션에 쓸 열을 선택하세요. 열마다 계열 하나가 되며, 열 머리글이 계열 이름이 됩니다.

어떤 기간에 막대가 보이지 않는 이유는 무엇인가요?

그 기간에 해당 항목의 일반 숫자가 없어서 빈칸으로 남았습니다. 데이터에 맞는다면 ‘빠진 값’에서 ‘마지막 값 이어 쓰기’나 ‘0으로 표시’를 고르거나, CSV 편집기에서 셀을 고치세요.

표준 및 참고 자료