[연재] 시장 지표 — 같은 시장을 두 값으로 말하지 않기

장이 끝나자 등락률이 0.00%가 됐습니다

지수와 환율을 한 화면에서 보는 걸 만들다가 있었던 일입니다.

장중에는 잘 돌았어요. 코스피가 오르면 빨간 선이 올라가고 옆에 등락률이 붙습니다. 그런데 3시 반이 지나고 나서 화면을 다시 봤더니 이랬습니다.

등락률이 0.00% 였습니다.

그날 코스피는 분명히 움직였어요. 그래프도 하루치 곡선을 그리고 있었습니다. 그런데 그 옆의 숫자만 0.00% 였습니다.

원인은 기준선이었습니다.

장중 등락률은 "지금 값이 어제 종가보다 얼마나 올랐나" 잖아요. 그래서 어제 종가를 기준으로 잡아야 하는데, 제가 코드에 "일별 데이터의 마지막 값" 이라고 써놨습니다. 장중에는 그게 어제 종가라서 맞게 돌아요.

그런데 장이 끝나면 일별 데이터가 갱신됩니다. 마지막 값이 오늘 종가로 바뀝니다.

그러니까 이렇게 돼요. 오늘 종가를 오늘 종가와 비교합니다. 당연히 0.00% 입니다.

같은 코드가 3시 반 전에는 맞는 말을 하고 3시 반 후에는 틀린 말을 했습니다. 오늘은 이 이야기를 해보려고 합니다. 숫자를 가져다 보여주는 일이 왜 생각보다 정할 게 많았는지요.

앱을 세 개 열고 있었습니다

왜 만들었는지부터요.

아침에 지수를 확인하는 게 습관인데, 그걸 보려고 앱을 세 개 열고 있었습니다. 코스피 보는 앱, 환율 보는 앱, 종목 보는 앱이요. 각자 화면이 다르고 기간 고르는 방식도 달라서, 세 개를 나란히 놓고 비교하는 게 안 됐습니다.

보고 싶은 건 단순했어요. 코스피·코스닥·달러원·삼성전자·SK하이닉스 다섯 개를 한 화면에서, 같은 방식으로.

그리고 하나 더 있었습니다. 제가 만든 현황판에 이걸 얹으면 아침에 한 번 보고 끝낼 수 있잖아요. 그래서 사이트 안에 넣기로 했습니다.

만들기 전에 예상한 어려움은 "데이터를 어디서 받나" 였습니다. 실제로 어려웠던 건 받은 다음이었어요.

기준을 어디 두느냐로 같은 시장이 두 값이 됩니다

기준선 문제를 고치면서 알게 된 게 있습니다. 등락률을 재는 방법이 여러 개인데, 그게 다 다른 숫자를 만든다는 거예요.

장중 등락률의 기준으로 쓸 수 있는 게 셋입니다.

두 번째가 특히 걸렸습니다. 09시 첫 값을 기준으로 하면 코드는 깔끔해요. 그날 데이터의 첫 점을 쓰면 되니까요. 그런데 그렇게 하면 제 화면만 다른 숫자를 말합니다.

포털에서 "코스피 +0.8%" 를 보고 제 화면에 와서 "+0.6%" 를 보면, 어느 쪽이 틀린 게 아니라 기준이 다른 겁니다. 그런데 보는 사람은 그걸 모르잖아요. 하나가 틀렸다고 생각합니다.

그래서 세 번째로 갔습니다. 날짜로 짚어서 직전 거래일 종가를 찾아 쓰는 방식이요. 코드는 조금 길어졌는데, 이러면 장 시작부터 다음 날 아침까지 같은 기준을 유지합니다.

같은 시장을 두 값으로 말하지 않는 것. 이게 이 화면의 첫 번째 규칙이 됐습니다.

환율 그래프에 밤이 비어 있었습니다

두 번째로 걸린 건 환율이 지수와 성격이 다르다는 것이었습니다.

처음에는 다섯 개를 똑같이 다뤘어요. 다 그냥 "시간에 따라 변하는 숫자" 잖아요. 그래서 받아오는 것도 한 번에 묶어서, 평일 장 시간에 맞춰 돌게 해뒀습니다.

그런데 환율 그래프를 보니 밤과 주말이 통째로 비어 있었습니다.

당연한 일이었어요. 환율은 24시간 움직입니다. 뉴욕장이 열리는 밤에도 움직이고 주말에도 조금씩 움직여요. 그런데 저는 국내 장 시간에만 받아오게 해뒀으니, 그 바깥은 기록이 없는 거죠.

그래서 받아오는 걸 둘로 갈랐습니다.

• 지수·종목 — 평일 09시부터 15시까지
• 환율 — 하루 종일

이게 코드를 나누는 문제가 아니라 그 값이 언제 살아 있는지를 아는 문제였습니다. 다섯 개를 "다 같은 숫자" 로 본 게 처음의 실수였어요.

