Skip to content

Commit 6d323e6

Browse files
[jp-sync] Sync new JP docs from EN push (2026-03-23) (#6425)
1 parent bc7587c commit 6d323e6

4 files changed

Lines changed: 273 additions & 0 deletions

File tree

File renamed without changes.

jp/components/general-changelog-dv.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,20 @@ Ignite UI for Angular の各バージョンのすべての重要な変更は、
1717
1818
- [Ignite UI for Angular 変更ログ (GitHub)](https://github.com/IgniteUI/igniteui-angular/blob/master)
1919

20+
## **21.0.1 (March 2026)**
21+
22+
### バグ修正
23+
24+
| バグ番号 | コントロール | 説明 |
25+
|------------|---------|-------------|
26+
| 2189 | IgxDataChart | ラベルがない場合に DataChart が軸のレンダリングをスキップする。 |
27+
| 3055 | IgxDataPieChart | Others スライスに不足しているスタイリング プロパティを追加。 |
28+
| 38668 | IgxDataTooltipLayer | チャートの TitleTextColor を使用すると TitleTextColor が上書きされる。 |
29+
| 40238 | Excel | Excel の数式パーサーを修正 - Workbook.Load() が Excel.FormulaParseException をスローする。 |
30+
| 41167 | Excel | オブジェクトの数式がラウンドトリップされない - カメラ ツールのラウンドトリッピングの Excel サポートを追加。 |
31+
| 41419 | Excel | VBA 署名済み Excel ファイルを保存しても署名/証明書が保持されない。 |
32+
| 41594 | IgxDataChart | AssigningCategoryStyle args.GetItems が null であるか、フラグメント シリーズのアイテムの更新が機能しない。 |
33+
2034
## **21.0.0 (January 2026)**
2135

2236
### 機能拡張
Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
---
2+
title: Angular の新機能 | Ignite UI for Angular | インフラジスティックス
3+
_description: Ignite UI for Angular の新機能についての説明。
4+
_keywords: 新機能, Ignite UI for Angular, インフラジスティックス
5+
_language: ja
6+
---
7+
8+
# Ignite UI for Angular の新機能
9+
10+
このトピックでは、Ignite UI for Angular の重大な変更と古いコードを最新の API に更新する方法について説明します。
11+
12+
## チャート機能
13+
14+
このリリースでは、Data Chart、Category Chart、Financial Chart などのすべてのチャート コンポーネントに対して、新しく改善されたビジュアル デザインと構成オプションがいくつか導入されています。
15+
16+
### チャートのデフォルト デザインの変更
17+
18+
- すべてのチャートのシリーズ / マーカーに対応する新しいカラー パレット
19+
20+
例:
21+
22+
| <img class="responsive-img" src="../images/chartDefaults1.png" alt="Chart Defaults 1" /> | <img class="responsive-img" src="../images/chartDefaults2.png" alt="Chart Defaults 2" /> |
23+
| ----------------------------------------------------------------- | ----------------------------------------------------------------- |
24+
| <img class="responsive-img" src="../images/chartDefaults3.png" alt="Chart Defaults 3" /> | <img class="responsive-img" src="../images/chartDefaults4.png" alt="Chart Defaults 4" /> |
25+
26+
<div class="divider--half"></div>
27+
28+
- Bar/Column/Waterfall シリーズを角丸から四角い角に変更
29+
- Scatter High Density シリーズの最小値/最大値の密度 (headt) プロパティの色を変更
30+
- Financial/Waterfall シリーズの負の塗りつぶしビジュアルの色を変更
31+
- マーカーの太さを 1px から 2px に変更
32+
- PointSeries、BubbleSeries、ScatterSeries、PolarScatterSeries のマーカーの塗りつぶしをマーカーのアウトラインと一致するように変更
33+
- `MarkerFillMode` プロパティを Normal に設定することでこの変更を元に戻せます。
34+
- TimeXAxis および OrdinalTimeXAxis のラベリングを圧縮
35+
- 新しいマーカー プロパティ:
36+
- `MarkerFillMode` - 'MatchMarkerOutline' に設定するとマーカーがアウトラインに依存するようになります。
37+
- `MarkerFillOpacity` - 0 から 1 の値を設定できます。
38+
- `MarkerOutlineMode` - 'MatchMarkerBrush' に設定するとマーカーのアウトラインが塗りつぶしのブラシの色に依存するようになります。
39+
- 新しいシリーズ `OutlineMode` プロパティ:
40+
- シリーズ アウトラインの表示を切り替えるために設定できます。Data Chart の場合、プロパティはシリーズ上にあります。
41+
- 新しいプロット エリアの余白プロパティ:
42+
- `PlotAreaMarginLeft`
43+
- `PlotAreaMarginTop`
44+
- `PlotAreaMarginRight`
45+
- `PlotAreaMarginBottom`
46+
- [`ComputedPlotAreaMarginMode`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/enums/computedplotareamarginmode.html)
47+
- プロット エリアの余白プロパティは、チャートがデフォルトのズーム レベルにある場合にビューポートに導入されるブリード オーバー領域を定義します。一般的なユース ケースは、軸と最初/最後のデータ ポイントの間にスペースを確保することです。以下にリストされている [`ComputedPlotAreaMarginMode`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/enums/computedplotareamarginmode.html) は、マーカーが有効な場合に自動的に余白を設定します。その他は `Double` を指定して太さを表します。PlotAreaMarginLeft などはチャートの 4 辺すべてのスペースを調整します。
48+
- 新しいハイライト表示プロパティ
49+
- [`HighlightingMode`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/enums/highlightingmode.html) - ホバーされたシリーズまたはホバーされていないシリーズをフェードまたは明るくするかどうかを設定します。
50+
- `HighlightingBehavior` - マウスの位置に応じてシリーズがハイライト表示されるかどうかを設定します (直下や最近傍アイテムなど)。
51+
- 以前のリリースではハイライト表示はホバー時のフェードのみに制限されていました。
52+
- 以下のシリーズにハイライト表示を追加:
53+
- スタック
54+
- 散布図
55+
- 極座標
56+
- ラジアル
57+
- シェイプ
58+
- 以下のシリーズに注釈レイヤーを追加:
59+
- スタック
60+
- 散布図
61+
- 極座標
62+
- ラジアル
63+
- シェイプ
64+
- スタック シリーズ内の個別のスタック フラグメントのデータ ソースのオーバーライドのサポートを追加
65+
- スタック、散布図、範囲、極座標、ラジアル、シェイプ シリーズにカスタム スタイル イベントを追加
66+
- シリーズ コンテンツへの垂直ズームの自動同期のサポートを追加
67+
- 表示された初期ラベルに基づいてチャートの水平余白を自動的に拡張するサポートを追加
68+
69+
### チャート凡例の機能
70+
71+
- ItemLegend に水平方向の配置を追加
72+
- 次のチャートタイプで水平方向の ItemLegend を使用できます:
73+
- バブル
74+
- ドーナツ
75+
-
76+
- [`LegendHighlightingMode`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/enums/legendhighlightingmode.html) - 凡例アイテムにホバーしたときのシリーズのハイライト表示を有効にします。
77+
78+
### 地理マップ機能 (CTP)
79+
80+
- マップのラップアラウンド表示 (水平方向に無限スクロール) のサポートを追加
81+
- 座標原点をラップアラウンドしながら一部のマップ シリーズのシフト表示をサポート
82+
- シェイプ シリーズのハイライト表示のサポートを追加
83+
- シェイプ シリーズの一部の注釈レイヤーのサポートを追加

jp/components/style-guide.md

Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
# スタイル ガイド
2+
3+
##
4+
5+
<div class="sg-palette">
6+
<div class="sg-color-block sg-color-block--primary">
7+
<strong>Primary</strong>
8+
<span></span>
9+
</div>
10+
<div class="sg-color-block sg-color-block--secondary-1">
11+
<strong>Secondary 1</strong>
12+
<span></span>
13+
</div>
14+
<div class="sg-color-block sg-color-block--secondary-2">
15+
<strong>Secondary 2</strong>
16+
<span></span>
17+
</div>
18+
<div class="sg-color-block sg-color-block--accent">
19+
<strong>Accent </strong>
20+
<span></span>
21+
</div>
22+
<div class="sg-color-block sg-color-block--info">
23+
<strong>Info</strong>
24+
<span></span>
25+
</div>
26+
<div class="sg-color-block sg-color-block--success">
27+
<strong>Success</strong>
28+
<span></span>
29+
</div>
30+
<div class="sg-color-block sg-color-block--warning">
31+
<strong>Warning</strong>
32+
<span></span>
33+
</div>
34+
<div class="sg-color-block sg-color-block--error">
35+
<strong>Error</strong>
36+
<span></span>
37+
</div>
38+
</div>
39+
40+
## バッジ
41+
42+
<div class="sg-flex-row sg-align-i-center sg-badges">
43+
<div class="new__badge">NEW</div>
44+
<div class="updated__badge">UPDATED</div>
45+
</div>
46+
47+
## 太字、斜体、取り消し線
48+
49+
このテキストは**太字**です。
50+
このテキストは_斜体_です。
51+
このテキストは~~取り消し線~~です。
52+
53+
## 見出し
54+
55+
<div class="h1"> 見出しテキスト h1</div>
56+
<div class="h2"> 見出しテキスト h2</div>
57+
<div class="h3"> 見出しテキスト h3</div>
58+
<div class="h4"> 見出しテキスト h4</div>
59+
<div class="h5"> 見出しテキスト h5</div>
60+
<div class="h5"> 見出しテキスト h6</div>
61+
62+
## 段落
63+
64+
デフォルトでは、Markdown は二重改行で段落を追加します。
65+
単独の改行はそのまま同じ行にラップされます。
66+
1 行を区切るソフト<a href="#">リターン</a>を使用する場合は、行末に 2 つのスペースを追加します。
67+
68+
この行は末尾に段落区切りがあります (後に空行あり)。
69+
70+
この 2 行は、行末に二重スペースがないため、
71+
1 行として表示されます。
72+
73+
次の行は末尾にソフト ブレークがあります (末尾に 2 つのスペース)
74+
この行は直後の次の行に続きます。
75+
この行は末尾に段落区切りがあります (後に空行あり)。
76+
77+
## リンク
78+
79+
[jp.infragistics.com](https://jp.infragistics.com/)
80+
81+
[別のトピックへのリンク](general/getting-started.md)
82+
83+
[内部リンク](#色)
84+
85+
## ブロック引用
86+
>
87+
> <div class="h4">見出しは単独で改行されます</div>
88+
> 見出しはブロック要素であり自動的に改行されるため、
89+
行継続文字は不要です。
90+
テキスト行のみ、単一行の改行には二重スペースが必要です。
91+
92+
## 順序なしリスト
93+
94+
- アイテム 1
95+
- アイテム 2
96+
- アイテム 3
97+
98+
## 順序付きリスト
99+
100+
1. **アイテム 1**
101+
アイテム 1 は本当に重要です。
102+
2. **アイテム 2**
103+
アイテム 2 は別の意味で重要です。
104+
105+
## インライン コード
106+
107+
`x =1 to 10` のような構造化されたステートメントは、シングル バック ティックを使用してコード化できます (<a href="#"><code>structures</code></a>)。
108+
109+
## コード ブロック
110+
111+
```scss
112+
:host {
113+
::ng-deep {
114+
// comment
115+
@include splitter($custom-splitter-theme);
116+
}
117+
}
118+
```
119+
120+
## アラート
121+
>
122+
> [!WARNING]
123+
> これはメモのテキストです。
124+
> 2 行にわたっています。
125+
> [!NOTE]
126+
> 1 行の注記です。
127+
> [!IMPORTANT]
128+
> 帽子をかぶることを忘れないでください!
129+
130+
## テーブル
131+
132+
| テスト | テスト | テスト | テスト | テスト |
133+
|------|---------------------------------------------------------|------|------|------|
134+
|| テーブルメニューを使用して必要なサイズのテーブルを設定します。 ||||
135+
|| テーブルメニューを使用して必要なサイズのテーブルを設定します。 ||||
136+
|| テーブルメニューを使用して必要なサイズのテーブルを設定します。 ||||
137+
138+
139+
## ページ ページネーション
140+
141+
<ul class="pagination">
142+
<li class="page-item first disabled">
143+
<a class="page-link">最初</a>
144+
</li>
145+
<li class="page-item prev disabled">
146+
<a class="page-link">前へ</a>
147+
</li>
148+
<li class="page-item active">
149+
<a class="page-link">1</a>
150+
</li>
151+
<li class="page-item">
152+
<a class="page-link">2</a>
153+
</li>
154+
<li class="page-item">
155+
<a class="page-link">3</a>
156+
</li>
157+
<li class="page-item next">
158+
<a class="page-link">次へ</a>
159+
</li>
160+
<li class="page-item last">
161+
<a class="page-link">最後</a>
162+
</li>
163+
</ul>
164+
165+
## 詳細
166+
167+
<div class="fancy-details">
168+
<details>
169+
<summary>概要テキスト</summary>
170+
<p>このスタイルを実現するには、<code>details</code> を <code>.fancy-details</code> クラスの div でラップする必要があります。</p>
171+
</details>
172+
<details>
173+
<summary>概要テキスト</summary>
174+
<p>このスタイルを実現するには、<code>details</code> を <code>.fancy-details</code> クラスの div でラップする必要があります。</p>
175+
</details>
176+
</div>

0 commit comments

Comments
 (0)