Ignite UI for Web Components 変更ログ
Ignite UI for Web Components の各バージョンのすべての重要な変更は、このページに記載されています。
4.8.1 (June 2024)
igniteui-webcomponents
IgcInputComponent
、IgcTextareaComponent
- ユーザー入力を制限することなく検証ルールを適用できるようにValidateOnly
を公開しました。IgcDropdownComponent
-positionStrategy
プロパティは非推奨です。ドロップダウンは、ブラウザー ビューポートの最上位レイヤーにコンテナーをレンダリングするためにIgcPopoverComponent
API を使用するようになったため、このプロパティは廃止されました。IgcDockManagerComponent
-IgcSplitPane
のisMaximized
は非推奨です。分割ペイン レベルで isMaximized を true に設定しても、分割ペインはコンテナーとしてのみ機能し、最大化されて表示される実際のコンテンツがないため、実際の効果はありません。代わりに、IgcTabGroupPane
および/またはIgcContentPane
のisMaximized
プロパティを使用してください。
igniteui-webcomponents-grids
displayDensity
は非推奨となり、代わりに--ig-size
CSS カスタム プロパティが使用されるようになりました。
igniteui-webcomponents-charts (チャート)
- データ凡例のグループ化 と データ ツールチップのグループ化 - 新しいグループ化機能が追加されました。
GroupRowVisible
プロパティは、各シリーズのグループ化を切り替え、オプトインするとDataLegendGroup
プロパティを介してグループ テキストを割り当てることができます 同じ値が複数のシリーズに適用されている場合、それらはグループ化されて表示されます。すべてのユーザー向けに分類および整理する必要がある大規模なデータセットに役立ちます。
チャートの選択 - 新しいシリーズ選択のスタイル設定。これは、
IgcCategoryChartComponent
およびIgcDataChartComponent
のすべてのカテゴリ、財務、およびラジアル シリーズに広く採用されています。シリーズはクリックして異なる色で表示したり、明るくしたり、薄くしたり、フォーカスのアウトラインを表示したりできます。個々のシリーズまたはデータ項目全体を通じて影響を受ける項目を管理します。 複数のシリーズとマーカーがサポートされています。特定のデータ項目の値間のさまざまな相違点や類似点を示すのに役立ちます。また、SelectedSeriesItemsChanged
イベントとSelectedSeriesItems
は、選択内容に基づいたデータ分析を行うポップアップやその他の画面など、アプリケーション内で実行できるその他のアクションを取り巻く堅牢なビジネス要件を構築するための追加の支援として利用できます。ツリーマップのハイライト表示 - ツリー マップの項目のマウスオーバーによるハイライト表示を構成できる
highlightingMode
プロパティが公開されました。このプロパティには 2 つのオプションがあります:Brighten
では、マウスを置いた項目にのみハイライト表示が適用され、FadeOthers
では、マウスホバーした項目のハイライト表示はそのままで、それ以外はすべてフェードアウトします。このハイライト表示はアニメーション化されており、highlightingTransitionDuration
プロパティを使用して制御できます。ツリーマップのパーセントベースのハイライト表示 - 新しいパーセントベースのハイライト表示により、ノードはコレクションの進行状況またはサブセットを表すことができます。外観は、データ項目のメンバーによって、または新しい
HighlightedItemsSource
を指定することによって、特定の値までの背景色の塗りつぶしとして表示されます。highlightedValuesDisplayMode
で切り替えることができ、FillBrushes
でスタイルを設定できます。toolbar
- 選択した特定のツールの周囲に境界線を描くための ToolAction の新しいIsHighlighted
オプション。
igniteui-webcomponents-gauges (ゲージ)
IgcRadialGaugeComponent
- ハイライト針の新しいラベル。
HighlightLabelText
とHighlightLabelSnapsToNeedlePivot
および、その他の HighlightLabel の多くのスタイル関連プロパティが追加されました。
- ハイライト針の新しいラベル。
4.8.0 (March 2024)
igniteui-webcomponents-charts
initialFilter
プロパティによる新しいデータ フィルタリング。フィルター式を適用して、チャート データをレコードのサブセットにフィルターします。大規模なデータのドリルダウンに使用できます。XamRadialChart
- 新しいラベル モード
IgcCategoryAngleAxisComponent
は、ラベルの位置をさらに構成できるLabelMode
プロパティを公開するようになりました。これにより、Center
列挙型を選択してデフォルト モードを切り替えることも、ラベルを円形のプロット領域に近づける新しいモードClosestPoint
を使用することもできます。
- 新しいラベル モード
igniteui-webcomponents-gauges
IgcRadialGaugeComponent
- 新しいタイトル/サブタイトルのプロパティ。
TitleText
、SubtitleText
はゲージの下部近くに表示されます。さらに、TitleFontSize
、TitleFontFamily
、TitleFontStyle
、TitleFontWeight
、TitleExtent
など、さまざまなタイトルとサブタイトルのフォント プロパティが追加されました。最後に、新しいTitleDisplaysValue
により、値を針の位置に対応させることができます。 IgcRadialGaugeComponent
の新しいOpticalScalingEnabled
プロパティとOpticalScalingSize
プロパティ。この新機能は、ゲージのラベル、タイトル、サブタイトルが 100% のオプティカル スケーリングを持つサイズを管理します。この新機能の詳細については、こちらを参照してください。- 新しいハイライト針が追加されました。
HighlightValue
とHighlightValueDisplayMode
の両方に値と 'Overlay' 設定が指定されたとき、メインの針が薄く表示され、新しい針が表示されます。
- 新しいタイトル/サブタイトルのプロパティ。
IgcLinearGaugeComponent
- 新しいハイライト針が追加されました。
HighlightValue
とHighlightValueDisplayMode
の両方に値と 'Overlay' 設定が指定されたとき、メインの針が薄く表示され、新しい針が表示されます。
- 新しいハイライト針が追加されました。
IgcBulletGraphComponent
HighlightValueDisplayMode
が 'Overlay' 設定に適用されたとき、パフォーマンス バーには値と新しいHighlightValue
の差が反映されるようになりました。ハイライト値には、フィルタリング/サブセットが完了した測定パーセンテージが塗りつぶされた色で表示され、残りのバーの外観は割り当てられた値に対して薄く表示され、リアルタイムでパフォーマンスを示します。
igniteui-webcomponents-grids
- 新しい
HierarchicalGrid
コンポーネント
4.7.0 (January 2024)
igniteui-webcomponents-charts (チャート)
- チャートのハイライト表示フィルター -
IgcCategoryChartComponent
とIgcDataChartComponent
は、データのサブセットの内外でハイライト表示およびアニメーション化する方法を公開するようになりました。このハイライト表示の表示はシリーズのタイプによって異なります。列およびエリア シリーズの場合、サブセットはデータの合計セットの上に表示され、サブセットはシリーズの実際のブラシによって色付けされ、合計セットは不透明度を下げます。折れ線シリーズの場合、サブセットは点線で表示されます。
4.6.0 (December 2023)
igniteui-webcomponents-grids (Grid)
- 新規機能:
4.3.2 (October 2023)
igniteui-webcomponents-grids (Toolbar - ベータ版)
- クリップボードを介してチャートを画像に保存するための保存ツール アクションが追加されました。
- ツールバーの
orientation
プロパティを介して垂直方向が追加されました。デフォルトでは、ツールバーは水平方向ですが、ツールバーを垂直方向に表示できるようになり、ツールが左右にポップアップ表示されます。 - ツールバーの
renderImageFromText
メソッドを介してカスタム SVG アイコンのサポートが追加され、カスタム ツールの作成がさらに強化されました。
4.3.0 (June 2023)
新しいコンポーネント
- Toolbar - ベータ版。このコンポーネントは、主にチャート コンポーネントで使用される UI 操作のコンパニオン コンテナーです。ツールバーは、
IgcDataChartComponent
またはIgcCategoryChartComponent
コンポーネントにリンクされると、プロパティとツール項目のプリセットで動的に更新されます。プロジェクト用のカスタム ツールを作成して、エンド ユーザーが変更を提供できるようになり、無限のカスタマイズが可能になります。
igniteui-webcomponents-charts (チャート)
ValueLayer -
IgcValueLayerComponent
という名前の新しいシリーズ タイプが公開されました。これにより、Maximum、Minimum、Average など、プロットされたデータのさまざまな焦点のオーバーレイを描画できます。これは、新しいvalueLines
コレクションに追加することで、IgcCategoryChartComponent
とIgcFinancialChartComponent
に適用されます。ダッシュ配列を
IgcDataChartComponent
のシリーズのさまざまな部分に適用できるようになりました。これは、チャートにプロットされたシリーズ、チャートのグリッド線、およびチャートにプロットされたシリーズのトレンドラインに適用できます。
4.2.5 (April 2023)
新しいコンポーネント
igniteui-webcomponents-grids (データ グリッド)
- 新しい引数
primaryKey
がIgcRowDataEventArgs
に導入されました。これは、RowAdded
およびRowDeleted
イベントによって発行されるイベント引数の一部です。グリッドに主キー属性が追加されている場合、発行された primaryKey イベント引数は行 ID を表し、それ以外の場合はデフォルトで未定義になります。 RowSelectionChanging
イベント引数が変更されました。現在、グリッドが primaryKey を設定した場合、OldSelection
、NewSelection
、Added
およびRemoved
コレクションは、選択された要素の行キーで構成されなくなりましたが、いずれにしても行データが出力されるようになりました。- グリッドがリモート データを操作していて、主キーが設定されている場合、現在グリッド ビューに含まれていない選択された行に対して、部分的な行データ オブジェクトが発行されます。
- 選択された行がグリッド コンポーネントから削除されると、
RowSelectionChanging
イベントは発生しなくなります。 OnGroupingDone
イベントはGroupingDone
に名前が変更され、on プレフィックスを付けない出力規則に違反しなくなりました。OnDensityChanged
イベントの名前がDensityChanged
に変更され、on プレフィックスを付けない出力規則に違反しなくなりました。このイベントを公開しているすべてのコンポーネントが影響を受けます。
igniteui-webcomponents-inputs
IgcDateTimeInputComponent
、StepDownAsync(DateTimeInputDatePart.Date, SpinDelta.Date) は、DateTimeInputDatePart ではなく DatePart に切り詰められるようになりました。IgcRadioComponent
およびIgcRadioGroupComponent
は、無効な状態のスタイルとともにコンポーネントの検証が追加されました。Mask
は、マスク パターン リテラルをエスケープする機能が追加されました。IgcBadgeComponent
は、バッジの形状を制御するshape
プロパティを追加し、Square
またはRounded
のいずれかになります。デフォルトでは、バッジの形状は rounded です。IgcAvatarComponent
、roundShape
プロパティは廃止され、将来のバージョンで削除される予定です。ユーザーは、新しく追加されたshape
属性によってアバターの形状を制御できます。これは、Square
、Rounded
、またはCircle
にすることができます。アバターのデフォルトの形状はSquare
です。
igniteui-webcomponents-grids (ピボット グリッド)
IgcPivotDateDimension
プロパティのInBaseDimension
とInOption
は廃止され、それぞれbaseDimension
とoptions
に名前が変更されました。
igniteui-dockmanager (DockManager)
- ドック マネージャー のペイン コレクションに保護されたセッターが追加されました。ペインを作成するときに、ネストされた構造でペインを設定するのではなく、Add を呼び出す必要があります。
4.0.4 (December 2022)
新しいコンポーネント
4.0.0 (November 2022)
新しいコンポーネント
igniteui-webcomponents-charts
デフォルトの動作を大幅に改善し、カテゴリ チャート API を改良して使いやすくしました。これらの新しいチャートの改善点は次のとおりです:
- ブラウザー / 画面サイズに基づいた水平ラベル回転のレスポンシブ レイアウト。
- すべてのプラットフォームでの丸型ラベルの描画が強化されました。
- StackedFragmentSeries にマーカー プロパティを追加しました。
shouldPanOnMaximumZoom
プロパティを追加しました。- 新しいカテゴリ軸プロパティ:
- ZoomMaximumCategoryRange
- ZoomMaximumItemSpan
- ZoomToCategoryRange
- ZoomToItemSpan
- カテゴリの文字列と数値をグループ化、ソート、集計するための新しいチャート集計 API により、チャート データを事前に集計または計算する必要がなくなります。
- InitialSortDescriptions
- InitialSorts
- SortDescriptions
- InitialGroups
- InitialGroupDescriptions
- GroupDescriptions
- InitialSummaries
- InitialSummaryDescriptions
- SummaryDescriptions
- InitialGroupSortDescriptions
- GroupSorts
- GroupSortDescriptions
[!Note]
includedProperties
|excludedProperties
を使用している場合、チャート集計は機能しません。チャートのこれらのプロパティは非集計データ用です。データを集計しようとすると、これらのプロパティは使用できなくなります。うまくいかない理由は、描画のためにチャートに渡されたコレクションを集計により置き換えるためです。include/exclude プロパティは、そのデータの in/out プロパティをフィルターするように設計されており、それらのプロパティは新しい集計されたコレクションには存在しません。
igniteui-webcomponents-grids (データ グリッド)
- IgcColumn を
IgcDataGridColumnComponent
に変更しました。 - GridCellEventArgs を
IgcDataGridCellEventArgs
に変更しました。 - GridSelectionMode を
DataGridSelectionMode
に変更しました。 - SummaryOperand を
DataSourceSummaryOperand
に変更しました。
3.2.1 (June 2022)
igniteui-webcomponents-charts
- 高度に構成可能な DataLegend コンポーネントが追加されました。これは、
IgcLegendComponent
とよく似たコンポーネントですが、シリーズの値を表示し、シリーズの行と値の列をフィルタリングし、値のスタイルとフォーマットを行うための多くの構成プロパティを提供します。 - 高度に構成可能な DataToolTip が追加されました。これは、シリーズの値とタイトル、およびシリーズの凡例バッジをツールチップに表示します。これは、すべてのチャート タイプのデフォルトのツールチップになりました。
- 積層シリーズのアニメーションとトランジションインのサポートが追加されました。
isTransitionInEnabled
プロパティを true に設定すると、アニメーションを有効にできます。そこから、transitionInDuration
プロパティを設定してアニメーションが完了するまでの時間を決定し、transitionInMode
でアニメーションのタイプを決定できます。 - 追加された
AssigningCategoryStyle
イベントは、IgcDataChartComponent
のすべてのシリーズで利用できるようになりました。このイベントは、背景色のFill
やハイライト表示など、シリーズ項目の外観を条件付きで構成する場合に処理されます。 - CalloutLayer の新しい
allowedPositions
列挙体。チャート内のどこにコールアウトを配置するかを制限するために使用されます。デフォルトでは、コールアウトは最適な場所に配置されますが、これはTopLeft
、TopRight
、BottomLeft
、またはBottomRight
を強制するために使用されます。 - 注釈レイヤーに追加された新しいコーナー半径プロパティ。各コールアウトのコーナーを丸めるために使用されます。コーナー半径がデフォルトで追加されていることに注意してください。
- CalloutLayer の
calloutCornerRadius
- FinalValueLayer の
axisAnnotationBackgroundCornerRadius
- CrosshairLayer の
xAxisAnnotationBackgroundCornerRadius
とyAxisAnnotationBackgroundCornerRadius
- CalloutLayer の
- さまざまな方法でスクロールバーを有効にするための新しい
horizontalViewScrollbarMode
およびverticalViewScrollbarMode
列挙体。isVerticalZoomEnabled
またはisHorizontalZoomEnabled
と組み合わせると、チャートをナビゲートするための軸に沿ったスクロールバーを、常設またはフェードインおよびフェードアウトすることができます。 - 新しい
FavorLabellingScaleEnd
は、軸がスケールの最後にラベルを表示することを優先するかどうかを決定します。数値軸 (IgcNumericXAxisComponent
、IgcNumericYAxisComponent
、PercentChangeAxis
など) とのみ互換性があります。 - 新しい
isSplineShapePartOfRange
は、軸に要求された軸範囲にスプライン形状を含めるかどうかを決定します。 - 新しい
xAxisMaximumGap
は、xAxisGap
を使用するときにプロットされたシリーズの最大許容値を決定します。ギャップは、プロットされたシリーズの列またはバー間のスペースの量を決定します。 - 新しい
xAxisMinimumGapSize
は、xAxisGap
を使用するときに、プロットされたシリーズの最小許容ピクセルベース値を決定し、各カテゴリ間に常にある程度の間隔があることを保証します。
igniteui-webcomponents-grids (データ グリッド)
新機能 - 行ページングを追加しました。これは、大量のデータセットを類似したコンテンツを持つ一連のページに分割するために使用されます。ページネーションを使用すると、データを設定された行数で表示することができ、ユーザーはスクロール バーを使用せずにデータを順次閲覧することができます。テーブル ページネーションの UI には通常、現在のページ、合計ページ、ユーザーがページをめくるためのクリック可能な [前へ] と [次へ] の矢印 / ボタンなどが含まれます。
新しいコンポーネント
2.0.0
igniteui-webcomponents
新しいコンポーネントとテーマ
これらは igniteui-webcomponents パッケージでのみ関連しています。
- スライダーを追加しました。
- 範囲スライダーを追加しました。
igniteui-webcomponents/themes/bootstrap.css
のテーマの構造を変更するダーク テーマを追加しました: ライト テーマの場合はigniteui-webcomponents/themes/light/bootstrap.css
ダーク テーマの場合はigniteui-webcomponents/themes/dark/bootstrap.css
重大な変更
このリリースでは、Calendar、Card、Navigation Drawer、および Radio コンポーネントの API にいくつかの重大な変更が導入されています。
- Radio コンポーネントの
required
プロパティをサポートする機能が追加されました。 - 重大な変更:
- Calendar コンポーネントの value: Date | Date[] プロパティを 2 つのプロパティに分割しました:
value
: Date おとびvalues
: Date[]。 - Calendar コンポーネントの hasHeader プロパティと has-header 属性をそれぞれ
hideHeader
とhide-header
に置き換えました。 - Card コンポーネントの outlined プロパティを
elevated
に置き換えました。 - Navigation Drawer コンポーネントの igcOpening、igcOpened、igcClosing、および igcClosed イベントを削除しました。
- Calendar コンポーネントの value: Date | Date[] プロパティを 2 つのプロパティに分割しました:
1.4.2 (December 2021)
igniteui-webcomponents-grids (データ グリッド)
データ グリッド
- ドロップダウンの項目に複数のフィールドで構成されるキーが含まれている場合に使用される
IgcComboBoxColumnComponent
に string[] 型のvalueMultiField
が追加されました。
[!Note] 以下の重大な変更が導入されました:
valueField
プロパティを string[] 型から string に変更しました。
igniteui-webcomponents-inputs
日付ピッカー
ValueChanged
イベントをSelectedValueChanged
に変更しました。
複数列コンボボックス
TextChanged
イベントをTextValueChanged
に変更しました。ValueChanged
イベントをSelectedValueChanged
に変更しました。
1.0.0
igniteui-webcomponents
新しいコンポーネント
これらは igniteui-webcomponents パッケージでのみ関連しています。
- Avatar
- Badge
- Button & Icon Button
- Calendar
- Card
- Checkbox
- Form
- Icon
- Input
- List
- Navigation Bar
- Navigation Drawer
- Radio & Radio Group
- Ripple
- Switch
1.4.1 (November 2021)
[!Note] パッケージ 「lit-html」 を確認してください。最適な互換性のために、「^2.0.0」 以降がプロジェクトに追加されます。
igniteui-webcomponents-charts (チャート)
このリリースでは、地理マップとすべてのチャート コンポーネントのビジュアル デザインと構成オプションにいくつかの改善と簡素化が導入されています。
IgcFinancialChartComponent
とIgcCategoryChartComponent
のyAxisLabelLocation
プロパティのタイプを AxisLabelLocation から YAxisLabelLocation に変更しました。IgcFinancialChartComponent
の AxisLabelLocation から XAxisLabelLocation にxAxisLabelLocation
プロパティのタイプを変更しました。IgcCategoryChartComponent
にxAxisLabelLocation
プロパティを追加しました。- 凡例で
IgcGeographicMapComponent
の地理的なシリーズを表すためのサポートが追加されました。 IgcFinancialChartComponent
とIgcCategoryChartComponent
にデフォルトの十字線を追加しました。IgcFinancialChartComponent
とIgcCategoryChartComponent
にデフォルトの十字線の注釈を追加しました。IgcFinancialChartComponent
にデフォルトで最終値の注釈を追加しました。- カテゴリ チャートとファイナンシャル チャートに新しいプロパティを追加しました:
- 十字線をカスタマイズするための
crosshairsLineThickness
およびその他のプロパティ - 十字線の注釈をカスタマイズするための
crosshairsAnnotationXAxisBackground
およびその他のプロパティ - 最終値の注釈をカスタマイズするための
finalValueAnnotationsBackground
およびその他のプロパティ - シリーズ塗りつぶしの不透明度を変更できる
areaFillOpacity
(エリア チャートなど) - マーカーの厚さを変更できる
markerThickness
- 十字線をカスタマイズするための
- カテゴリ チャート、ファイナンシャル チャート、データ チャート、および地理マップに新しいプロパティを追加しました。
- 同じチャート内の複数のシリーズにどのマーカー タイプを割り当てることができる
markerAutomaticBehavior
- 凡例で表されるすべてのシリーズのバッジの形状を設定するための
legendItemBadgeShape
- 凡例のすべてのシリーズにバッジの複雑さを設定するための
legendItemBadgeMode
- 同じチャート内の複数のシリーズにどのマーカー タイプを割り当てることができる
- データ チャートと地理マップのシリーズに新しいプロパティを追加しました。
- 凡例で表される特定のシリーズにバッジの形状を設定するための
legendItemBadgeShape
- 凡例の特定のシリーズにバッジの複雑さを設定するための
legendItemBadgeMode
- 凡例で表される特定のシリーズにバッジの形状を設定するための
- カテゴリ チャートとシリーズで、デフォルトの垂直十字線ストロークを#000000 から #BBBBBB に変更しました。
- 同じチャートにプロットされたすべてのシリーズのマーカーの図形を円に変更しました。これは、チャートの
markerAutomaticBehavior
プロパティをSmartIndexed
列挙値に設定することで元に戻すことができます。 - チャートの凡例のシリーズの簡略化された図形で、円、線、または四角のみを表示します。これは、チャートの
legendItemBadgeMode
プロパティをMatchSeries
列挙値に設定することで元に戻すことができます。 - アクセシビリティを向上させるために、すべてのチャートに表示されるシリーズとマーカーのカラー パレットを変更しました
古いのブラシ/アウトライン | 新のアウトライン/ブラシ |
---|---|
#8BDC5C #8B5BB1 #6DB1FF #F8A15F #EE5879 #735656 #F7D262 #8CE7D9 #E051A9 #A8A8B7 |
#8BDC5C #8961A9 #6DB1FF #82E9D9 #EA3C63 #735656 #F8CE4F #A8A8B7 #E051A9 #FF903B |
igniteui-webcomponents-grids (データ グリッド)
- 新規機能:
- 新規 API:
SelectionChanged
イベントを追加しました。複数行の選択など、選択のインタラクションの変化を検出するために使用されます。
- 重大な変更:
- グリッドの SummaryScope プロパティのタイプを
DataSourceSummaryScope
から SummaryScope に変更しました。 - GroupHeaderDisplayMode プロパティのタイプを
DataSourceSectionHeaderDisplayMode
から GroupHeaderDisplayMode に変更しました。
- グリッドの SummaryScope プロパティのタイプを
1.3.0 (April 2021)
igniteui-webcomponents-charts (チャート)
このリリースでは、すべてのチャート コンポーネントに、いくつかの新しく改善されたビジュアル デザインと構成オプションが導入されています。例えば、IgcDataChartComponent
、IgcCategoryChartComponent
、および IgcFinancialChartComponent
。
- 棒/縦棒/ウォーターフォール シリーズを、角丸ではなく角が四角になるように変更しました。
- heat min プロパティの 散布高密度シリーズの色を #8a5bb1 から #000000 に変更しました。
- heat max プロパティの 散布高密度シリーズの色を #ee5879 から #ee5879 に変更しました。
- ファイナンシャル/ウォーターフォール シリーズの
NegativeBrush
およびNegativeOutline
プロパティを #C62828 から #ee5879 に変更しました。 - マーカーの厚さを 1 pxから 2 pxに変更しました。
IgcPointSeriesComponent
、IgcBubbleSeriesComponent
、IgcScatterSeriesComponent
、IgcPolarScatterSeriesComponent
のマーカーのアウトラインに一致するようにマーカーの塗りつぶしを変更しました。markerFillMode
プロパティを Normal に設定すると、この変更を元に戻すことができます。IgcTimeXAxisComponent
とIgcOrdinalTimeXAxisComponent
のラベリングを圧縮しました。- 新しいマーカー プロパティ:
- series.
markerFillMode
- マーカーがアウトラインに依存するように、markerFillMode
に設定できます。 - series.
markerFillOpacity
- 0〜1 の値に設定できます。 - series.
markerOutlineMode
- マーカーのアウトラインが塗りブラシの色に依存するように、MatchMarkerBrush
に設定できます。
- series.
- 新シリーズ プロパティ:
- series.
outlineMode
- シリーズ アウトラインの表示を切り替えるように設定できます。データ チャートの場合、プロパティはシリーズ上にあることに注意してください。
- series.
- チャートがデフォルトのズーム レベルにあるときにビューポートに導入されるブリード オーバー領域を定義する新しいチャート プロパティを追加しました。一般的な使用例では、軸と最初/最後のデータ ポイントの間にスペースを提供します。以下にリストされている
computedPlotAreaMarginMode
は、マーカーが有効になっているときに自動的にマージンを設定することに注意してください。その他は、厚さを表すDouble
を指定するように設計されており、PlotAreaMarginLeft などがチャートの 4 辺すべてにスペースを調整します。- chart.
plotAreaMarginLeft
- chart.
plotAreaMarginTop
- chart.
plotAreaMarginRight
- chart.
plotAreaMarginBottom
- chart.
computedPlotAreaMarginMode
- chart.
- 新しいハイライト表示プロパティ:
- chart.
highlightingMode
- ホバーされたシリーズとホバーされていないシリーズをフェードまたは明るくするかを設定します。 - chart.
highlightingBehavior
- 真上または最も近い項目など、マウスの位置に応じてシリーズをハイライト表示するかどうかを設定します。 - 以前のリリースでは、ハイライト表示はホバー時にフェードするように制限されていたことに注意してください。
- chart.
- 積層型、散布、極座標、ラジアル、およびシェイプ シリーズにハイライト表示を追加しました。
- 積層型、散布、極座標、ラジアル、およびシェイプ シリーズに注釈レイヤーを追加しました。
- 積層型シリーズ内の個々の積層フラグメントのデータ ソースをオーバーライドするためのサポートが追加されました。
- 積層型、散布、範囲、極座標、ラジアル、シェイプ シリーズにカスタム スタイルのイベントを追加しました。
- 垂直ズームをシリーズ コンテンツに自動的に同期するサポートが追加されました。
- 表示された最初のラベルに基づいてチャートの水平マージンを自動的に拡張するサポートが追加されました。
- シリーズとマーカーの再設計されたカラー パレット:
古いのブラシ/アウトライン | 新のアウトライン/ブラシ |
---|---|
#7446B9 #9FB328 #F96232 #2E9CA6 #DC3F76 #FF9800 #3F51B5 #439C47 #795548 #9A9A9A |
#8bdc5c #8b5bb1 #6db1ff #f8a15f #ee5879 #735656 #f7d262 #8ce7d9 #e051a9 #a8a8b7 |
例:
![]() |
![]() |
![]() |
![]() |
チャート凡例
- バブル、ドーナツ、および円チャートで使用できる水平方向の
orientation
プロパティを ItemLegend に追加しました。 legendHighlightingMode
プロパティの追加 - 凡例項目にホバーした時にシリーズのハイライト表示を有効にします。
igniteui-webcomponents-maps (GeoMap)
[!Note] これらの機能は CTP です。
- マップの表示を折り返すためのサポートが追加されました (水平方向に無限にスクロールできます)。
- 座標原点を折り返しながら、一部のマップ シリーズの表示をシフトするためのサポートが追加されました。
- シェイプ シリーズのハイライト表示のサポートが追加されました。
- シェイプ シリーズの一部の注釈レイヤーのサポートが追加されました。
igniteui-webcomponents-grids
EditOnKeyPress
、(別名: Excel スタイルの編集) を追加し、入力するとすぐに編集を開始します。EditModeClickAction
プロパティを追加しました - デフォルトでは、編集モードに入るにはダブル クリックが必要です。これをSingleClick
に設定して、新しいセルを選択するときに編集モードを実行できるようにすることができます。EnterKeyBehaviors
プロパティの追加 - 別名 Excel スタイル ナビゲーション (Enter 動作) - Enter キーの動作を制御します。たとえば、オプションは none、edit、move up、down、left、right です。EnterKeyBehaviorAfterEdit
プロパティの追加 - 編集モードでは、このプロパティは Enter キーが押されたときを制御します。例えば、オプションは (下、上、右、左のセルに移動) です。selectAllRows
メソッドを追加しました。- 行範囲の選択を追加しました -
GridSelectionMode
プロパティを MultipleRow に設定すると、次の新しい機能が含まれるようになりました:- クリックしてドラッグし、行を選択します。
- Shift キーを押しながらクリックして、複数の行を選択します。
- Shift キーを押しながら上下の矢印キーを押して、複数の行を選択します。
- スペース バーを押すと、MultipleRow または SingleRow に設定された
GridSelectionMode
プロパティを介してアクティブな行の選択が切り替わります。 - 列オプション ダイアログに列集計を追加しました。
igniteui-webcomponents-inputs
日付ピッカー
showTodayButton
- 現在の日付のボタンの表示を切り替えます。label
- 日付値の上にラベルを追加します。placeholder
プロパティ - 値が選択されていない場合にカスタム テキストを追加します。formatString
- 入力日付文字列をカスタマイズします。(例:yyyy-MM-dd
)dateFormat
- 選択した日付を LongDate または ShortDate のどちらとして表示するかを指定します。firstDayOfWeek
- 週の最初の曜日を指定します。firstWeekOfYear
- 年の最初の週をいつ表示するかを指定します。例えば、最初の 1 週間、最初の 4 日間の週です。showWeekNumbers
- 週番号の表示を切り替えます。minDate
&maxDate
- 使用可能の選択できる日付の範囲を指定する日付制限。- アクセシビリティの追加
1.1.3 (November 2020)
igniteui-webcomponents-grids (データ グリッド)
[!Note] これらの重大な変更は、グリッド パッケージで導入されました。
- PropertyPath の名称変更
データ グリッド コンポーネントの propertyPath
プロパティ名が field
に変更されました。これは、すべての Column タイプ、GroupDescription、SortDescription および SummaryDescription に適用します。
<igc-text-column field="Name"></igc-text-column>
import { IgcColumnSummaryDescription, IgcColumnSortDescription, IgcColumnGroupDescription} from 'igniteui-webcomponents-grids'
const productCount = new IgcColumnSummaryDescription();
productCount.field = "ProductName";
const colSortDesc = new IgcColumnSortDescription();
colSortDesc.field = "UnitsInStock";
const income = new IgcColumnGroupDescription();
income.field = "Income";
1.1.2 (April 2020)
igniteui-webcomponents-grids (データ グリッド)
- Live Grid の名称変更
Data Grid コンポーネントおよび対応するモジュールの名前が 「LiveGrid」 から 「DataGrid」 に変更されました。
[!Note] これらの重大な変更は、これらのパッケージとコンポーネントでのみ導入されました:
グリッドとそれに対応するモジュールをインポートする新しいコードは以下のとおりです。
import { IgcDataGrid } from "igniteui-webcomponents-grids";
import { IgcDataGridModule } from 'igniteui-webcomponents-grids';
- Data Grid の必須ピア依存関係
Data Grid コンポーネントには 「inputs」 パッケージが必要です。
**npm install --save igniteui-webcomponents-inputs**
1.0.6
- import ステートメントの変更
Import ステートメントは、API クラスと列挙型へのフル パスではなくパッケージ名のみを使用するように簡素化されました。
[!Note] これらの重大な変更は、これらのパッケージとコンポーネントでのみ導入されました:
影響されるパッケージ | 影響されるコンポーネント |
---|---|
igniteui-webcomponents-excel | Excel ライブラリ |
igniteui-webcomponents-spreadsheet | スプレッドシート |
igniteui-webcomponents-maps | 地理マップ、ツリーマップ |
igniteui-webcomponents-gauges | ブレット グラフ、リニア ゲージ、ラジアル ゲージ |
igniteui-webcomponents-charts | カテゴリ チャート、データ チャート、ドーナツ チャート、ファイナンシャル チャート、円チャート、ズーム スライダー |
igniteui-webcomponents-core | すべてのクラスと列挙型 |
igniteui-webcomponents-grids | データ グリッド |
- 変更後のコード
API クラスと列挙型へのフル パスの代わりにパッケージ名のみを使用できます。
注: Data Grid コンポーネントとそれに対応するモジュールの名前も変更されました。
// gauges:
import { IgcLinearGaugeComponent } from "igniteui-webcomponents-gauges";
import { IgcLinearGaugeModule } from "igniteui-webcomponents-gauges";
import { IgcLinearGraphRange } from "igniteui-webcomponents-gauges";
import { IgcRadialGaugeComponent } from 'igniteui-webcomponents-gauges';
import { IgcRadialGaugeModule } from 'igniteui-webcomponents-gauges';
import { IgcRadialGaugeRange } from 'igniteui-webcomponents-gauges';
import { SweepDirection } from 'igniteui-webcomponents-core';
// charts:
import { IgcFinancialChartComponent } from "igniteui-webcomponents-charts";
import { IgcFinancialChartModule } from "igniteui-webcomponents-charts";
import { IgcDataChartComponent } from "igniteui-webcomponents-charts";
import { IgcDataChartCoreModule } from "igniteui-webcomponents-charts";
// maps:
import { IgcGeographicMapComponent } from "igniteui-webcomponents-maps";
import { IgcGeographicMapModule } from "igniteui-webcomponents-maps";
// grids:
import { IgcDataGridComponent } from "igniteui-webcomponents-grids";
import { IgcDataGridModule } from "igniteui-webcomponents-grids";
- 変更前のコード
以前は、API クラスと列挙型への完全なパスを使用してインポートする必要がありました。
// gauges:
import { IgcLinearGaugeComponent } from 'igniteui-webcomponents-gauges/ES5/igc-linear-gauge-component';
import { IgcLinearGaugeModule } from 'igniteui-webcomponents-gauges/ES5/igc-linear-gauge-module';
import { IgcLinearGraphRange } from 'igniteui-webcomponents-gauges/ES5/igc-linear-graph-range';
import { IgcRadialGaugeComponent } from "igniteui-webcomponents-gauges/ES5/igc-radial-gauge-component";
import { IgcRadialGaugeModule } from "igniteui-webcomponents-gauges/ES5/igc-radial-gauge-module";
import { IgcRadialGaugeRange } from "igniteui-webcomponents-gauges/ES5/igc-radial-gauge-range";
import { SweepDirection } from "igniteui-webcomponents-core/ES5/SweepDirection";
// charts:
import { IgcFinancialChartComponent } from "igniteui-webcomponents-charts/ES5/igc-financial-chart-component";
import { IgcFinancialChartModule } from "igniteui-webcomponents-charts/ES5/igc-financial-chart-module";
import { IgcDataChartComponent } from "igniteui-webcomponents-charts/ES5/igc-data-chart-component";
import { IgcDataChartCoreModule } from "igniteui-webcomponents-charts/ES5/igc-data-chart-core-module";
// maps:
import { IgcGeographicMapComponent } from "igniteui-webcomponents-maps/ES5/igc-geographic-map-component";
import { IgcGeographicMapModule } from "igniteui-webcomponents-maps/ES5/igc-geographic-map-module";
// grids:
import { IgcLiveGridModule } from 'igniteui-webcomponents-grids/ES5/igc-live-grid-module';
import { IgcLiveGridComponent } from 'igniteui-webcomponents-grids/ES5/igc-live-grid-component';