2020J v2の新機能
〈FlexGrid〉カスタムエディタ
Wijmoの入力コントロール(InputDate、InputTime、InputDateTime、InputNumber、ComboBox、AutoComplete、InputColor)を使用してセルのデータを編集できるようになります。列のプロパティによりシンプルにエディタとして使用する入力コントロールを設定できます。
〈FlexGrid〉チェックボックス/ラジオボタンのタグを改善
チェックボックスやラジオボタンのタグの構造を改善して、カスタムスタイルを適用しやすくなります。従来のバージョンでは、チェックボックスやラジオボタンには<span>タグがありませんでしたが、2020J v2では<span>タグが追加され、簡単にチェックボックスやラジオボタンのスタイルをカスタマイズできます。
〈FlexChart〉WebGLによるパフォーマンス向上
WebGLに対応することでチャートの描画パフォーマンスが向上します。従来のバージョンでは、チャートの点や線はすべてSVG要素として描画されていましたがデータが多くなると描画が非常に遅くなっていました。2020J v2ではWebGLで描画することで高速化できます。
〈Input〉検証エラー時のフォーカス移動を禁止
不正な値が入力されたときに、エラーメッセージを表示して他の要素へのフォーカス移動を禁止できるようになります。従来のバージョンでは、不正な値を入力すると、自動的に前回の値や正常な範囲の値に戻されていました。2020J v2では、不正な値を入力したときに不正な値が入力されたままにして、エラーメッセージを表示してフォーカス移動を禁止することができます。
〈Input〉ラベル付き入力フォーム
Angular Materialのように、入力コントロールの状況に応じて変化するラベルを表示できるようになります。
〈Popup〉ウィンドウ外部への移動を禁止
ドラッグ時およびリサイズ時にポップアップの位置やサイズを制御して、ウィンドウ外部への移動を禁止できるようになります。
〈Popup、Tooltip〉表示位置
ポップアップとツールチップの表示位置を指定できるようになります。従来のバージョンでは、ポップアップとツールチップは対象となる要素の下にしか表示できませんでしたが、2020J v2では上下左右の位置に表示できます。
〈PDF〉PDFのセキュリティ
以下のセキュリティを設定できます。
- 文書を開くパスワード(ユーザーパスワード)
- 権限パスワード(オーナーパスワード)
- PDFのバージョン
- 文書の制限(印刷、文書の変更、注釈、フォームフィールドの入力と署名、文書アセンブリ、内容のコピー、アクセシビリティを有効にする
〈MultiRow〉行ヘッダーのレイアウト〈Enterprise限定機能〉
行ヘッダーにテキストや値を表示して、そのレイアウトを設定できるようになります。従来のバージョンでは、行ヘッダーにテキストを表示するには、カスタムセル描画機能を使用するか、列を固定してヘッダースタイルで表示してクリックイベントで行を選択する必要がありました。2020J v2では、列のisRowHeaderプロパティをtrueに設定するとその列を行ヘッダーとして表示できます。
〈MultiRow〉任意の位置のセルを縦に結合〈Enterprise限定機能〉
任意の位置のセルを縦に結合できるようになります。従来のバージョンでは、横に結合しているセルがない場合のみ縦に結合することができました。2020J v2では、任意の位置のセルを縦に結合できるようになり横と縦の結合が複雑に入り混じったレイアウトで表示できます。
新しいコントロール(転置複数行グリッド)〈Enterprise限定機能〉
転置複数行グリッドコントロールが追加され、複数行グリッドの行と列を入れ替えて(転置して)表示できるようになります。通常の複数行グリッドでは、行が縦方向に/列が横方向に並んで表示され、1レコードが複数行で表示されます。転置複数行グリッドでは、行が横方向に/列が縦方向に並んで表示され、1レコードが複数列で表示されます。
新しいコントロール(アコーディオン)
アコーディオンはパネルを折りたたんだり展開して表示することができるコントロールです。現在使用している情報以外を隠すことで限られたスペースを有効活用したり、不要な情報を隠して必要な情報だけに集中したりすることができます。
新しいコントロール(バーコード)
QRコード、GS1-128(コンビニバーコード)など、26種類のバーコードを表示できるようになります。バーコードはCanvasまたはSVGで描画できます。
タッチデバイスでドラッグ&ドロップ
タッチデバイスでドラッグ&ドロップ操作ができるようになります。従来のバージョンでは、FlexGridの列の並べ替え、グループパネルでの列のグループ化、PivotPanelのフィールドの選択などのドラッグ&ドロップ操作は、マウスでしか操作できませんでした。2020J v2では、@grapecity/wijmo.touchモジュールが追加され、タッチデバイスでもこれらのドラッグ&ドロップ操作ができるようになりました。
新しい数値書式
新しい数値書式に対応します。従来のバージョンで対応していたfとg書式では桁区切り(カンマ)は出力されませんでした。2020J v2では、FとG書式で桁区切りを出力できます。
クラウドサービスとの連携
以下のクラウドサービスとの連携に対応します。
- Googleスプレッドシートとデータ連結
- Cloud Firestoreとデータ連結
- Cloud Firestoreとリアルタイムデータ連結
Googleスプレッドシートとデータ連結
Googleスプレッドシートとデータ連結します。
Cloud Firestoreとデータ連結
Cloud Firestore(FirebaseのNoSQLデータベース)とデータ連結します。
Cloud Firestoreとリアルタイムデータ連結
Cloud Firestore(FirebaseのNoSQLデータベース)のデータをリアルタイムで更新します。一方のサンプルでデータを更新すると、もう一方のデータがリアルタイムで更新されることが確認できます。
Angular
Angularの最新バージョン「Angular 10」に対応します。
Vue.js
Vue.jsの最新バージョン「Vue.js 3.0」に対応します。
新しいサンプル
デモに実用例サンプルを追加しました。