すべてのプロダクト
Search
ドキュメントセンター

Quick BI:ページグリッド設定

最終更新日:Mar 07, 2026

Quick BI では、ページグリッド設定機能を使用して、ダッシュボード上にチャートやコントロールなどの要素をレイアウトおよび整理できます。これにより、各コンポーネントの位置とサイズをより正確かつ柔軟に調整でき、よりクリーンでプロフェッショナルなダッシュボードを作成できます。

機能概要

ページグリッド設定機能は、ダッシュボードのレイアウトをページレベルで制御します。個々のチャートの内部スタイルには影響しません。代わりに、ダッシュボードページ全体の基盤となるグリッドシステムを定義します。グリッドパラメーターを調整することで、各コンポーネントの幅、高さ、間隔をより柔軟かつ正確に設定できます。

主なメリット

  • 細かいレイアウト制御: コンポーネントの位置とサイズを正確に制御できます。ピクセル単位でのコンポーネントの配置・整列が可能です。

  • 1 行に複数のコンポーネントを配置: 売上、利益率、コストを表示する 3 つの KPI カードなど、複数のコンポーネントを 1 行に並べて均等な間隔で整列させる必要がある場合に最適です。

  • 作業効率の向上: 事前に定義されたグリッドルールにより、手動でのドラッグや整列操作が不要になり、ダッシュボードレイアウトの作成が迅速化されます。

利用シーン

  • ダッシュボードの上部エリアに、3 つの主要業績評価指標(KPI)コンポーネントを横方向に均等な幅と統一された間隔で表示したい場合。グリッド列数を増やすことで、このようなレイアウトを簡単に実現できます。

  • 限られたスペースに複数の小型チャートを密に配置したい場合。コンポーネントの単位高さと列間隔を小さくすることで、より高密度なレイアウトを作成できます。

制限事項

ページグリッド設定を効果的に使用するには、以下の制限事項にご注意ください。

  1. グローバル設定: ページグリッド設定はダッシュボードページ全体に適用されます。一度調整すると、定義された列数、単位高さ、間隔がそのダッシュボード上のすべてのコンポーネントに影響します。ページ内の異なるエリアに異なるグリッド設定を割り当てることはできません。

  2. レイアウト基盤の変更: これらの設定は、コンポーネントのサイズ変更および再配置時の最小単位を変更するものであり、各コンポーネントの正確なサイズを直接指定するものではありません。コンポーネントの最終的な寸法は、引き続きエッジをドラッグして調整します。ただし、この調整の精度はグリッド設定に依存します。

操作手順

ダッシュボードエディターのツールバーからページグリッド設定にアクセスし、構成できます。

  1. 機能へのアクセス: ダッシュボードの編集モードで、上部のツールバーに移動します。ページグリッド設定アイコン (image.png) をクリックして、設定パネルを開きます。image

  2. 設定の構成: 表示されるページグリッド設定ツールバーで、以下のパラメーターを調整します。image

    • グリッド列数

      • 目的: ダッシュボードページを水平方向に分割する、等幅の列の数を設定します。

      • 効果: 列数を多くすると、各列の幅が狭くなります。これにより、コンポーネントの幅をドラッグで調整する際の粒度が細かくなります。また、1 行に複数のコンポーネントを収容し、正確に整列させることが容易になります。

    • 列間隔

      • 目的: 隣接するグリッド列間の空白スペースを設定します。

      • 効果: この値を調整すると、横に並べたコンポーネント間の水平方向のギャップが変化します。

    • コンポーネント単位高さ

      • 目的: グリッドレイアウトにおけるコンポーネント高さの調整時の最小増分(ステップサイズ)を定義します。単位はピクセル(px)です。

      • 効果: 単位高さを小さくすると、コンポーネントの高さを垂直方向にドラッグで調整する際の粒度が細かくなります。これにより、高さをより正確に制御できます。

    • 行間隔

      • 目的: 隣接するコンポーネント間、またはコンポーネントの行間、およびコンポーネントとダッシュボードの罫線との間の固定された垂直方向のギャップを設定します。

      • 効果: この値を調整すると、積み上げられたコンポーネント間の垂直方向のギャップが変化します。これにより、ページ全体の垂直方向の密度が影響を受けます。

  3. 設定の保存: 構成が完了したら、[保存] をクリックします。その後、ダッシュボードキャンバス上でコンポーネントのエッジをドラッグして、新しいグリッド設定に従ってサイズ変更できます。

よくある質問

1. コンポーネントの高さをより正確に制御したいのですが、どの設定を変更すればよいですか?

回答: コンポーネント単位高さを調整してください。デフォルトの 10 px の代わりに、5 px などの小さい値に設定します。これにより、コンポーネントの下端をドラッグするたびに、高さがより小さなステップで変化し、高さの微調整が可能になります。

2. ページグリッド設定は新しく追加したコンポーネントにのみ適用されるのでしょうか?それともダッシュボード全体に適用されるのでしょうか?

回答: ページグリッド設定はグローバルです。ダッシュボードページ全体のレイアウトグリッドに影響します。一度変更すると、そのダッシュボード上の既存および今後追加されるすべてのコンポーネントに適用され、幅、高さ、間隔の調整精度にも影響します。

3. 「グリッド列数」を変更するとどうなりますか?多い方が常に良いのでしょうか?

回答: グリッド列数は、コンポーネントの幅をどの程度正確に調整できるかを制御します。列数を増やすと、コンポーネントをより狭くでき、1 行に多くのコンポーネントを収容しながらも相対的な幅を厳密に制御できます。ただし、常に多い方が良いわけではありません。列数が多すぎると、ドラッグによる調整が過敏になりすぎることがあります。レイアウトのニーズに最も適した列数を選択してください。