円グラフ

ユーザーに、カウントされたレコード、パーセンテージ、またはレコードカテゴリの視覚的表現を提供するために、円グラフをインストールしてください。

スキルレベル: 初心者

開始前に

  • データベースリレーションシップの基礎を知っていること

  • 円グラフのほとんどのアプリケーションでは、次の2つのコレクションが必要です:

    • レコードカテゴリのコレクション(たとえば、レストランのカテゴリ、旅行のカテゴリ、書籍のカテゴリなど)またはそれに関連付けられるもの

    • それらのカテゴリに関係するレコードのコレクション(多対多が最適)(たとえば、レストラン、旅行、書籍など)

  • この機能を実装するには、有料のAdaloプランは必要ありません

手順

1.) Adaloアプリ内で、左上隅にある大きなプラス記号をクリックします

2.) 画面を下にスクロールしてマーケットプレイスセクションに移動し、マーケットプレイスを探索をクリックします

3.) リストからChart Kitを見つけ、インストールをクリックします

4.) コンポーネントリストに戻り、検索バーにPie Chartと入力し、コンポーネントを目的の画面にドラッグアンドドロップします

5.) Pie Chartセクションのドロップダウンメニューで、What is this a chart ofドロップダウンメニューの下で、チャートで表示したいコレクションを選択します(この場合、カテゴリのコレクションです)

6.) フィルタが必要な場合は、Filterドロップダウンメニューのすぐ下に追加します。たとえば、すべての旅行カテゴリを表示する代わりに、フィルタを追加して、ログインユーザーの>レストラン>レストランカテゴリのみを表示して、ユーザーが訪れたレストランのカテゴリのみを表示できます。

7.) Show value asドロップダウンメニューで、チャートキーの値をカウント、パーセンテージ、または完全に非表示にするかを選択できます。

8.) Slice Valueフィールドでは、カテゴリコレクションに関係するレコードのカウントを表示するためにマジックテキストを使用できます。たとえば、レストラン>カウントまたは旅行>カウントを選択できます。ここに値を入力することもできますが、その値はすべてのスライスに対して真になります。

9.) そのすぐ下のSlice Labelフィールドでは、直接入力してすべてのスライスにラベルを付けるか、各スライスのカテゴリ名を表示するためにマジックテキストを使用できます(推奨)。

10.) Slicesセクションのドロップダウンメニューでは、主に個人の好みに基づいて円グラフに関するさまざまなオプションを変更できます:

  • 最大スライス数 - スライダーを使用して円グラフに表示するセクションの数を選択します

  • その他のスライスラベル - フィールドに入力するか、マジックテキストを使用して「その他」スライスの名前を変更します

  • スライスの色 - ドロップダウンメニューを使用して、円グラフの色が選択した色に補完されるか、円の各スライスにカスタム色を割り当てるかを変更します

  • スライスアクション - ここでは、リスト内で行うのと同様に、パイのスライスにクリックアクションを追加できます。パイのスライスをクリックすると、そのスライスに関連するレコードデータを別の画面に送信したり、レコードを作成、更新、削除することができます。なお、「その他」スライスにはクリックアクションは利用できません。

コンポーネントがデータを引っ張るためには、コレクションにデータが必要です。これによりパイチャートが表示されます。

結果

これで、ユーザーはデータベース内のレコードを円グラフで視覚的に表示することができます。この手順のアプリのクローンキットはこちらをクリックしてください。

もっと詳しく

  • 円グラフコンポーネントを実装するさまざまな方法があります。スライスの値を表示するためにレコードをカウントする際に、円グラフに表示される内容を細かく定義するためにフィルターを追加することもできます。

  • チャートのサイズを変更するには、チャートの黄色い境界ボックスのハンドルをクリックしてドラッグします

  • より多くの機能が必要な場合は、カスタムコンポーネントをチェックしてください

ヘルプ

この記事に関する追加のヘルプが必要な場合は、いつでもコミュニティフォーラムで質問できます!投稿する際は、この記事へのリンクも貼り付けてください!

Last updated

Was this helpful?