React 차트 오버레이

    The React IgrDataChart allows for placement of horizontal or vertical lines at a single numeric value that you define through usage of the IgrValueOverlay. This can help you to visualize data such as the mean or median of a particular series.

    React Value Overlay Example

    다음 예에서는 몇 개의 수평 값 오버레이가 표시된 기둥 차트 보여줍니다.

    React Value Overlay Properties

    데이터 바인딩에 aItemsSource를 사용하는 다른 시리즈 유형과 달리, 값 오버레이는 단일 숫자 값을 바인딩하는 속성을 사용합니다ValueMemberPath. 또한, 가치 오버레이는 사용할 단일axis 항목을 정의해야 합니다. X축을 사용하면 값 오버레이가 수직선이고, Y축을 사용하면 수평선이 됩니다.

    숫자 X 또는 Y축을 사용할 때, 속성은ValueMemberPath 값 오버레이를 그리려는 축의 실제 숫자 값을 반영해야 합니다. X 또는 Y 축을 사용할 때, 값ValueMemberPath 오버레이가 나타나길 원하는 카테고리의 인덱스를 반영해야 합니다.

    숫자 각도 축과 함께 값 오버레이를 사용하면 차트 중앙에서 선으로 나타나고 숫자 반경 축을 사용하면 원으로 나타납니다.

    IgrValueOverlay외관 속성은 SIgrSeries​brush and s. 에서 상속되며thickness, 예를 들어 다른 유형의 급수와 동일한 방식으로 작동한다.

    또한 aIgrValueOverlay에 축 주석을 표시하여 소유 축에 겹침의 값을 표시하는 것도 가능합니다. 이를 보여주기 위해 속성을 true로 설정할isAxisAnnotationEnabled 수 있습니다.

    React Value Layer

    React 차팅 구성 요소는 최소값, 최대값, 평균값 등 데이터의 다양한 초점을 표시하기 위해 값 선을 사용하는 기능도 제공합니다.

    그리고IgrValueLayer 컴포넌트에IgrCategoryChart 적용하려면IgrFinancialChart 차트에 속성을 설정valueLines 함으로써 이루어집니다. 이 성질은 열거 집합을ValueLayerValueMode 가져옵니다. 같은 차트 내에서 여러ValueLayerValueMode 열거valueLines 항목을 추가하여 여러 가치 층을 혼합할 수 있습니다.

    안에IgrDataChart, 이는 다음을 추가하여 수행됩니다.IgrValueLayer 그IgrSeries 차트를 수집한 후 다음ValueMode 재산을ValueLayerValueMode 열거형. 이 각 열거와 그 의미는 아래에 나열되어 있습니다:

    • Auto: 열거의ValueLayerValueMode 기본 값 모드입니다.
    • Average: 차트에 표시된 각 수열의 평균 값을 나타내기 위해 여러 값 선을 적용합니다.
    • GlobalAverage: 차트 내 모든 시리즈 값의 평균을 표시하기 위해 단일 값 라인을 적용합니다.
    • GlobalMaximum: 차트 내 모든 시리즈 값의 절대 최대값을 표시하기 위해 단일 값 선을 적용합니다.
    • GlobalMinimum: 차트 내 모든 시리즈 값의 절대 최소값을 표시하기 위해 단일 값 라인을 적용합니다.
    • Maximum: 차트에 표시된 각 계열의 최대 값을 표시하기 위해 잠재적으로 여러 값 라인을 적용합니다.
    • Minimum: 차트에 표시된 각 계열의 최소 값을 나타내기 위해 여러 값 선을 적용합니다.

    특정 속성이 요소 사용IgrValueLayer 시 고려되지 않도록 하고 싶다면, 레이어에 속성을 설정할targetSeries 수 있습니다. 이렇게 하면 레이어가 당신이 정의한 급수를 타겟팅하도록 강제합니다. 한 번IgrValueLayer에 원하는 만큼 많은IgrDataChart 요소를 넣을 수 있습니다.

    다음 예시는 다음과 같은valueLines 차이IgrCategoryChart의 사용법을 보여줍니다:

    React Financial Overlays

    React Stock Chart에서 내장된 재무 오버레이와 지표를 표시할 수도 있습니다.

    Chart Overlay Text

    The React IgrValueOverlay, IgrValueLayer, and all Data Annotation Layers can render custom overlay text inside plot area of the XamDataChart component. You can use this overlay text to annotate important events (e.g. company quarter reports) on x-axis or important values on y-axis in relationship to the layers.

    예를 들어,IgrDataAnnotationSliceLayer와IgrValueOverlay를 사용IgrValueLayer 해 오버레이 텍스트를 표시할 수 있습니다.

    Styling Overlay Text

    이 코드 예시는 오버레이 텍스트IgrDataAnnotationSliceLayer​IgrValueOverlay​IgrValueLayer를 어떻게 스타일링하고 커스터마이즈하는지 보여줍니다.

    Additional Resources

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

    API References

    다음은 위 섹션에서 언급된 API 멤버 목록입니다.