DataV:ワードクラウドにクエリ結果を表示する

チャートスタイル

ワードクラウドを使用すると、テキストの内容、色、描画形状をカスタマイズできます。 重み値に基づいて複数の色とマップテキストサイズを設定できます。 これにより、ダッシュボードに大量のテキストをワードクラウドの形式で表示できます。

スタイルパネル

• 検索設定: スタイルパネルの右上隅にある検索設定項目アイコンをクリックします。 [検索設定] パネルで、検索する設定項目の名前を入力し、設定項目を検索します。 あいまい一致はサポートされていません。 詳細については、「設定項目の検索」をご参照ください。

  • Size: ウィジェットの幅と高さ。 単位: ピクセル。

  • ポジショニング: コンポーネントのx軸とy軸。 単位: ピクセル。 X座標は、ウィジェットの左上隅とキャンバスの左枠の間のピクセル距離を示します。 Y座標は、ウィジェットの左上隅とキャンバスの上枠の間のピクセル距離を示します。

  • 回転: ウィジェットはウィジェットの中心を中心に回転します。 単位は度で、

    • 回転角度スピンボックスに角度を直接入力するか、プラス記号 ([+]) またはマイナス記号 ([-]) をクリックして、回転角度スピンボックスの値を増減します。

    • アイコンをクリックして、ウィジェットスタイルを反転します。

    • アイコンをクリックして、ウィジェットスタイルを反転します。

  • Opacity: 有効な値: 0〜1。 このパラメーターが0に設定されている場合、ウィジェットは非表示になります。 このパラメーターが1に設定されている場合、ウィジェットは完全に表示されます。 デフォルト値: 1

• グラフィック

  メトリクス	説明
  チャートマージン	アイコンをクリックして、チャートの余白の表示を制御します。 スイッチをオンにすると、ワードクラウドエリアとウィジェットの4つの境界の間の距離を設定できます。 単位: デフォルトでpx。
  形状	イメージシェイプに均等に表示されるエントリのスタイルを設定します。 有効な値: Ellipse、Rectangle、Custom。 説明 [カスタム] を選択した場合、[グラフィックス] 設定項目で画像のURLまたはbase64をカスタマイズできます。 ワードクラウド内のワードは、画像の暗い部分のみをレンダリングする。 白い部分などの明るい色の部分はレンダリングされません。 画像のURLを使用する場合、画像のサイズは大きすぎてはいけません。 そうしないと、イメージの読み込みに時間がかかります。
  カラー	ワードクラウド内の単語の色の詳細については、「カラーマッパーの説明」をご参照ください。
  ワードスタイル	フォントスタイル、フォントの太さ、最小フォントサイズ、最大フォントサイズ、単語距離コンポーネントのマージン、および単語の位置を変更しないかどうかを含む、単語のスタイル。

• アニメーション: クラウドという言葉のアニメーション効果。

  メトリクス	説明
  アニメーションスイッチ	スイッチをオンにして、ワードクラウドのアニメーション効果を設定します。
  アニメーション	アニメーションのタイプ。 このシステムは、ズームやフェードなど、さまざまな一般的なアニメーション効果を提供します。 アニメーションをオンにした後にのみ設定できます。
  アニメーション期間	ウィジェットのアニメーション効果の持続時間。 単位：ms。 この値は、アニメーションスイッチをオンにした後にのみ設定できます。

