タグクラウドウィジェット
タグクラウドウィジェットにより、タグの使用状況を視覚化できます。タグの使用頻度が高いほど、クラウド内で大きく表示されます。タグクラウドウィジェットでは使用状況の計算は行われません。タグの使用状況はサーバー上で計算されます。有効にするには、タグクラウドに 2 列のデータセット ['タグのラベル', 'タグの数'] が必要です。タグの数に基づいてタグのラベルがレンダリングされます。
タグクラウドには以下のオプションが用意されています。
• レンダリングされるタグに固定スタイルを適用するか (すべてのタグを赤色、斜体で表示するなど)、状態定義に基づいてスタイル設定できます。
• クリック/選択したタグにスタイルを適用できます。
• バインド可能なクリックイベントを使用できます。ユーザーがタグをクリックするか、データセットの選択行が更新されたときに、クリックイベントが送信されます。
• ユーザーがタグをクリックするか、データセットの選択行が更新されると、タグクラウドは、バインド可能な SelectedTag プロパティを、一致するタグに設定します。
• 最も使用頻度の高いタグのレンダリングの大きさ (CSS の em の長さ) を指定できます。
• タグクラウドデータセット内の任意の列に基づいて、各タグのツールヒントを表示できます。
• タグクラウドは、本質的には、バインド先のデータセットの選択行の更新イベントを受信します。したがって、タグクラウド内で明示的な操作を行わなくても、SelectedTag プロパティを更新および再レンダリング (SelectedTagStyle が定義されている場合) できます。
詳細については、次のビデオチュートリアルを参照してください。
プロパティ
一般的なウィジェットのプロパティについては、
ウィジェットを参照してください。次の表は、タグクラウドウィジェットに固有のプロパティの説明を示しています。
プロパティ名 | 説明 | ベースタイプ | デフォルト値 | バインド可能か(Y/N) | ローカライズ可能か(Y/N) |
---|
CustomClass | ウィジェットの最上位の div に適用するユーザー定義の CSS クラス。スペースで区切って、複数のクラスを入力できます。 | STRING | 該当なし | Y | N |
Data | ウィジェットにバインドされるタグデータ。 | INFOTABLE | 該当なし | Y | N |
MaxFontSize | クラウドの最大タグのサイズ (CSS の em の長さ)。その他のタグはすべてこのサイズ以下にスケール変更されます。 | NUMBER | 4 | N | N |
DisplayToolTip | 各タグリンク上にツールヒントを表示できるようにします。 | BOOLEAN | false | N | N |
ToolTipField | DisplayToolTip が選択されている (true) の場合にツールヒントの値を表すインフォテーブルフィールド。Data プロパティをバインドする必要があります。 | FIELDNAME | 数 | N | N |
TagStateStyle | フォーマットされた状態または指定されたスタイルに基づいて、レンダリングされるタグのスタイルを設定します。 デフォルトでは、タグクラウドはタグリンクの数に基づいてタグリンクをスタイル設定します (数が大きいほど、フォントも大きくなります)。各タグの別のデータ値 (状態のフォーマット) に基づいてタグリンクにスタイルを適用するか、タグ全体にわたってスタイルを適用できます。たとえば、状態フォーマッタをタグクラウドデータに適用することで、数が 40 より大きいリンクには赤色と太字のフォーマットを設定し、数が 40 より小さいリンクには黒色と斜体のフォーマットを設定します。 | STATEFORMATTING | 該当なし | N | N |
TagNameField | タグの値を表すインフォテーブルフィールド。Data プロパティをバインドする必要があります。 | FIELDNAME | 該当なし | N | N |
TagCountField | タグの数を表すインフォテーブルフィールド。Data プロパティをバインドする必要があります。 | FIELDNAME | 該当なし | N | N |
Title | タグクラウドのタイトル。 | STRING | 該当なし | Y | Y |
イベント
DoubleClicked
• バインド可能です。
• タグを 1 回クリックしたときに、データサービスの選択行から SelectedTag を検出できます。DoubleClicked イベントを使用して別のサービスを起動できます (ダブルクリックをナビケーションリンクのトリガとリンクするなど)。
• SelectedTagStyle プロパティが定義されている場合、クリックされたタグは選択に応じてスタイル設定されます。これまでにクリック/スタイル設定したタグはすべてリセットされます。
• バインドされたデータの選択行オブジェクトは、現在選択/クリックされているタグクラウドリンクのインデックスに更新されます。
本質的には、タグクラウドはバインド先のデータの選択行オブジェクトの更新を受信します。選択行が (別のウィジェットまたはデータ操作によって) 更新されると、以下の操作が行われます。
• タグクラウド SelectedTag が、タグクラウド TagNameField で指定されている選択行のデータ値に設定されます。
• SelectedTagStyle プロパティが定義されている場合は、SelectedRow タグがそれに応じてスタイル設定されます。これまでにクリック/スタイル設定したタグはすべてリセットされます。
• 更新された選択行がタグクラウドによって表示されない値である場合は、以下の操作が行われます。
これまでにクリック/スタイル設定したタグはすべてリセットされます。
SelectedTag がクリアされます。
• タグクラウドは複数選択をサポートしていません。選択行オブジェクトからの更新の処理においては、選択行オブジェクトの最初のインデックスのみが処理されます。