안 주는 값은 찍어서 쌓기로 했습니다

환율에는 문제가 하나 더 있었습니다. 분 단위 데이터를 안 줍니다.

지수는 줍니다. 요청하면 그날 하루치를 한 번에 받을 수 있어요. 그런데 환율은 찾아본 경로가 전부 없다고 나왔습니다. 지금 값은 주는데, 지나간 하루의 흐름은 안 줍니다.

그래서 방식을 바꿨어요. 없으면 우리가 찍어 쌓는 겁니다.

1분마다 지금 환율을 물어보고, 받은 값을 물어본 시각과 함께 적어둡니다. 그게 쌓이면 분 단위 그래프가 됩니다. 그러니까 이 그래프는 받아온 게 아니라 우리가 만든 기록이에요.

여기서 성격이 하나 생깁니다. 우리가 얼마나 자주 물어보느냐가 그래프의 촘촘함이 됩니다. 1분마다 물어보면 1분 간격 그래프, 5분마다면 5분 간격이요. 남이 준 데이터를 그릴 때는 없던 개념입니다.

그리고 정할 게 하나 더 나왔어요. 값이 안 바뀌었을 때 어떻게 하나.

환율이 15분 동안 그대로일 수 있잖아요. 값이 같으니 안 적어도 될 것 같은데, 그러면 나중에 그 구간을 볼 때 안 움직인 건지 기록이 없는 건지 구분이 안 됩니다.

그래서 이렇게 정했습니다. 값이 안 바뀌어도 15분이 지나면 한 점 찍는다. 안 움직였다는 것도 기록입니다.

그런데 이 차이가 화면에 그대로 드러납니다. 같은 '1주' 단추를 눌러도 두 지표가 보여주는 양이 다릅니다.

코스피는 6일치가 꽉 차 있습니다. 받아오는 곳이 과거까지 주니까 처음 돌린 날부터 1주 탭이 채워져 있어요.

달러·원은 한 시간 반뿐입니다. 우리가 찍기 시작한 만큼만 있으니까요. 이 그래프는 시간이 지나야 채워집니다.

받아온 데이터와 쌓은 데이터의 차이가 이겁니다. 받아온 건 처음부터 과거가 있고, 쌓은 건 시작한 날부터가 전부예요. 같은 화면에 나란히 놓여 있어서 똑같아 보이는데, 하나는 남이 준 역사고 하나는 우리가 만든 기록입니다.

한 축에 겹치면 읽는 사람을 속입니다

세 번째는 그리는 방식이었습니다.

처음엔 다섯 개를 한 그래프에 겹쳐 그리려고 했어요. 그게 보기 좋잖아요. 그런데 값을 나란히 놓고 보니 안 되는 일이었습니다.

자리 수가 제각각입니다. 코스닥이 644 인데 하이닉스가 132만이에요. 한 축에 얹으면 하이닉스만 보이고 나머지는 바닥에 눌려서 선이 안 보입니다.

그럼 축을 둘로 쪼개면 되지 않냐고 할 수 있는데, 이건 더 안 좋습니다. 왼쪽 축과 오른쪽 축이 따로 있으면, 화면의 같은 높이가 서로 다른 값을 뜻하게 됩니다. 두 선이 만나는 점이 아무 의미가 없어요. 그런데 보는 사람 눈에는 만나는 것처럼 보입니다.

그건 읽는 사람을 속이는 짓이라고 판단했습니다.

그래서 겹치지 않기로 했어요. 지표마다 자기 축을 가진 그래프 하나씩. 화면은 좀 길어졌는데, 대신 어떤 선도 다른 선 때문에 눌리지 않습니다.

여기까지 정하고 나니 소수점도 따라 정해졌습니다. 지수와 환율은 둘째 자리까지, 종목은 원 단위로. 코스피를 5,594.32 라고 말하는 건 자연스럽고 삼성전자를 87,000.00 원이라고 말하는 건 이상하잖아요. 몇 자리까지 말하느냐가 그 값이 무엇인지를 드러냅니다.

색으로만 말하지 않기로 했습니다

오르면 빨강, 내리면 파랑으로 했습니다. 한국 증시 관행이요.

그런데 색만으로 말하지 않기로 했습니다. 색을 구분하기 어려운 분들이 있고, 화면이 어두운 곳에서는 저도 헷갈립니다.

그래서 같은 것을 세 번 말합니다. 색, 화살표, 숫자. 그리고 그래프 아래에 숫자 표를 따로 뒀습니다. 그래프를 못 읽는 상황이면 표를 보면 되게요.

이건 만들면서 나온 판단이 아니라 처음부터 정해둔 것이었는데, 넣고 보니 저부터 표를 더 자주 봤습니다. 정확한 숫자가 궁금할 때는 그래프보다 표가 빠르더라고요.

단추 두 개가 같은 그림을 그렸습니다

