ページ内のチャート設定方法
お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。
このページで説明する内容
さまざまな種類のインタラクティブで情報量の多いチャート（縦棒、横棒、折れ線、散布図、エリア、レーダー、円、ファネルなど）を、組織のニーズに応じて作成する手順を説明します。これらのチャートは、データ集計やフィルターなどを用いて、リアルタイムの更新や指標を表示するのに役立ちます。
1. Zoho Creator でチャートを設定する
Zoho Creator では、データを可視化するために、縦棒、横棒、折れ線、散布図、エリア、レーダー、円、ファネルなど、さまざまな種類のチャートを作成できます。チャートビルダーでは、データソースの設定、フィルターの適用、軸ラベル、配色、集計方法などのチャート固有のプロパティを設定できます。また、チャートの外観や動作をカスタマイズして、リアルタイムの指標やインサイトを効果的に表示できるようにできます。
1。1. チャート設定の流れ
1。2. 設定方法を見る
1。3. チャートを設定する手順
3. 左側のページ要素メニューからChartをクリックします。チャートギャラリーがスライド表示され、利用可能なチャートタイプと設定が表示されます。
4. チャートギャラリーからチャートをドラッグ＆ドロップします。右側からChart Configurationペインがスライド表示されます。
5. チャート上でデータを視覚化するために、フォームを選択します。
メモ: フォームを選択ドロップダウンには、現在作業しているアプリケーション内のすべてのフォームが表示されます。別のアプリケーションのフォームを選択するには、フォームドロップダウンのフッターにあるアプリを変更をクリックします。別のアプリケーションを選択し、完了をクリックすると、そのアプリケーション内のすべてのフォームが表示されます。
6. チャートの x 軸に対応付けるフィールドを選択します。選択したフィールドの値が、x 軸上の水平方向のデータポイントとして使用されます。
メモ: 日付フィールドを選択した場合は、その下に表示される日付値をグループ化ドロップダウンで選択した期間に基づいて、x 軸の値をグループ化できます。利用可能な設定は、Actual、Month & Year、Quarter & Year、Yearです。
たとえば、注文日フィールドを選択した場合、データをMonth & Yearでグループ化して、時間の経過に伴う月次売上の推移を表示できます。記録されたすべての日付値は、このMonth & Year構造にグループ化され、わかりやすく表示されます。
7. チャートの実行ビューに表示される x 軸ラベルを入力します。ここには、このフィールドに直接入力するカスタム値、または '${<pagevariable>}' 形式で呼び出す、事前定義済みのページ変数を指定できます。
8. Y 軸に表示する値の種類を選択します。
- 集計: 選択したフィールドの値の合計や、そのフィールドに値を持つデータの件数など、集計値を表示します。
- 実データ: フィールドの値をそのまま表示します。
9. チャートの y 軸に対応付けるフィールドを選択します。選択したフィールドの値が、y 軸上の指標や数値として使用されます。
メモ: 積み上げチャートを設定する場合は、Stack byの下でフィールドを選択し、y 軸上でカテゴリごとの値を積み上げて比較します。これにより、各 x 軸ポイントにおける合計値に対する各カテゴリの寄与度を可視化できます。積み上げチャートでは、値の種類は集計のみ使用できます。
10. チャートの実行ビューに表示される y 軸ラベルを入力します。ここには、このフィールドに直接入力するカスタム値、または '${<pagevariable>}' 形式で呼び出す、事前定義済みのページ変数を指定できます。
11. y 軸上の目盛りの間隔を決定するInterval値を指定します。
12. チャートの作成対象データとして、選択したフォーム内のすべてのデータを含める場合はすべてのデータを、特定の条件を満たすデータのみを使用する場合は選択したデータを選択します。
メモ:
- 初期設定では、評価対象としてすべてのデータが選択されています。
- 選択したデータを選択した場合は、データをフィルタリングする条件を設定します：フィールドを選択 > 演算子を選択 > 値を入力。さらに条件を追加するには、AND または OR を選択します。
13. データのフィルター条件の下でフィールドを選択し、チャートの実行ビューにフィルタードロップダウンを作成します。ドロップダウンには、選択したフィールドの値が一覧表示され、ユーザーが選択することでチャートの表示内容を切り替えられます。
14. Chart Controlsセクションでデータラベルを有効にし、チャートに表示される各セクションについて、y 軸の指標を常に表示するようにします。これは次のいずれかになります。
メモ:
- デフォルトではデータラベルは無効になっています。必要に応じて有効に切り替えることができます。
- データラベルが無効でも、セクションにカーソルを合わせると指標を確認できます。
15.Underlying Dataを有効にして、チャートセクションをクリックしたときに関連付けられたデータを表示します。 レポートドロップダウンを使用して、これらのデータを表示する特定のレポートを選択します。
メモ:
16.完了をクリックして設定を保存します。チャートはアプリケーションの実行モードで、設定したプロパティが反映された状態で表示されます。
メモ: 設定が完了したら、Chart Configurationペイン右上のプレビューするをクリックして、設定済みチャートをプレビューできます。
1。4. チャートにスタイルプロパティを適用する
- チャート上部のカラーバー（
）をクリックし、チャートのテーマカラー用のカラーパレットを選択します。アプリケーションのプリセットテーマカラー、プリセットカラー、またはカスタムカラーピッカーから選択できます。
- チャート上部の色付きの四角（
）をクリックし、チャートの背景色を選択します。アプリケーションのプリセットテーマカラー、プリセットカラー、またはカスタムカラーピッカーから選択できます。
ドロップダウンをクリックして凡例の位置、つまりチャートのキーを表示する位置を指定します。利用可能な設定はなし、Top（初期設定）、Right、Left、Bottomです。
2. チャートの管理
ページにチャートを追加した後は、これらのチャートを管理するための基本的な操作を行うことができます。
Chart Configuration ペイン内から:
チャートの作成に加えて、次の操作を行うことができます。
- 要素名の追加 - Chart Configurationペイン右上の鉛筆（
）アイコンをクリックして、要素名を編集します。この名前は、ページビルダー内で他の要素の中から特定の要素を探す際に使用できます。
- Chart typesの矢印（
）をクリックし、別のチャートを選択して、設定完了後に種類を変更します。チャートの種類を切り替えても、設定は保持されます。
メモ: このオプションは、チャートを最初に設定した後で、チャートの設定ペインを再度開いた場合にのみ表示されます。
チャートの設定が完了したら、
アイコンをクリックしてページビルダーに戻ります。そこから、ページ上での位置の変更、実行モードで表示されるタイトルの設定など、チャートをさらに管理できます。
ページの編集モードから:
チャートをクリックして、以下の操作を行います。
- チャートタイトルの追加 - Tアイコンをクリックして、チャートのタイトルを設定します。これは、アプリケーションの実行モードでチャートの上部に見出しとして表示されます。挿入後、チャートタイトルをクリックして、以下の設定で書式を変更できます。
- フォントファミリー - ドロップダウンから 6 種類のフォントタイプのいずれかを選択します。
- フォントサイズ - ドロップダウンから 12 ～ 40 px のサイズを選択します。初期設定値は 20px です。
- 太字 - Bアイコンをクリックしてタイトルを太字にします。
- フォントスタイル - Iアイコンをクリックしてタイトルをイタリックにします。
- フォントカラー - Aアイコンをクリックして、チャートタイトルに合う色を選択します。
- タイトルの更新 - 挿入済みのタイトルをダブルクリックして更新します。
- タイトルの削除 - チャートを選択し、再度Tアイコンをクリックして削除します。あるいは、キーボードの Delete キーを使用して要素を削除します。
- チャートの高さ調整 -
アイコンをクリックして、埋め込み要素の高さをAutoまたはカスタム長に設定します。
メモ:
- デフォルトでは、埋め込み要素の高さはAutoに設定されています。
- カスタムを選択した場合、初期設定値は150 pxで、要件に応じて変更できます。
- チャートの削除 - ゴミ箱アイコンをクリックして、ページからチャートを削除します。
- チャートの移動 - ページビルダー上でチャートをドラッグ＆ドロップして、別の位置に移動します。
- チャートのサイズ変更 - チャートの垂直方向の境界をドラッグして、要素の幅を変更します。これは、ページビルダー内で 2 つ以上のページ要素が隣り合って配置されている場合にのみ行えます。
既存のチャートを編集または設定する:
ページビルダーにすでに挿入されている対象のチャートをクリックし、設定するをクリックしてChart Configurationペインを開きます。ここからチャートの設定を編集または更新できます。