> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coreweave.com/llms.txt
> Use this file to discover all available pages before exploring further.

> 선형 플롯에서 스무딩을 사용하여 노이즈가 있는 데이터의 추세를 확인하세요.

# 선형 플롯 스무딩

스무딩은 포인트 간 변동을 줄여 노이즈가 있는 선형 플롯에서 추세를 파악하는 데 도움이 되며, 기본 신호를 더 쉽게 읽을 수 있게 만듭니다. 이 페이지에서는 W\&B가 지원하는 스무딩 알고리즘, 각 알고리즘이 가장 유용한 경우, 원본 데이터의 가시성을 제어하는 방법을 설명합니다.

W\&B는 다음과 같은 여러 유형의 스무딩을 지원합니다:

* [시간 가중 지수 이동 평균(TWEMA) 스무딩](#time-weighted-exponential-moving-average-twema-smoothing-default)
* [가우시안 스무딩](#gaussian-smoothing)
* [러닝 평균](#running-average-smoothing)
* [지수 이동 평균(EMA) 스무딩](#exponential-moving-average-ema-smoothing)

이러한 알고리즘을 실제 데이터에 적용한 예를 보려면 이 [대화형 W\&B 리포트](https://forge.coreweave.com/wandb/carey/smoothing-example/reports/W-B-Smoothing-Features--Vmlldzo1MzY3OTc)를 참조하세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/beamer_smoothing.gif?s=0c0a67acf2076eb2c7ba94054ad51c77" alt="노이즈가 있는 선형 플롯에 적용된 다양한 스무딩 알고리즘 비교" width="1930" height="844" data-path="products/wandb/_media/beamer_smoothing.gif" />
</Frame>

<h2 id="time-weighted-exponential-moving-average-twema-smoothing-default">
  시간 가중 지수 이동 평균(TWEMA) 스무딩(기본값)
</h2>

시간 가중 지수 이동 평균(TWEMA) 스무딩 알고리즘은 이전 points의 가중치를 지수적으로 감쇠시켜 시계열 데이터를 스무딩하는 기법입니다. 이 기법에 대한 자세한 내용은 [지수 스무딩](https://www.wikiwand.com/en/Exponential_smoothing)을 참조하세요. 범위는 0에서 1입니다. 시계열의 초기 값이 0으로 편향되지 않도록 편향 제거 항이 추가됩니다.

TWEMA 알고리즘은 선 위 points의 밀도(x축 범위 단위당 `y` 값의 수)를 고려합니다. 이를 통해 특성이 다른 여러 선을 동시에 표시할 때 일관된 스무딩이 가능합니다.

다음 샘플 코드는 내부에서 이 알고리즘이 어떻게 작동하는지 보여줍니다:

```javascript theme={"system"}
const smoothingWeight = Math.min(Math.sqrt(smoothingParam || 0), 0.999);
let lastY = yValues.length > 0 ? 0 : NaN;
let debiasWeight = 0;

return yValues.map((yPoint, index) => {
  const prevX = index > 0 ? index - 1 : 0;
  // VIEWPORT_SCALE는 결과를 차트의 x축 범위로 조정합니다
  const changeInX =
    ((xValues[index] - xValues[prevX]) / rangeOfX) * VIEWPORT_SCALE;
  const smoothingWeightAdj = Math.pow(smoothingWeight, changeInX);

  lastY = lastY * smoothingWeightAdj + yPoint;
  debiasWeight = debiasWeight * smoothingWeightAdj + 1;
  return lastY / debiasWeight;
});
```

이 알고리즘을 live data에 적용한 것을 보려면 [TWEMA section of the 대화형 W\&B 리포트](https://forge.coreweave.com/wandb/carey/smoothing-example/reports/W-B-Smoothing-Features--Vmlldzo1MzY3OTc)를 참조하세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/weighted_exponential_moving_average.png?fit=max&auto=format&n=3Dv_sw2eg8feUJlx&q=85&s=619895ce72f79cd2e82d65d07e56d070" alt="TWEMA smoothing이 적용된 선형 플롯" width="2162" height="738" data-path="products/wandb/_media/weighted_exponential_moving_average.png" />
</Frame>

<h2 id="gaussian-smoothing">
  가우시안 스무딩
</h2>

가우시안 스무딩(또는 가우시안 커널 스무딩)은 point의 가중 평균을 계산하며, 가중치는 스무딩 매개변수로 지정된 표준 편차를 가진 가우시안 분포에 해당합니다. W\&B는 모든 입력 `x` 값에 대해, 그 앞과 뒤에 있는 point를 기반으로 스무딩된 값을 계산합니다.

live data에 이 알고리즘이 적용된 예를 보려면 [대화형 W\&B 리포트의 가우시안 스무딩 section](https://forge.coreweave.com/wandb/carey/smoothing-example/reports/W-B-Smoothing-Features--Vmlldzo1MzY3OTc#3.-gaussian-smoothing)을 참조하세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/gaussian_smoothing.png?fit=max&auto=format&n=3Dv_sw2eg8feUJlx&q=85&s=498fcc33fee913c36b7ea114ae65aea8" alt="가우시안 스무딩이 적용된 선형 플롯" width="1642" height="674" data-path="products/wandb/_media/gaussian_smoothing.png" />
</Frame>

<h2 id="running-average-smoothing">
  러닝 평균 스무딩
</h2>

러닝 평균은 `x` 값 전후의 윈도우 내 points 평균으로 point를 대체하는 스무딩 알고리즘입니다. ["Boxcar Filter" on Wikipedia](https://en.wikipedia.org/wiki/Moving_average)를 참조하세요. 러닝 평균에 대해 선택된 매개변수는 moving average에서 고려할 points 수를 지정합니다.

points가 x축에서 고르지 않게 배치된 경우, point 밀도가 달라질 때 고정 너비 윈도우가 오해의 소지가 있는 평균을 생성할 수 있으므로 가우시안 스무딩을 대신 사용하세요.

이 알고리즘이 live data에 적용된 것을 보려면 [대화형 W\&B 리포트의 러닝 평균 section](https://forge.coreweave.com/wandb/carey/smoothing-example/reports/W-B-Smoothing-Features--Vmlldzo1MzY3OTc#4.-running-average)을 참조하세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/running_average.png?fit=max&auto=format&n=3Dv_sw2eg8feUJlx&q=85&s=6be341789594951ced3f07a0cec24250" alt="Running average smoothing이 적용된 선형 플롯" width="1630" height="666" data-path="products/wandb/_media/running_average.png" />
</Frame>

<h2 id="exponential-moving-average-ema-smoothing">
  지수 이동 평균(EMA) 스무딩
</h2>

지수 이동 평균(EMA) 스무딩 알고리즘은 지수 윈도우 함수를 사용하여 시계열 데이터를 스무딩하는 휴리스틱 기법입니다. 이 기법에 대한 자세한 내용은 [지수 스무딩](https://www.wikiwand.com/en/Exponential_smoothing)을 참조하세요. 범위는 0에서 1입니다. 편향 제거 항이 추가되어 시계열의 초기 값이 0으로 편향되지 않도록 합니다.

대부분의 경우 EMA 스무딩은 먼저 버킷팅을 수행한 후 스무딩하는 대신 전체 이력 스캔에 적용됩니다. 이는 일반적으로 더 정확한 스무딩을 생성합니다.

다음 상황에서는 대신 버킷팅 후에 EMA 스무딩이 적용됩니다:

* 샘플링
* 그룹화
* 표현식
* 단조롭지 않은 x축
* 시간 기반 x축

다음 샘플 코드는 내부에서 어떻게 작동하는지 보여줍니다:

```javascript theme={"system"}
  data.forEach(d => {
    const nextVal = d;
    last = last * smoothingWeight + (1 - smoothingWeight) * nextVal;
    numAccum++;
    debiasWeight = 1.0 - Math.pow(smoothingWeight, numAccum);
    smoothedData.push(last / debiasWeight);
```

실시간 데이터에 이 알고리즘을 적용한 예를 보려면 [대화형 W\&B 리포트의 EMA 섹션](https://forge.coreweave.com/wandb/carey/smoothing-example/reports/W-B-Smoothing-Features--Vmlldzo1MzY3OTc)을 참조하세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/exponential_moving_average.png?fit=max&auto=format&n=3Dv_sw2eg8feUJlx&q=85&s=092093ccb7d8f733e13c93f857c8ed62" alt="EMA smoothing이 적용된 선형 플롯" width="1724" height="722" data-path="products/wandb/_media/exponential_moving_average.png" />
</Frame>

<h2 id="hide-original-data">
  원본 데이터 숨기기
</h2>

스무딩된 선을 원시 데이터와 비교하여 스무딩이 시그널을 얼마나 공격적으로 변경하는지 판단하세요. 기본적으로 원본 스무딩되지 않은 데이터가 플롯 배경에 희미한 선으로 표시됩니다. **Show Original**을 클릭하여 이 기능을 끄세요.

<Frame>
  <img src="https://mintcdn.com/coreweave-dbfa0e8d/3Dv_sw2eg8feUJlx/products/wandb/_media/demo_wandb_smoothing_turn_on_and_off_original_data.gif?s=902182b8fa68972ea048e6e817f1d92a" alt="선형 플롯에서 원본 스무딩되지 않은 데이터 표시 전환" width="2272" height="1040" data-path="products/wandb/_media/demo_wandb_smoothing_turn_on_and_off_original_data.gif" />
</Frame>