기간 고르는 단추를 만들면서도 하나 배웠습니다.

처음에 넣은 게 이랬어요. 1일 · 5일 · 1주 · 1달 · 6달 · 1년 · 3년 · 10년.

만들어놓고 눌러봤습니다. '5일'과 '1주'가 같은 그림이었습니다.

당연한 거였어요. 장은 평일에만 열리니까 1주는 거래일로 5일입니다. 달력의 1주와 장이 열리는 1주가 다른데, 저는 그걸 두 개의 단추로 만들어놨던 거죠. 하나로 합쳤습니다.

'1일' 도 뺐습니다. 일별 종가로 하루를 그리면 점이 하나라서 선이 안 그려져요. 하루를 보려면 분 단위 데이터가 필요한데 그건 별도라, 대신 '장중' 단추를 따로 뒀습니다.

그래서 지금은 이렇게 남았습니다. 장중 · 1주 · 1달 · 6달 · 1년 · 3년 · 10년. 처음 여덟 개에서 일곱 개가 됐는데, 겹치는 게 없어졌습니다.

이런 건 설계할 때 안 보입니다. 만들어서 눌러봐야 보여요. 머리로는 1일·5일·1주가 다른 기간인데, 화면에서는 두 개가 같은 그림입니다.

하마터면 며칠 기다려야 하는 물건이 될 뻔했습니다

마지막으로 아까운 이야기 하나요.

분 단위 데이터를 받아오는데, 처음 불러봤을 때 당일치만 왔습니다. 그래서 이렇게 판단했어요. "이건 당일치만 주는구나. 그럼 1주치를 채우려면 5일을 기다려야겠네."

그래서 그렇게 만들려고 했습니다. 매일 조금씩 쌓아서 5일 뒤에 1주 탭이 채워지는 걸로요.

그게 아니었습니다. 요청할 때 시작 시각을 붙이면 과거까지 줍니다. 붙여서 다시 불러봤더니 6거래일치 2,358건이 한 번에 왔어요.

그러니까 저는 "당일치만 온다" 는 걸 확인한 게 아니라, 아무것도 안 붙이고 불러봤을 때 당일치가 왔다는 걸 본 거였습니다. 그걸 성질이라고 단정했어요.

이걸 안 잡았으면 어떻게 됐을까요. 만들어놓고 5일을 기다려야 제대로 보이는 물건이 됐을 겁니다. 그리고 저는 그게 원래 그런 거라고 생각하고 있었겠죠.

숫자는 받아왔는데, 정할 건 다 남아 있었습니다

시작할 때 이건 쉬운 일이라고 생각했습니다. 숫자를 가져다 그리는 일이잖아요. 제가 계산하는 것도 아니고, 남이 만든 값을 그대로 보여주는 것뿐입니다.

그런데 만들면서 정한 것들을 세어보니 이렇습니다.

• 등락률의 기준을 어디에 둘지
• 값이 언제 살아 있는지 (환율은 24시간, 지수는 장 시간)
• 없는 데이터를 만들지 말지, 만들면 얼마나 자주 찍을지
• 안 움직인 것을 기록으로 남길지
• 한 축에 겹칠지 나눌지
• 몇 자리까지 말할지
• 어떤 기간을 보여줄지, 겹치는 단추를 어떻게 할지

숫자는 받아왔는데, 그 숫자를 무엇으로 보이게 할지는 전부 사람이 정했습니다.

그리고 이 중에 틀리면 화면이 거짓을 말하게 되는 게 둘 있었어요. 기준선을 잘못 잡아서 0.00% 를 보여준 것, 축을 겹쳐서 만나지 않는 두 선을 만나게 보이는 것이요. 앞은 실제로 그렇게 만들었다가 고쳤고, 뒤는 만들려다 멈췄습니다.

받아온 숫자는 정확했습니다. 틀릴 수 있는 건 그걸 보여주는 방식이었어요. 그리고 그 방식은 데이터가 정해주지 않습니다.

시장 지표는 victor-house.com/market에서 보실 수 있습니다. 다섯 지표 다 자기 축을 가지고 있고, 장중은 1분 간격으로 갱신됩니다.

다음 편부터는 폰에서 이 도구들에게 말을 걸어본 이야기입니다. 집 밖에서 "오늘 지수 어때" 를 물어보려다가, 제가 걸어둔 자물쇠가 안 잠겨 있다는 걸 알게 됩니다.

#코스피 #코스닥 #환율 #달러원 #삼성전자 #SK하이닉스 #주식 #지수 #증시 #차트 #데이터시각화 #그래프 #시각화 #데이터수집 #크롤링 #네이버금융 #파이썬 #자바스크립트 #SVG #정적사이트 #개인프로젝트 #사이드프로젝트 #도구만들기 #AI개발 #클로드 #바이브코딩 #비개발자개발 #비개발자 #휴먼인더루프 #빅터하우스