Web Components 차트 추세선

    Ignite UI for Web Components 차트에서는 추세선이 추세를 식별하거나 데이터에서 패턴을 찾는 데 도움을 줍니다. 추세선은 항상 차트에 바인딩된 데이터 포인트 앞에 렌더링되며, (스택 시리즈, 쉐이프 시리즈, 범위 시리즈를 제외하고)IgcCategoryChartComponent​IgcFinancialChartComponent에 의해IgcDataChartComponent 지지됩니다.

    추세선은 기본적으로 꺼져 있지만, 속성을 설정trendLineType 하면 활성화할 수 있습니다. 또한, 붓질, 주기, 두께 등 추세선의 여러 외관 속성을 수정할 수 있습니다.

    추세선은 활성화되면 대시 배열을 적용할 수 있는 기능도 있습니다. 이 과정은 속성을 숫자 배열로 설정TrendLineDashArray 함으로써 이루어집니다. 숫자 배열은 추세선의 대시의 길이를 설명합니다.

    Web Components Chart Trendlines Example

    다음 샘플은IgcFinancialChartComponent 2013년부터 2017년까지 마이크로소프트의 주가 추세를 보여주며, 처음에는 QuinticFit 추세선이 적용되었습니다. 적용되는 추세선 유형을 변경할 수 있는 드롭다운이 있으며, 그 드롭다운 안에 가능한 모든 추세선 유형이 나열되어 있습니다.

    Web Components Chart Trendlines Dash Array Example

    다음 샘플은IgcDataChartComponent​IgcFinancialPriceSeriesComponent 쿼 틱핏 점선 추세선이 적용된 속성을 통해trendLineDashArray 나타내는 것을 나타냅니다:

    Web Components Chart Trendline Layer

    이IgcTrendLineLayerComponent 유형은 대상 시리즈에 대해 단일 추세선 유형을 표시하도록 설계된 유형입니다. 기존 시리즈 유형에 있는 추세선 특징과 다른 점은, 시리즈IgcTrendLineLayerComponent 유형이기 때문에 차트 컬렉션에IgcSeriesComponent 여러 개의 추세선을 추가할 수 있다는 점입니다. 또한 추세선이 전설에 나타나도록 할 수도 있는데, 이전에는 불가능했습니다.

    Trendline Layer Usage

    이 장치는IgcTrendLineLayerComponent 제대로 작동하려면 atargetSeries와 atrendLineType가 반드시 제공되어야 합니다. 제공되는 다양한 추세선 유형은 시리즈에서 제공하는 추세선과 동일합니다.

    전설에서 보여주IgcTrendLineLayerComponent 고 싶다면, 속성을 다음UseLegend으로 설정true 하면 됩니다.

    Styling the Trendline Layer

    기본적으로 렌더링은IgcTrendLineLayerComponent 점선으로 표시된 색상targetSeries으로 표시됩니다. 이는 다양한 스타일링 속성을IgcTrendLineLayerComponent 사용하여 구성할 수 있습니다.

    그려진 추세선의 색상을 변경하려면 다음과 같이 설정할 수 있습니다.Brush 재산. 또는UseIndex property를true, 이 문서는 차트의brushes 지수에 기반한 팔레트가IgcTrendLineLayerComponent는 차트의IgcSeriesComponent 수집.

    또한 그 방식을 수정할 수도 있습니다IgcTrendLineLayerComponent를 사용하여 나타납니다.AppearanceMode 그리고ShiftAmount 부동산. 그ShiftAmount-1.0에서 1.0 사이의 값을 취하여 "Shift"로 끝나는 옵션에 적용할 "시프트"의 정도를 결정합니다.

    다음은 해당AppearanceMode 부동산에 대한 옵션입니다:

    • Auto: 이 경우 기본적으로 대시 패턴 열거가 적용됩니다.
    • BrightnessShift: 추세선은 브러시를targetSeries 이용해 제공된ShiftAmount 밝기를 수정합니다.
    • DashPattern: 추세선은 점선으로 나타납니다. 대시의 빈도는 다음을 사용하여 변경할 수 있습니다.DashArray 재산에 관한IgcTrendLineLayerComponent.
    • OpacityShift: 추세선은 브러시를targetSeries 받아 제공된ShiftAmount 불투명도를 수정합니다.
    • SaturationShift: 추세선은 브러시를targetSeries 받아 제공된ShiftAmount 값에 따라 채도를 수정합니다.

    Additional Resources

    다음 항목에서 관련 차트 기능에 대한 자세한 내용을 확인할 수 있습니다.

    API References

    와IgcCategoryChartComponent 컴포넌트는IgcFinancialChartComponent 다음과 같은 API 속성을 공유합니다:

    컴포넌트IgcDataChartComponent 내에서 대부분의 시리즈 유형은 다음과 같은 API 속성을 가집니다: