Ignite UI for Angular 변경 내역
각 버전의 Ignite UI for Angular에 대한 모든 주목할 만한 변경 사항은 이 페이지에 설명되어 있습니다.
This topic discusses changes only for components that are not included in the igniteui-angular package. For changes specific to igniteui-angular components, please see CHANGELOG.MD.
19.1.0
igniteui-angular-charts (Charts)
-
- 데이터 주석 밴드 레이어(베타)
- 데이터 주석 라인 레이어(베타)
- 데이터 주석 사각형 계층(베타)
- 데이터 주석 슬라이스 레이어(베타)
- 데이터 주석 스트립 레이어(베타)
데이터 도구 설명 및 데이터 범례는 도구 설명 또는 범례의 내용을 테이블 또는 세로 레이아웃 구조로 레이아웃하는 데 사용할 수 있는 새
LayoutMode
속성을 노출합니다.
defaultInteraction
차트의 속성이 새로운 열거형을 포함하도록 업데이트되었으며,DragSelect
여기서 드래그된 미리보기 Rect는 그 안에 포함된 점을 선택합니다. (베타)위에 나열된 새로운 차트 데이터 주석 외에도 ValueOverlay 및 ValueLayer는 이제 그림 영역에서 추가 주석 텍스트를 오버레이하는 데 사용할 수 있는 속성을 노출
OverlayText
합니다. 이러한 주석의 모양은 많은 OverlayText 접두사 속성을 사용하여 구성할 수 있습니다. 예를 들어, 속성은OverlayTextBrush
오버레이 텍스트의 색상을 구성합니다. (베타)새로운 추세선 레이어 계열 유형: 추세선 레이어당 단일 추세선을 특정 계열에 적용할 수 있습니다. 이렇게 하면 차트에 여러 TrendlineLayer 계열 유형이 있을 수 있으므로 단일 계열에서 여러 추세선을 사용할 수 있습니다.
igniteui-angular-dashboards (Dashboards)
-
DashboardTile
이제 DataGrid 보기에서 정렬, 그룹화, 필터링 및 선택과 같은 차트 시각화로 집계를 전파할 수 있습니다. 이것은 현재 ofDataSource
theDashboardTile
를 instance ofLocalDataSource
에 바인딩하여 지원됩니다 .
igniteui-angular
주요 변경 내용
- 'igniteui-angular-grids' 패키지의 이름이 'igniteui-angular-data-grids'로 변경되었습니다.
Enhancements
툴바
- 이제 도구 모음에서 추가된 값 레이어가 범례에 나타납니다.
- 확대/축소 재설정 도구가 확대/축소 드롭다운으로 이동되었습니다.
데이터 파이 차트
- 이제 차트에서 메서드를 노출합니다
GetOthersContext()
. 그러면 "others" 슬라이스의 내용이 반환됩니다.
Bug Fixes
버그 번호 | 제어 | 설명 |
---|---|---|
37023 | IgxDataChart | 툴팁은 overflow hidden이 설정된 경우 잘리거나 화면에서 벗겨집니다. |
37244 | 뛰어나다 | 사용자 지정 데이터 유효성 검사가 작동하지 않습니다. |
37685 | Igx스프레드시트 | Arial 글꼴로 서식이 지정된 숫자의 렌더링 불량. |
19.0.1 (February 2025)
Enhancements
툴바
- 새로 추가됨
GroupHeaderTextStyle
속성을IgxToolbarComponent
그리고IgxToolPanelComponent
. 설정하면 모든 항목에 적용됩니다.IgxToolActionGroupHeaderComponent
작업. - 제목 텍스트의 수평 정렬을 제어하는 called
titleHorizontalAlignment
에IgxToolActionComponent
새로운 속성을 추가했습니다. - 에 새 속성을 추가했습니다.
IgxToolActionSubPanelComponent
호출ItemSpacing
패널 내부의 항목 사이의 간격을 제어합니다.
Bug Fixes
다음 표에는 이 릴리스의 Ignite UI for Angular 도구 집합에 대한 버그 수정이 나열되어 있습니다.
버그 번호 | 제어 | 설명 |
---|---|---|
26218 | 엑셀 라이브러리 | 차트의 플롯 영역 오른쪽 여백이 좁아지고 채우기 패턴과 채우기 전경이 Excel 파일을로드하는 것만으로 사라집니다. |
30286 | IgxDataChart | 거품 시리즈 도구 설명 내용이 거품을 클릭하면 근처의 거품 데이터 내용으로 전환됩니다. |
32906 | IgxDataChart | IgxDataChart는 상단에 두 개의 xAxis를 표시합니다. |
33605 | IgxDataChart | ScatterLineSeries가 범례에서 선의 색을 올바르게 표시하지 않습니다. |
34053 | IgxRadial게이지 | 축척 레이블의 위치가 이동됩니다. |
34083 | 엑셀 라이브러리 | TextOperatorConditionalFormat's가 제대로 로드/저장되지 않음: 텍스트에 템플릿에 =가 포함되어 있으면 |
34776 | IgxDataChart | IgxDataChart를 반복적으로 표시하거나 숨기면 JS 힙에서 메모리 누수가 발생합니다. |
35495 | 엑셀 라이브러리 | 템플릿 파일이 로드될 때 셀의 그림이 손실됩니다. |
35496 | Igx스프레드시트 | Excel에서 이미지를 사용하여 스타일을 설정할 때 오류 발생 |
35498 | IgxDataChart | IncludedSeries에 지정된 계열에 대한 도구 설명이 표시되지 않습니다. |
36176 | 엑셀 라이브러리 | LET 함수가 있는 Excel 통합 문서를 로드할 때 예외가 발생합니다. |
36379 | 엑셀 라이브러리 | Excel 통합 문서에서 알파 채널이 있는 색상이 로드되지 않음 |
19.0.0 (January 2025)
- Angular 19 지원.
18.2.0 (December 2024)
igniteui-angular-charts (Charts)
DashboardTile(베타)
- 새 대시보드 타일 구성 요소는 바인딩된 ItemsSource 컬렉션 또는 단일 요소를 분석 및 시각화하고 데이터의 스키마 및 개수에 따라 적절한 데이터 시각화를 반환하는 컨테이너 컨트롤입니다. 이 컨트롤은 기본 제공 Toolbar 구성 요소를 활용하여 런타임에 시각화를 변경할 수 있도록 하므로 최소한의 코드로 데이터의 다양한 시각화를 볼 수 있습니다.
igniteui-angular-charts (Inputs)
- 새로운 ColorEditor (베타) & 툴바 툴액션 (베타)
이 새로운 색상 편집기는 독립형 색상 선택기로 사용할 수 있으며 이제 런타임 시 시각화를 업데이트하기 위해 도구 모음 구성 요소에 통합되었습니다.
18.1.0 (September 2024)
Data 파이 차트-
IgxDataPieChartComponent
원형 차트를 렌더링하는 새로운 구성 요소입니다. 이 구성 요소는 기본 데이터 모델의 속성을 자동으로 감지하는 동시에 ItemLegend 구성 요소를 통해 선택, 강조 표시, 애니메이션 및 범례 지원을 허용한다는 점에서 유사IgxCategoryChartComponent
하게 작동합니다.New Proportional Category Angle Axis- 원형 차트와 유사한 슬라이스를 그리기 위해 원형 그래프 내에서 데이터 포인트가 세그먼트로 표시되는 데이터 시각화 유형인 Radial Pie Series
IgxDataChartComponent
의 새 축입니다.-
New ToolActionCheckboxList: 선택할 수 있는 확인란이 있는 항목 컬렉션을 표시하는 새로운 CheckboxList: ToolAction입니다. ToolAction CheckboxList 내의 그리드는 높이가 최대 5개 항목까지 증가한 다음 스크롤 막대가 표시됩니다. IgxCheckboxListModule을 등록해야 합니다.
새로운 필터링 지원
축 필드 변경 사항: CategoryChart를 대상으로 할 때 도구 모음의 새로운 기본 IconMenu. 레이블 필드는 X축에 매핑되고 값 필드는 Y축에 매핑됩니다. 대상 차트는 변경 사항에 실시간으로 반응합니다. 차트에 ItemsSource가 설정되어 있지 않으면 IconMenu가 숨겨집니다.
18.0.0 (June 2024)
- Angular 18 지원.
igniteui-angular-charts (Charts)
- 데이터 범례 그룹화 및 데이터 툴팁 그룹화- 새로운 그룹화 기능이 추가되었습니다. 이 속성은
GroupRowVisible
각 시리즈로 그룹화를 전환하고 옵트인하면 속성을 통해 그룹 텍스트를 할당할 수 있습니다dataLegendGroup
. 동일한 값이 둘 이상의 시리즈에 적용되면 그룹화되어 표시됩니다. 모든 사용자에 대해 분류하고 구성해야 하는 대규모 데이터 세트에 유용합니다.
차트 선택- 새로운 시리즈 선택 스타일링. 이것은 모든 범주, 금융 및 방사형 시리즈
IgxCategoryChartComponent
에 걸쳐 광범위하게 채택됩니다IgxDataChartComponent
. 시리즈를 클릭하면 다른 색상, 밝아지거나 흐려지기, 초점 윤곽선이 표시될 수 있습니다. 개별 계열 또는 전체 데이터 항목을 통해 영향을 받는 항목을 관리합니다. 여러 시리즈 및 마커가 지원됩니다. partcular dataitem의 값 간의 다양한 차이점 또는 유사점을 설명하는 데 유용합니다. 또한SelectedSeriesItemsChanged
이벤트를 진행하고selectedSeriesItems
팝업 또는 기타 화면과 같이 응용 프로그램 내에서 발생할 수 있는 다른 작업을 포함하는 강력한 비즈니스 요구 사항을 구축하기 위한 추가 도움말을 제공하며, 선택을 기반으로 하는 데이터 분석을 수행할 수 있습니다.Treemap Highlighting- 이제 트리 맵에
highlightingMode
있는 항목의 마우스 오버 강조 표시를 구성할 수 있는 속성을 노출합니다. 이 속성은 두 가지 옵션을 사용합니다 :Brighten
강조 표시는 마우스를 올려 놓은 항목에만 적용되고FadeOthers
, 호버 된 항목의 강조 표시는 동일하게 유지되지만 다른 모든 항목은 페이드 아웃됩니다. 이 강조 표시는 애니메이션되며 속성을 사용하여highlightingTransitionDuration
제어할 수 있습니다.트리맵 퍼센트 기반 강조 표시 - 새로운 퍼센트 기반 하이라이트를 통해 노드가 컬렉션의 진행 상황 또는 하위 집합을 나타낼 수 있습니다. 모양은 데이터 항목의 멤버에 의해 또는 새
highlightedDataSource
멤버를 제공하여 특정 값까지 배경색의 채우기로 표시됩니다. 비아를 통해highlightedValuesDisplayMode
전환하고 스타일을 지정할FillBrushes
수 있습니다.IgxToolbarComponent
- 선택한 특정 도구 주위의 테두리를 윤곽선으로 표시하기 위한 ToolAction에 대한 새로운IsHighlighted
옵션.
igniteui-angular-gauges (Gauges)
IgxRadialGaugeComponent
- 강조 표시 바늘의 새 레이블입니다.
highlightLabelText
그리고highlightLabelSnapsToNeedlePivot
HighlightLabel에 대한 다른 많은 스타일 관련 속성이 추가되었습니다.
- 강조 표시 바늘의 새 레이블입니다.
18.0.0 (June 2024)
- Angular 18 지원.
igniteui-angular-charts (Charts)
- 데이터 범례 그룹화 및 데이터 툴팁 그룹화- 새로운 그룹화 기능이 추가되었습니다. 이 속성은
GroupRowVisible
각 시리즈로 그룹화를 전환하고 옵트인하면 속성을 통해 그룹 텍스트를 할당할 수 있습니다dataLegendGroup
. 동일한 값이 둘 이상의 시리즈에 적용되면 그룹화되어 표시됩니다. 모든 사용자에 대해 분류하고 구성해야 하는 대규모 데이터 세트에 유용합니다.
차트 선택- 새로운 시리즈 선택 스타일링. 이것은 모든 범주, 금융 및 방사형 시리즈
IgxCategoryChartComponent
에 걸쳐 광범위하게 채택됩니다IgxDataChartComponent
. 시리즈를 클릭하면 다른 색상, 밝아지거나 흐려지기, 초점 윤곽선이 표시될 수 있습니다. 개별 계열 또는 전체 데이터 항목을 통해 영향을 받는 항목을 관리합니다. 여러 시리즈 및 마커가 지원됩니다. partcular dataitem의 값 간의 다양한 차이점 또는 유사점을 설명하는 데 유용합니다. 또한SelectedSeriesItemsChanged
이벤트를 진행하고selectedSeriesItems
팝업 또는 기타 화면과 같이 응용 프로그램 내에서 발생할 수 있는 다른 작업을 포함하는 강력한 비즈니스 요구 사항을 구축하기 위한 추가 도움말을 제공하며, 선택을 기반으로 하는 데이터 분석을 수행할 수 있습니다.Treemap Highlighting- 이제 트리 맵에
highlightingMode
있는 항목의 마우스 오버 강조 표시를 구성할 수 있는 속성을 노출합니다. 이 속성은 두 가지 옵션을 사용합니다 :Brighten
강조 표시는 마우스를 올려 놓은 항목에만 적용되고FadeOthers
, 호버 된 항목의 강조 표시는 동일하게 유지되지만 다른 모든 항목은 페이드 아웃됩니다. 이 강조 표시는 애니메이션되며 속성을 사용하여highlightingTransitionDuration
제어할 수 있습니다.트리맵 퍼센트 기반 강조 표시 - 새로운 퍼센트 기반 하이라이트를 통해 노드가 컬렉션의 진행 상황 또는 하위 집합을 나타낼 수 있습니다. 모양은 데이터 항목의 멤버에 의해 또는 새
highlightedDataSource
멤버를 제공하여 특정 값까지 배경색의 채우기로 표시됩니다. 비아를 통해highlightedValuesDisplayMode
전환하고 스타일을 지정할FillBrushes
수 있습니다.IgxToolbarComponent
- 선택한 특정 도구 주위의 테두리를 윤곽선으로 표시하기 위한 ToolAction에 대한 새로운IsHighlighted
옵션.
igniteui-angular-gauges (Gauges)
IgxRadialGaugeComponent
- 강조 표시 바늘의 새 레이블입니다.
highlightLabelText
그리고highlightLabelSnapsToNeedlePivot
HighlightLabel에 대한 다른 많은 스타일 관련 속성이 추가되었습니다.
- 강조 표시 바늘의 새 레이블입니다.
17.3.0 (March 2024)
igniteui-angular-charts
속성을 통한 새 데이터 필터링.
initialFilter
필터 표현식을 적용하여 차트 데이터를 레코드의 하위 집합으로 필터링합니다. 대용량 데이터를 드릴다운하는 데 사용할 수 있습니다.XamRadialChart
- 새 레이블 모드
IgxCategoryAngleAxisComponent
for the now는labelMode
레이블의 위치를 추가로 구성할 수 있는 속성을 노출합니다. 이렇게 하면 열거형을 선택하여Center
기본 모드 사이를 전환하거나 새 모드를ClosestPoint
사용하여 레이블을 원형 플롯 영역에 더 가깝게 만들 수 있습니다.
- 새 레이블 모드
igniteui-angular-gauges
IgxRadialGaugeComponent
- 새로운 제목/자막 속성.
titleText
,subtitleText
게이지 아래쪽에 나타납니다. 또한 다음과 같은 다양한 제목/부제목 글꼴 속성이 추가되었습니다.TitleFontSize
,TitleFontFamily
,TitleFontStyle
,TitleFontWeight
그리고titleExtent
. 마지막으로, 새로운titleDisplaysValue
값이 바늘의 위치와 일치할 수 있습니다. - 에 대한 새로운
opticalScalingEnabled
속성opticalScalingSize
.IgxRadialGaugeComponent
이 새로운 기능은 게이지의 레이블, 제목 및 자막에 100% 광학 배율이 적용되는 크기를 관리합니다. 이 새로운 기능에 대한 자세한 내용은 여기에서 확인할 수 있습니다 - 새로운 하이라이트 바늘이 추가되었습니다.
highlightValue
highlightValueDisplayMode
둘 다 값과 '오버레이' 설정이 제공되면 주 바늘이 흐리게 보이고 새 바늘이 나타납니다.
- 새로운 제목/자막 속성.
IgxLinearGaugeComponent
- 새로운 하이라이트 바늘이 추가되었습니다.
highlightValue
highlightValueDisplayMode
둘 다 값과 '오버레이' 설정이 제공되면 주 바늘이 흐리게 보이고 새 바늘이 나타납니다.
- 새로운 하이라이트 바늘이 추가되었습니다.
IgxBulletGraphComponent
- 이제 성능 표시줄에 '오버레이' 설정에 적용될 때
highlightValueDisplayMode
값과 새highlightValue
값의 차이가 반영됩니다. 하이라이트 값에는 필터링된/하위 집합 완료된 측정 백분율이 채워진 색상으로 표시되고 나머지 막대의 모양은 할당된 값으로 흐리게 표시되어 실시간으로 성능을 보여줍니다.
- 이제 성능 표시줄에 '오버레이' 설정에 적용될 때
17.2.0 (January 2024)
igniteui-angular-charts (Charts)
- 차트 강조 표시 필터-
IgxCategoryChartComponent
이제 데이터IgxDataChartComponent
하위 집합 안팎으로 강조 표시하고 애니메이션하는 방법을 노출합니다. 이 강조 표시는 시리즈 유형에 따라 다릅니다. 열 및 영역 계열의 경우 하위 집합은 전체 데이터 집합 위에 표시되며 하위 집합은 계열의 실제 브러시로 색상이 지정되고 전체 집합의 불투명도가 감소합니다. 라인 시리즈의 경우 하위 집합이 점선으로 표시됩니다.
17.0.0 (November 2023)
igniteui-angular (Toolbar - Beta)
- 클립보드를 통해 차트를 이미지로 저장하는 저장 도구 작업이 추가되었습니다.
- 수직 방향은 도구 모음의
orientation
속성을 통해 추가되었습니다. 기본적으로 도구 모음은 수평이며, 이제 도구 모음을 수직 방향으로 표시할 수 있으며 여기서 도구는 왼쪽/오른쪽으로 정중하게 팝업됩니다. - 도구 모음의 방법을 통해 사용자 지정 SVG 아이콘 지원이 추가되어 사용자 지정 도구 생성이 더욱 향상되었습니다
renderImageFromText
.
16.1.0 (June 2023)
New Components
- 툴바- 베타. 이 구성 요소는 주로 차트 구성 요소와 함께 사용되는 UI 작업을 위한 컴패니언 컨테이너입니다. 도구 모음은
IgxDataChartComponent
또는IgxCategoryChartComponent
구성 요소에 연결될 때 속성 및 도구 항목의 사전 설정으로 동적으로 업데이트됩니다. 최종 사용자가 변경 사항을 제공할 수 있도록 프로젝트에 대한 사용자 정의 도구를 생성하여 끝없는 사용자 정의를 제공할 수 있습니다.
igniteui-angular-charts (Charts)
ValueLayer- 이제
IgxValueLayerComponent
라는 새로운 계열 유형이 노출되어 최대, 최소 및 평균과 같이 플롯된 데이터의 다양한 초점에 대한 오버레이를 렌더링할 수 있습니다. 이는 새valueLines
컬렉션에 추가하여IgxCategoryChartComponent
및IgxFinancialChartComponent
에 적용됩니다.이제 대시 배열 시리즈의 다른 부분으로
IgxDataChartComponent
. 이것을 다음에 적용할 수 있습니다. 시리즈 차트에 표시된 눈금선 차트의 추세선 차트에 표시된 시리즈의
16.0.0 (May 2023)
- Angular 16 지원.
15.0.0 (December 2022)
- Angular 15 지원.
14.2.0 (November 2022)
기본 동작에 대한 상당한 개선 사항이 추가되었으며 카테고리 차트 API를 더 쉽게 사용할 수 있도록 개선되었습니다. 이러한 새로운 차트 개선 사항은 다음과 같습니다.
- 브라우저/화면 크기에 따라 수평 라벨 회전을 위한 반응형 레이아웃.
- 모든 플랫폼에서 둥근 레이블에 대한 향상된 렌더링.
- StackedFragmentSeries에 마커 속성을 추가했습니다.
-
shouldPanOnMaximumZoom
속성을 추가했습니다. - 새 범주 축 속성:
- ZoomMaximumCategoryRange
- ZoomMaximumItemSpan
- ZoomToCategoryRange
- ZoomToItemSpan
- 범주 문자열 및 숫자 값을 그룹화, 정렬 및 요약하기 위한 새로운 차트 집계 API로 차트 데이터를 미리 집계하거나 계산할 필요가 없습니다.
- 초기 정렬 설명
- 초기 정렬
- 정렬 설명
- 초기 그룹
- 초기 그룹 설명
- 그룹 설명
- 초기 요약
- 초기 요약 설명
- 요약설명
- 초기 그룹 정렬 설명
- 그룹 정렬
- 그룹 정렬 설명
The Chart's Aggregation will not work when using includedProperties | excludedProperties because these properties are meant for non-aggregated data. Once you attempt to aggregate data these properties should no longer be used. The reason it does not work is because aggregation replaces the collection that is passed to the chart for render. The include/exclude properties are designed to filter in/out properties of that data and those properties no longer exist in the new aggregated collection.
13.2.0 (June 2022)
igniteui-angular-charts (Charts)
- 고도로 구성 가능한 추가 데이터 범례와 매우 유사하게 작동하는 구성요소
IgxLegendComponent
, 하지만 계열 값을 표시하고 계열 행 및 값 열 필터링, 값 스타일 지정 및 서식 지정을 위한 많은 구성 속성을 제공합니다. - 도구 설명에 시리즈의 범례 배지뿐만 아니라 시리즈의 값과 제목을 표시하는 고도로 구성 가능한 DataToolTip을 추가했습니다. 이것은 이제 모든 차트 유형에 대한 기본 도구 설명입니다.
- Stacked Series에 대한 애니메이션 및 전환 지원이 추가되었습니다. 애니메이션은
isTransitionInEnabled
속성을 true로 설정하여 활성화할 수 있습니다. 여기에서transitionInDuration
속성을 설정하여 애니메이션을 완료하는 데 걸리는 시간을 결정하고transitionInMode
하여 발생하는 애니메이션 유형을 결정할 수 있습니다. - 추가된
AssigningCategoryStyle
이벤트는 이제 모든 시리즈에서 사용할 수 있습니다IgxDataChartComponent
. 이 이벤트는 background-color 및 highlighting과 같은Fill
계열 항목의 측면을 조건부로 구성하려는 경우에 처리됩니다. - CalloutLayer에 대한 새로운
allowedPositions
열거형입니다. 설명선이 차트 내에서 배치되는 위치를 제한하는 데 사용됩니다. 기본적으로 콜아웃은 지능적으로 최상의 위치에 배치되지만 예를 들어TopLeft
,TopRight
,BottomLeft
또는BottomRight
강제하는 데 사용됩니다. - 주석 레이어에 대한 새로운 모서리 반경 속성이 추가되었습니다. 각 콜아웃의 모서리를 둥글게 만드는 데 사용됩니다. 이제 코너 반경이 기본적으로 추가되었습니다.
- CalloutLayer의
calloutCornerRadius
- FinalValueLayer의
axisAnnotationBackgroundCornerRadius
xAxisAnnotationBackgroundCornerRadius
및yAxisAnnotationBackgroundCornerRadius
for CrosshairLayer
- CalloutLayer의
- 다양한 방식으로 스크롤 막대를 활성화하는 새로운
horizontalViewScrollbarMode
및verticalViewScrollbarMode
열거형.isVerticalZoomEnabled
또는isHorizontalZoomEnabled
와 함께 사용하면 차트를 탐색하기 위해 축을 따라 스크롤 막대를 지속하거나 페이드 인 및 아웃할 수 있습니다. - 새
FavorLabellingScaleEnd
는 축이 스케일 끝에서 레이블을 내보내는 것을 선호할지 여부를 결정합니다. 숫자 축(예:IgxNumericXAxisComponent
,IgxNumericYAxisComponent
,PercentChangeAxis
)과만 호환됩니다. - 새로운
isSplineShapePartOfRange
축의 요청된 축 범위에 스플라인 모양을 포함할지 여부를 결정합니다. - 새로운
xAxisMaximumGap
xAxisGap
사용할 때 플롯된 시리즈에 허용되는 최대값을 결정합니다. 간격은 플롯된 계열의 열 또는 막대 사이의 간격을 결정합니다. - 새
xAxisMinimumGapSize
xAxisGap
사용할 때 플롯된 계열에 대해 허용되는 최소 픽셀 기반 값을 결정하여 각 범주 사이에 항상 약간의 간격이 있도록 합니다.
13.1.0 (November 2021)
Please ensure package "lit-html": "^2.0.0" or newer is added to your project for optimal compatibility.
igniteui-angular-charts (Charts)
이 릴리스에서는 지리적 맵 및 모든 차트 구성 요소에 대한 시각적 디자인 및 구성 옵션에 대한 몇 가지 개선 사항 및 단순화를 소개합니다.
- 변경됨
yAxisLabelLocation
속성 유형 YAxisLabelLocation ~에서 AxisLabelLocation ~에IgxFinancialChartComponent
그리고IgxCategoryChartComponent
- 변경됨
xAxisLabelLocation
속성 유형 XAxisLabelLocation ~에서 AxisLabelLocation ~에IgxFinancialChartComponent
-
IgxCategoryChartComponent
에xAxisLabelLocation
속성을 추가했습니다. - 범례에서
IgxGeographicMapComponent
의 지리적 계열을 나타내기 위한 지원이 추가되었습니다. -
IgxFinancialChartComponent
및IgxCategoryChartComponent
에서 기본적으로 십자선을 추가했습니다. -
IgxFinancialChartComponent
및IgxCategoryChartComponent
에서 기본적으로 십자선 주석을 추가했습니다. -
IgxFinancialChartComponent
에서 기본적으로 최종 값 주석을 추가했습니다. - 카테고리 차트 및 금융 차트에 새 속성이 추가되었습니다.
crosshairsLineThickness
및 십자선 사용자 지정을 위한 기타 속성crosshairsAnnotationXAxisBackground
및 십자선 주석을 사용자 지정하기 위한 기타 속성- 최종 값 주석을 사용자 지정하기 위한
finalValueAnnotationsBackground
및 기타 속성 - 시리즈 채우기의 불투명도를 변경할 수 있는
areaFillOpacity
(예: 영역 차트) - 마커 두께 변경을 허용하는
markerThickness
- 카테고리 차트, 금융 차트, 데이터 차트 및 지리 지도에 새 속성을 추가했습니다.
- 동일한 차트의 여러 계열에 어떤 표식 유형을 할당할 수 있는지를 허용하는
markerAutomaticBehavior
legendItemBadgeShape
범례에 표시된 모든 계열의 배지 모양을 설정하기 위한 것입니다.- 범례의 모든 계열에 배지 복잡도를 설정하기 위한
legendItemBadgeMode
- 동일한 차트의 여러 계열에 어떤 표식 유형을 할당할 수 있는지를 허용하는
- 데이터 차트 및 지리 지도의 계열에 새 속성이 추가되었습니다.
legendItemBadgeShape
범례에 표시된 특정 시리즈에 배지 모양을 설정하기 위한 것입니다.- 범례의 특정 시리즈에 배지 복잡도를 설정하기 위한
legendItemBadgeMode
- 범주 차트 및 시리즈에서 기본 수직 십자선 선 획을 #000000에서 #BBBBBB로 변경했습니다.
- 동일한 차트에 그려진 모든 시리즈의 마커 모양이 원으로 변경되었습니다. 이것은 차트의
markerAutomaticBehavior
속성을SmartIndexed
enum 값으로 설정하여 되돌릴 수 있습니다. - 원, 선 또는 사각형만 표시하도록 차트 범례의 계열 모양을 단순화했습니다. 이것은 차트의
legendItemBadgeMode
속성을MatchSeries
enum 값으로 설정하여 되돌릴 수 있습니다. - 접근성을 개선하기 위해 모든 차트에 표시되는 시리즈 및 마커의 색상 팔레트 변경
오래된 브러시/윤곽선 | 새로운 아웃라인/브러시 |
---|---|
#8BDC5C #8B5BB1 #6DB1FF #F8A15F #EE5879 #735656 #F7D262 #8CE7D9 #E051A9 #A8A8B7 |
#8BDC5C #8961A9 #6DB1FF #82E9D9 #EA3C63 #735656 #F8CE4F #A8A8B7 #E051A9 #FF903B |
11.2.0 (April 2021)
igniteui-angular-charts (Charts)
이 릴리스에서는 모든 차트 구성 요소에 대한 몇 가지 새롭고 향상된 시각적 디자인 및 구성 옵션(예: IgxDataChartComponent
, IgxCategoryChartComponent
, and IgxFinancialChartComponent
)을 소개합니다.
- Bar/Column/Waterfall 시리즈가 둥근 모서리 대신 정사각형 모서리를 갖도록 변경됨
- Scatter High Density 시리즈의 heat min 속성 색상을 #8a5bb1에서 #000000으로 변경
- Scatter High Density 시리즈의 heat max 속성 색상이 #ee5879에서 #ee5879로 변경되었습니다.
- 금융/폭포 시리즈의
NegativeBrush
및NegativeOutline
속성이 #C62828에서 #ee5879로 변경되었습니다. - 마커의 두께를 1px에서 2px로 변경
-
IgxPointSeriesComponent
,IgxBubbleSeriesComponent
,IgxScatterSeriesComponent
,IgxPolarScatterSeriesComponent
에 대한 마커의 아웃라인과 일치하도록 마커 채우기를 변경했습니다.markerFillMode
속성을 Normal로 설정하여 이 변경 사항을 취소할 수 있습니다. -
IgxTimeXAxisComponent
및IgxOrdinalTimeXAxisComponent
에 대한 압축 레이블 지정 - 새 마커 속성:
- 시리즈.
markerFillMode
- 마커가 윤곽선에 따라 달라지도록MatchMarkerOutline
으로 설정할 수 있습니다. - 시리즈.
markerFillOpacity
- 0에서 1 사이의 값으로 설정할 수 있습니다. - 시리즈.
markerOutlineMode
-MatchMarkerBrush
로 설정할 수 있으므로 마커의 윤곽선이 채우기 브러시 색상에 따라 달라집니다.
- 시리즈.
- 새 시리즈 속성:
- 시리즈.
outlineMode
- 시리즈 개요 표시 여부를 전환하도록 설정할 수 있습니다. 데이터 차트의 경우 속성은 시리즈에 있습니다.
- 시리즈.
- 차트가 기본 확대/축소 수준일 때 뷰포트에 도입된 블리드 오버 영역을 정의하는 새로운 차트 속성입니다. 일반적인 사용 사례는 축과 첫 번째/마지막 데이터 포인트 사이에 공간을 제공하는 것입니다. 아래에 나열된
computedPlotAreaMarginMode
는 마커가 활성화되면 자동으로 여백을 설정합니다. 다른 것들은 두께를 나타내기 위해Double
을 지정하도록 설계되었으며 PlotAreaMarginLeft 등은 차트의 네 면 모두에 대한 공간을 조정합니다. - 새 하이라이트 속성
- 차트.
highlightingMode
- 호버링 또는 호버링되지 않은 시리즈를 희미하게 하거나 밝게 할지 여부를 설정합니다. - 차트.
highlightingBehavior
- 마우스 위치(예: 바로 위 항목 또는 가장 가까운 항목)에 따라 계열이 강조 표시되는지 여부를 설정합니다. - 참고로 이전 릴리스에서는 강조 표시가 호버 시 페이드되는 것으로 제한되었습니다.
- 차트.
- 스택형, 분산형, 극좌표, 방사형 및 도형 시리즈 강조 표시 추가:
- Stacked, Scatter, Polar, Radial 및 Shape 시리즈에 주석 레이어를 추가했습니다.
- 누적 시리즈 내에서 개별 스택 조각의 데이터 소스를 재정의하기 위한 지원이 추가되었습니다.
- Stacked, Scatter, Range, Polar, Radial 및 Shape 시리즈에 사용자 정의 스타일 이벤트 추가
- 세로 확대/축소를 시리즈 콘텐츠에 자동으로 동기화하는 지원 추가
- 표시된 초기 레이블을 기반으로 차트의 가로 여백을 자동으로 확장하는 지원이 추가되었습니다.
- 계열 및 마커의 재설계된 색상 팔레트:
오래된 브러시/윤곽선 | 새로운 아웃라인/브러시 |
---|---|
#7446B9 #9FB328 #F96232 #2E9CA6 #DC3F76 #FF9800 #3F51B5 #439C47 #795548 #9A9A9A |
#8bdc5c #8b5bb1 #6db1ff #f8a15f #ee5879 #735656 #f7d262 #8ce7d9 #e051a9 #a8a8b7 |
예를 들어:
![]() |
![]() |
![]() |
![]() |
차트 범례
- ItemLegend에 Bubble, Donut, 파이 차트와 함께 사용할 수 있는 horizontal
orientation
속성을 추가했습니다. - 추가
legendHighlightingMode
속성 - 범례 항목 위로 마우스를 가져갈 때 계열 강조 표시를 활성화합니다.
igniteui-angular-maps (GeoMap)
These features are CTP
- 지도의 랩 어라운드 표시에 대한 지원 추가(가로 무한 스크롤)
- 좌표 원점을 둘러싸는 동안 일부 지도 시리즈의 디스플레이 이동에 대한 지원이 추가되었습니다.
- 도형 계열 강조 표시 지원 추가
- 모양 시리즈의 일부 주석 레이어에 대한 지원 추가
8.2.12
- 변경된 수입 명세서
API 클래스 및 열거형에 대한 전체 경로 대신 패키지 이름만 사용하도록 가져오기 문이 간소화되었습니다.
These breaking changes were introduce in these packages and components only:
영향을 받는 패키지 | 영향을 받는 구성 요소 |
---|---|
igniteui-앵귤러-엑셀 | 엑셀 라이브러리 |
igniteui-앵귤러-스프레드시트 | 스프레드시트 |
igniteui-앵귤러-맵 | 지역 지도, 트리맵 |
igniteui-앵귤러-게이지 | 불릿 그래프, 선형 계기, 방사형 게이지 |
igniteui-앵귤러-차트 | 카테고리 차트, 데이터 차트, 도넛 차트, 금융 차트], 파이 차트, 확대/축소 슬라이더 |
igniteui-앵귤러-코어 | 모든 클래스와 열거형 |
- 변경 후 코드
이제 API 클래스 및 열거형에 대한 전체 경로 대신 패키지 이름만 사용해야 합니다.
Data Grid 구성 요소 및 해당 모듈의 이름도 변경되었습니다.
// gauges:
import { IgxLinearGauge } from "igniteui-angular-gauges";
import { IgxLinearGaugeModule } from "igniteui-angular-gauges";
import { IgxLinearGraphRange } from "igniteui-angular-gauges";
import { IgxRadialGauge } from 'igniteui-angular-gauges}';
import { IgxRadialGaugeModule } from 'igniteui-angular-gauges';
import { IgxRadialGaugeRange } from 'igniteui-angular-gauges';
import { SweepDirection } from 'igniteui-angular-core';
// charts:
import { IgxFinancialChartComponent } from "igniteui-angular-charts";
import { IgxFinancialChartModule } from "igniteui-angular-charts";
import { IgxDataChartComponent } from "igniteui-angular-charts";
import { IgxDataChartCoreModule } from "igniteui-angular-charts";
// maps:
import { IgxGeographicMapComponent } from "igniteui-angular-maps";
import { IgxGeographicMapModule } from "igniteui-angular-maps";
ts
- 변경 전 코드
이전에는 API 클래스 및 열거형에 대한 전체 경로를 사용하여 가져와야 했습니다.
// gauges:
import { IgxLinearGaugeComponent } from 'igniteui-angular-gauges/ES5/igx-linear-gauge-component';
import { IgxLinearGaugeModule } from 'igniteui-angular-gauges/ES5/igx-linear-gauge-module';
import { IgxLinearGraphRange } from 'igniteui-angular-gauges/ES5/igx-linear-graph-range';
import { IgxRadialGaugeComponent } from "igniteui-angular-gauges/ES5/igx-radial-gauge-component";
import { IgxRadialGaugeModule } from "igniteui-angular-gauges/ES5/igx-radial-gauge-module";
import { IgxRadialGaugeRange } from "igniteui-angular-gauges/ES5/igx-radial-gauge-range";
import { SweepDirection } from "igniteui-angular-core/ES5/SweepDirection";
// charts:
import { IgxFinancialChartComponent } from "igniteui-angular-charts/ES5/igx-financial-chart-component";
import { IgxFinancialChartModule } from "igniteui-angular-charts/ES5/igx-financial-chart-module";
import { IgxDataChartComponent } from "igniteui-angular-charts/ES5/igx-data-chart-component";
import { IgxDataChartCoreModule } from "igniteui-angular-charts/ES5/igx-data-chart-core-module";
// maps:
import { IgxGeographicMapComponent } from "igniteui-angular-maps/ES5/igx-geographic-map-component";
import { IgxGeographicMapModule } from "igniteui-angular-maps/ES5/igx-geographic-map-module";
ts