• Interactive: クラウドウィジェットという言葉のインタラクティブな効果。

  • ダイアログボックス: プレビューページまたは公開ページでポインタを移動したり単語をクリックしたりしたときに表示されるダイアログボックスのスタイル。 アイコンをクリックして、ダイアログボックスをオンまたはオフにします。

    メトリクス	説明
    モード	ダイアログボックスのチャートモード (オプション) (简洁および一般を含む) 。
    トリガー	ダイアログボックスがトリガーされるメソッド。 有効な値: [ホバー] および [クリック] 。
    タイトルの間隔	ダイアログボックス内のタイトルと他のコンテンツの間の距離。 単位: ピクセル
    ダイアログボックスのタイトル	ダイアログボックスは、タイトルのテキストコンテンツです。 アイコンをクリックして、ダイアログボックスのタイトルスタイルをオンまたはオフにします。
    タイトルスタイル	ダイアログボックス内のタイトルのスタイル (フォントスタイル、テキストの太さ、フォントサイズ、タイトルの色など) 。
    コンテンツ表示	右側のまたはアイコンをクリックして、ダイアログボックスのコンテンツシリーズを追加または削除します。 またはアイコンをクリックして、複数のダイアログボックスのコンテンツ表示シリーズの配置スタイルを設定します。 アイコンをクリックして、現在のダイアログボックスのコンテンツ表示シリーズ設定をコピーし、同じ設定のダイアログボックスのコンテンツ表示シリーズを追加します。 フィールド名: ダイアログボックス内のフィールドの名前。 名前はデータパネルのフィールドと一致する必要があります。 表示名: ダイアログボックスのコンテンツの表示名。 プレフィックス: ダイアログボックスの内容のプレフィックスとサフィックス。
    数値形式	値フィールドに有効な数値形式を選択します。 詳細については、「データ表示形式」をご参照ください。
    コンテンツの間隔	ダイアログボックス内のコンテンツ間の距離。
    コンテンツテキスト	ダイアログボックス内のコンテンツテキストのスタイル (フォントスタイル、テキストの太さ、フォントサイズ、色など) 。
    ポップアップ背景	ダイアログボックスのポップアップ背景スタイル。 背景余白: ポップアップ背景の水平および垂直の余白をダイアログボックスに表示します。 背景色: ダイアログボックスの背景色。 枠のスタイル: 枠線の種類、角の丸めサイズ、線幅サイズ、枠線の色など、枠線のスタイルをダイアログボックスに表示します。

  • 選択された状態: 選択された状態。 アイコンをクリックすると、選択した状態を有効または無効にできます。

    メトリクス	説明
    トリガー	選択した単語のトリガーモード。 次のいずれかのオプションを選択できます。[移動] および [クリック] 。
    メソッドの選択	単語を選択するために使用されるメソッド。 [単一選択] または [複数選択] を選択できます。
    ワードカラー	選択した単語の色。 アイコンをクリックして、単語の色のスタイルをオンまたはオフにします。
    ワードストローク	ストロークラインのタイプ、ラインの太さ、およびストロークラインの色を含む、ストロークラインのスタイル。 説明 線の種類が点線または点線として選択されている場合、線の切れ目の長さの値と各切れ目の間の距離も設定できます。

• 凡例: ワードクラウドの凡例スタイル。

  メトリクス	説明
  凡例スイッチ	スイッチをオンにすると、凡例のスタイルを設定できます。 スイッチをオフにすると、凡例スタイルを設定できません。
  凡例の位置	ウィジェットの開始座標に対する凡例の相対位置。 有効な値: Top Left、Top Center、Top Right、Bottom Left、Bottom Center、Bottom Right、Left Top、Left Center、Left Bottom、Right Top、Right Center、Right Bottom。
  テキストスタイル	凡例テキストのフォントスタイル、テキストの太さ、フォントサイズ、色。
  チャート間隔	凡例とグラフの水平方向と垂直方向の間隔を設定します。
  カテゴリの凡例	サブタイプの凡例のスタイル。 凡例マーカー: 凡例マーカーのサイズと形状。 凡例の間隔: 異なるカテゴリの凡例間の水平方向と垂直方向の距離。 最大幅: 凡例の最大幅。 単位: ピクセル。 ページ反転許可: スイッチをオンにすると、凡例のページ番号スタイルと矢印スタイルが有効になります。 スイッチをオフにすると、凡例のコンテンツが1ページに表示され、反転できません。 最大行数: 凡例に表示できる行の最大数。 行の最大数を超えると、凡例がページングされます。 スタイル: ページ番号のフォント、太さ、フォントサイズ、色など、ページ番号のスタイル。 矢印スタイル: ページめくりスタイルの矢印のサイズ、デフォルトの色、および無効な色。

