Released: Feb 19, 2025

2024J v2.1（5.20242.30版） での更新項目

機能

対応環境

• TypeScript 2(2.9.2)／3(3.0.0、3.1.2、3.9.9)／4(4.0.2-4.0.7、4.3.2、4.7、4.8、4.9)／5(5.2.2、5.4)
• Angular 17／18
• React 16／17／18／19
• Vue.js 3
• Next.js 14
• Nuxt.js 3

機能の追加

• FlexChart
  • 凡例の方向（垂直または水平）を取得できるisVerticalプロパティを追加しました。
• FlexGrid
  • placeholderプロパティが追加され、プレースフォルダーに任意のテキストを設定できるようになりました。
  • FlexGridのセルのスタイルを簡単に設定できるwijmo.grid.styleモジュールを追加しました。
• FlexGridFilter
  • showIncludeSelectionプロパティが追加され、条件フィルタのダイアログ上に「現在の選択範囲をフィルターに追加する」のメニューが追加されました。
• InputDate
  • preserveCalendarNavigationプロパティが追加され、ドロップダウンカレンダーから別の月を選択した後、選択日は変更せずにドロップダウンを閉じて、再度ドロップダウンを開いた時に、現在選択されている月を表示できるようになりました。
  • ODataCollectionView、ODataVirtualCollectionView
  • ODataCollectionViewおよびODataVirtualCollectionViewでサーバーサイドでのグループピングがサポートされました。
• React
  • React 19 のサポートが追加されました。- refsのクリーンアップ関数機能はサポートされていません。

機能の改善

• FlexChart
  • axisクラスのlogBaseプロパティを利用して、軸を対数軸で表示できるようになりました。
    • 対数軸上の罫線は、minorTickMarksプロパティやminorGridプロパティで表現することができます。
  • 凡例の方向が水平に設定されている場合に、スクロールバーは垂直ではなく水平に表示されるように修正されました。
• FlexGrid
  • アクセシビリティの改善のため、データセルパネルから非表示の列ヘッダー行を削除しました。これにより、いくつかの仕様変更が発生します。詳細は仕様変更セクションをご確認下さい。
  • グリッド上に存在する行と列の合計数に関する情報を提供するために、aria-rowcount属性とaria-colcount属性が追加されました。
• FlexGridFilter
  • FlexGridFilterの昇順または降順ボタンがアクティブな場合、ariaLabelにactive属性が付与されるようになりました。
  • ValueFilterEditor内のListBoxにariaLabel属性が追加されました。
• MultiRow
  • aggregateプロパティを利用して、フッター行に集計値を表示できるようになりました。

仕様変更

• Calendar
  • 今日の日付がminプロパティもしくはmaxプロパティの範囲外の場合、今日の日付を示すボタンは無効化されました。
• FlexChart
  • 凡例の方向が水平に設定されている場合、スクロールバーは水平方向に表示されるように改善されました。
    • 従来の動作では、凡例の方向が水平の場合も、スクロールバーは垂直に表示されていました。
• FlexGrid
  • アクセシビリティ改善のため、データセルパネルから非表示の列ヘッダー行を削除しました。これにより、次の仕様変更が発生します。
    •  行の要素を直接DOMから取得した場合（セレクタ例：[wj-part="cells"] .wj-row）、ゼロベースのインデックスを使用して行を指定する必要があります。
       //DOMから直接行の要素を取得します。
       let rows = document.querySelectorAll('[wj-part="cells"] .wj-row');
       // データセルの1列目1行目を参照する場合
       // 従来のバージョンでは、非表示になっていた非表示の列ヘッダー行を考慮して、インデックス1（rows[1]）を指定する必要がありました。
       //console.log("First cell element (1, 0): ", rows[1].children[0]);
       // 本バージョンからは、非表示の列ヘッダー行が削除されたためゼロベースインデックス（rows[0]）を利用します。
       console.log("First cell element (0, 0): ", rows[0].children[0]);
    • FlexGridのhostElementにロール「grid」または「treegrid」とariaLabel（プロパティから設定している時）が常に設定されます。
    • columnHeader、rowHeader、topLeftパネルのセルは、headersFocusabilityの値に関係なく、アクセシビリティツリーに公開されます。
    • rowHeaderPathが設定されている場合、columnHeader行に非表示のセルが追加されます。
• FlexGrid、TreeGrid
  • childItemsPathプロパティに値を再割り当てした時、アクティブなセルの選択のみが保持されるようになりました。
    • 従来の動作では、 アクティブセルが最上位のGroupRowにある時のみ、childItemsPathが再割り当てされると、選択されているすべてのセルの選択が保持されていました。
    • ただし、アクティブセルが GroupRowの他のレベルにある場合は、現在の動作のようにアクティブなセルの選択のみ保持されました。
• InputDate、InputDateRange
  • InputDateRange（InputDateはselectionModeモードがRangeの時）では、rangeEndがnullもしくはmin/maxの範囲外の値が入力された時、invalidInputイベントが発生するようになりました。
    • ここで、invalidInputイベントのe.cancelをtrueにした場合、フォーカスはコントロールに残ります。また、ドロップダウンカレンダーが開いている場合は、範囲内のrangeEndが選択されるまでドロップダウンカレンダーは開いたままになります。
    • 従来の動作では、rangeEndが空白のままで、invalidInputイベントのe.cancel=trueの場合、rangeEndは自動的に範囲の開始値に設定され、ドロップダウンは閉じられました。

不具合の修正

• Calendar
  • handleWheelプロパティとmonthCountプロパティを同時に設定すると画面がフリーズする
• ColorPicker
  • 透明度のスライドバーにチェック柄が表示されない
• FlexChart
  • 第1軸がStacked100pcの場合、第2軸側のY軸のmin／maxプロパティが反映されない
  • 動的なグラフを再描画した後に、グラフにマウスオーバーするとスクリプトエラーが発生する
  • htmlTextとscrollbarをtrueにした状態で凡例の数が多くなると凡例のラベルが表示されない
• FlexGrid
  • 列のstateをset関数から動的に変更しても、グリッドの列が変更した順で表示されない
  • セルが編集モードになっている状態でブラウザの戻るボタンを押下するとスクリプトエラーが発生する
  • 任意の行を選択した状態でselectedRowsをflatMapでindexを参照すると、indexの値が不正になる
  • 連続しない行を選択するとselectionChangedイベントのCellRangeEventArgsのrow、colの情報が正しく取得されない
  • 特定のUI操作やブラウザのリサイズ等を行った場合に「Blocked aria-hidden on an element」のエラーが表示される
• FlexSheet
  • yyyyMMの書式を設定しても、セルに設定した書式で表示されない
  • TableStyleのheaderRowStyle.classNameプロパティにCSSを設定してもスタイルが反映されない
• Nuxt.js
  • styleブロックでスタイルファイルをインポートしている場合、cssに改行が含まれているとアプリがビルドできない
• その他
  • Angular 16はフレームワークのサポート終了とあわせて、サポート対象外となりました