React Chart Highlighting Example

    다음 예는 React 차트에서 사용할 수 있는 다양한 강조 표시 옵션을 보여줍니다.

    React 차트 강조 모드 및 동작

    모든 React 차트는 다양한 하이라이트 옵션을 지원합니다.highlightingMode 마우스가 플롯 영역에 렌더링된 시리즈/데이터 항목 위에 마우스를 올릴 때 밝게 하거나 희미하게 설정할 수 있습니다.highlightingBehavior 하이라이트 효과를 트리거하기 위해 데이터 항목 바로 위나 가장 가까운 데이터 항목으로 설정할 수 있습니다. 하이라이징 모드와 동작은 theIgrCategoryChart,, controlsIgrFinancialChart에서 지원되며,IgrDataChart 하이라이팅 기능을 사용할 수 있는 동일한 API를 가지고 있습니다.

    다음 예시는 React 차트를highlightingMode 보여줍니다.

    다음 예시는 React 차트를highlightingBehavior 보여줍니다.

    React 차트 범례 강조

    모든 React 차트는 범례 강조 기능을 지원합니다.legendHighlightingMode 마우스가 범례 표시 항목 위에 마우스를 올릴 때 렌더링된 시리즈가 플롯 영역에서 하이라이트되도록 활성화할 수 있습니다. 범례 강조는 theIgrCategoryChart,, controlsIgrFinancialChart에서 지원되며,IgrDataChart 강조 기능을 사용하는 API도 동일합니다.

    다음 예는 React 차트를 강조하는 범례 시리즈를 보여줍니다.

    Highlight Layers

    Ignite UI for ReactIgrCategoryChart은 데이터 항목 위에 마우스를 올렸을 때 세 가지 유형의 하이라이트를 활성화할 수 있습니다.

    1. 연속 강조는 포인터가 그 위에 위치했을 때 마커나 열로 나타내는 단일 데이터 포인트를 강조합니다. 이 기능은 속성을 true로 설정isSeriesHighlightingEnabled 함으로써 가능합니다.

    2. 항목 하이라이트는 해당 항목의 위치에 띠 모양을 그리거나 마커를 표시하여 시리즈에서 강조합니다. 이 기능은 속성을 true로 설정isItemHighlightingEnabled 함으로써 가능합니다.

    3. 카테고리 하이라이트는 차트 내 모든 카테고리 축을 대상으로 합니다. 그들은 포인터 위치에 가장 가까운 축 영역을 비추는 도형을 그립니다. 이 기능은 속성을 true로 설정isCategoryHighlightingEnabled 함으로써 가능합니다.

    다음 예제는 React 차트에서 사용할 수 있는 다양한 강조 표시 레이어를 보여줍니다.

    Additional Resources

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

    API References

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