• 条件: データ条件シリーズの説明。

  データ条件シリーズ: またはアイコンをクリックして、条件スタイルを追加または削除します。 またはアイコンをクリックして、複数の条件付きスタイルの配置スタイルを設定します。 アイコンをクリックして、選択した条件スタイル設定をコピーし、条件スタイルを追加します。 詳細については、「条件ツリーの使用状況」をご参照ください。

  グラフの色: スイッチをオンにすると、指定した条件スタイルで単語の色を設定できません。 スイッチをオフにすると、指定した条件スタイルで単語の色を設定できません。

[データソース] パネル

高度なパネル

Blueprintインタラクション

1. 左上隅のアイコンをクリックして、ブループリントページに移動します。

2. [レイヤーノード] タブで、ウィジェットをメインキャンバスに追加します。

3. ブループリント設定パラメータを表示します。

   • イベント

     イベント	説明
     データインターフェイス要求が完了したとき	イベントは、データインターフェイス要求が応答され、フィルターによって処理された後、処理されたJSONデータでトリガーされます。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データソース] タブの [データ応答結果] セクションをご参照ください。
     データ項目が選択されている場合	ワードクラウド内の単語がクリックされたときに発生するイベント。 イベントはまた、単語に対応するデータ項目を発生させる。 詳細については、サンプルデータをご参照ください。 { "name": "Arabian Nights", "value": "7.8", "colorField": "Popular" }
     凡例がクリックされたとき	単語クラウドの凡例がクリックされたときに発生するイベントで、単語に対応するデータ項目も発生します。 詳細については、データ例をご参照ください。 { "value": "A popular movie", "checked": true // Specifies whether to check the value. The value is true or false. }

   • Action

     Action	説明
     データのインポート	ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。 サーバーデータを再度リクエストする必要はありません。 詳細については、データ例をご参照ください。 [ { "name": "Arabian Nights", "value": "7.8", "colorField": "Popular" } ]
     要求データインタフェース	このアクションは、サーバーデータを再度要求するために実行されます。 アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。 たとえば、APIデータソースがhttps:// api.testで、リクエストデータインターフェイスに渡されるデータが { id: '1'} の場合、最終的なリクエストインターフェイスはhttps:// api.test?id=1です。
     ハイライト	data: 強調表示されるデータ項目。 シングルハイライト { 'name': 'Cat and Mouse 1992 Movie Edition' } バルクハイライト [ { 'name': 'Taibai Mountains' }, { 'value': 8.4 } ] style: スタイルを選択します。 fillStyle、ストローク、不透明度など。 ハイライトスタイルを指定しない場合は、デフォルトのスタイルが使用されます。 参照データの例 { "data": { "name": data.name }, "style": { "fillStyle": "#fff" } }
     選択のリセット	リセットコンポーネントの選択項目データを消去します。 パラメータは必要ありません。
     移動	ウィジェットを指定した場所に移動します。 詳細については、データ例をご参照ください。 { // The positioning type. to indicates absolute positioning, whereas by indicates relative positioning. The default value is to. "positionType": "to", // The location, which is indicated by the x and y coordinates. "attr": { "x": 0, "y": 0 }, // The animation type. "animation": { "enable": false, // The animation delay. Unit: milliseconds. "animationDuration": 1000, // The animation curve, which can be set to linear|easeInOutQuad|easeInOutExpo. "animationEasing": "linear" } }
     スイッチショー /ショー	ウィジェットを表示するか非表示にするかを指定します。 パラメータは必要ありません。
     表示	ウィジェットを表示します。 詳細については、「データ例」をご参照ください。 { "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     非表示	コンポーネントを非表示にします。 詳細については、「データ例」をご参照ください。 { "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     コンポーネント設定の更新	ウィジェットのスタイル設定は動的に更新されます。 スタイルパネルで、[設定をクリップボードにコピー] をクリックしてウィジェットの設定データを取得します。 その後、Blueprint Editorでデータ処理ノードのスタイルフィールドを変更します。