---
schema_version: "1"
id: a97066b688093a0d110e4ad6e7dfcfe64fda1612adae46309d6449aac0f793a4
title: ダッシュボードのサイズとレイアウト
collection: tableau
version: current
locale: ja-jp
portal_url: https://docs.salesforce.com/tableau/current/ja-jp/public/desktop/dashboards_organize_floatingandtiled.md
canonical_url: https://help.tableau.com/current/public/desktop/ja-jp/dashboards_organize_floatingandtiled.htm
source_site: help.tableau.com
content_type: documentation
content_hash: 35e30b3a8f69f686e691c3f8b2990d90ed87319e671c4b5d789eda3bec9ae21f
description: Size and lay out a dashboard using fixed sizing and floating or tiled layout containers.
---
[メイン コンテンツに進む](#main-content)

# ダッシュボードのサイズとレイアウト

ダッシュボードを作成したら、ユーザーにとって使いやすいようにサイズを変更したり、再整理したりすることができます。

ダッシュボード オブジェクトのスタイル オプションの詳細については、[「ダッシュボード オブジェクトの書式設定」](https://help.tableau.com/current/pro/desktop/ja-jp/Formatting_Dashboard_Objects.htm)を参照してください。

## 全体的なダッシュボード サイズのコントロール

ベスト プラクティスは、レイアウト作業が正しいサイズで開始されるように、サイズの設定から始めることです。

### ダッシュボード サイズ オプション

<table>
                    <colgroup><col style="width: 20%;">
                    <col style="width: 80%;">
                    </colgroup><tbody>
                        <tr>
                            <td style="text-align: center;vertical-align: middle;padding-left: 5px;padding-right: 5px;padding-top: 5px;padding-bottom: 5px;">
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_sizing_fixedsize.jpg" alt="コンテナのサイズを固定するためのダッシュボード設定。">
                                
                            </td>
                            <td style="text-align: center;">
                                <p style="text-align: left; vertical-align: middle"><strong>固定サイズ (既定)</strong>: 表示に使用するウィンドウのサイズに関わらず、ダッシュボードは同じサイズに保たれます。ダッシュボードがウィンドウより大きい場合、ダッシュボードはスクロールできるようになります。プリセット サイズから選択するか、カスタム サイズを指定できます。</p>
                                <p style="text-align: left;">固定サイズのダッシュボードを使用すると、オブジェクトの正確な場所とダッシュボードのコンテンツの位置を指定できるため、フローティング オブジェクトがある場合に便利です。</p>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: center;vertical-align: middle;padding-left: 5px;padding-right: 5px;padding-top: 5px;padding-bottom: 5px;">
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_sizing_range.jpg" alt="ダッシュボード コンテナのサイズの範囲。">
                                
                            </td>
                            <td style="vertical-align: middle">
                                <p><strong>範囲</strong>: 指定した最小サイズと最大サイズの間で、ダッシュボードが拡大/縮小されます。ダッシュボードの表示に使用しているウィンドウが最小サイズよりも小さい場合、スクロール バーが表示されます。最大サイズより大きい場合は、空白スペースが表示されます。</p>
                                <p>同じコンテンツと同様の形状が必要な、2 つの異なるディスプレイ サイズ (小型のブラウザー ウィンドウと中型のブラウザー ウィンドウなど) を設計する際にこの設定を使用します。範囲は、垂直レイアウトのモバイル ダッシュボードにも適しています  (モバイル デバイスの幅に合わせて幅を変更できますが、垂直スクロールの場合は高さが固定されます)。</p>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: center;vertical-align: middle;padding-left: 5px;padding-right: 5px;padding-top: 5px;padding-bottom: 5px;">
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_sizing_automatic_115x112.jpg" style="width: 115;height: 112;" alt="ウィンドウを埋めるために自動的にサイズを変更するダッシュボード設定。">
                                
                            </td>
                            <td style="vertical-align: middle">
                                <p><strong>自動</strong>:ダッシュボードのサイズが自動的に変更され、ウィンドウ全体に表示されます。</p>
                                <p>Tableau でサイズ変更を処理する際は、この設定を使用します。最適な結果を得るために、(フローティングではなく) タイル状のダッシュボード レイアウトを使用します。自動サイズ設定では、さまざまな画面で予期しない結果が生じる可能性があるため、ダッシュボードが使用される場所がわからない場合は、この設定を慎重に使用するようにしてください。</p>
                                <p>可変サイズのダッシュボードの場合は、すべてのブラウザー要求に対してレンダリングを更新する必要がありますが、パフォーマンスに影響を与える可能性があります。</p>
                            </td>
                        </tr>
                    </tbody>
                </table>

**ヒント:** Tableau Desktop を使用している場合は、 [異なるデバイス タイプのダッシュボード レイアウトの作成](https://help.tableau.com/current/public/desktop/ja-jp/dashboards_dsd_create.htm) を参照してデスクトップ コンピューター、タブレット、電話に最適化された一意のレイアウトを作成します。異なる画面サイズに合わせるだけでなく、各デバイス レイアウトは異なるアイテムを含むことができます。

### 全体的なダッシュボードのサイズの設定

- \[ダッシュボード\] ペインの \[サイズ\] で、ダッシュボードのディメンション (\[デスクトップ ブラウザー\] など) またはサイズ調整動作 (\[固定サイズ\] など) を選択します。
    
    ![デスクトップ ブラウザーの幅と高さを変更するオプション。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboard_resize1.png)

## レイアウト コンテナーを使用してアイテムをグループ化する

レイアウトコンテナーは、関連するダッシュボード アイテムを一緒にグループ化するので、すばやく配置できます。コンテナー内のアイテムのサイズと配置を変更するので、その他のコンテナー アイテムは自動的に調整されます。レイアウト コンテナーは書式設定にも使用できます。

### レイアウト コンテナーのタイプ

横レイアウト コンテナーはそこに含まれるビューやオブジェクトの幅のサイズを変更し、縦レイアウト コンテナーは高さを調節します。

<table>
                    <colgroup><col style="width: 50%;">
                    <col>
                    </colgroup><tbody>
                        <tr>
                            <td>
                                <p><b>水平レイアウト コンテナー</b>
                                </p>
                                <p>2 つのビューが、水平レイアウト コンテナーに配置されています。 <br><img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_layout_containers_horizontal.jpg" alt="水平ダッシュボード レイアウト コンテナ。"></p>
                            </td>
                            <td>
                                <p><b>垂直レイアウト コンテナー</b>
                                </p>
                                <p>3 つのビューが、垂直レイアウト コンテナーに積み上げられています。 <br><img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_layout_containers_vertical.jpg" alt="垂直ダッシュボード レイアウト コンテナ。"></p>
                            </td>
                        </tr>
                    </tbody>
                </table>

### レイアウト コンテナーの追加

1. \[ダッシュボード\] ペインの \[オブジェクト\] から \[水平\] または \[垂直\] を選択します。
2. コンテナーをダッシュボードまでドラッグします。
    
    ![ダッシュボード ペインのオブジェクト セクションで、水平オプションと垂直オプションが強調表示されています。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/layout_container1.png)
3. レイアウト コンテナーにビューやオブジェクトを追加します。
    
    ![Viz 内のレイアウト コンテナにドラッグされたオブジェクト。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/layout_container2_494x662.png)

### レイアウト コンテナーのアイテムの均等な分散

1. レイアウト コンテナーを選択します。コンテナーを選択できない場合は、コンテナー内のアイテムごとに選択し、ショートカット メニューから \[コンテナーの選択\] を選択します。
2. レイアウト コンテナーが選択された状態で、ショートカット メニューの \[均等配置\] を選択します。
    
    ![均等に分散するオプションが強調表示されたダッシュボード コンテナのコンテキスト メニュー。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboards_layout_container_evendistr.png)
    
    すでにレイアウト コンテナー内に存在するアイテムは、均等に配置され、追加したアイテムと同様に動作します。

### レイアウトコンテナーのシートを自動的にサイズ調整

関連するデータのある複数のシートをレイアウト コンテナーに追加する場合、マークが一枚のシートに選択されていれば、関連するシートを自動的にサイズ調整できます。

この例では、マップ内でマークが選択されると、棒グラフが更新されて、そのマークの利益と売上が表示されます。マップ内でマークが選択されていない場合、マップはレイアウト コンテナーを満たすように自動的に拡張されます。

<table>
                    <colgroup><col style="width: 50%;">
                    <col style="width: 50%;">
                    </colgroup><tbody>
                        <tr>
                            <td style="font-weight: bold;">マークを選択</td>
                            <td style="font-weight: bold;">マークを選択しない</td>
                        </tr>
                        <tr>
                            <td>
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/layout_container_qs4.png" alt="マップ内の選択されたマークと、選択されたマークの利益と売上を表示する棒グラフ。">
                            </td>
                            <td>
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/layout_container_qs5.png" alt="マークが選択されていないマップは、レイアウト コンテナに自動的に入力されます。">
                            </td>
                        </tr>
                    </tbody>
                </table>

1. 関連するデータを含む複数のシートをレイアウトコンテナーに追加します。
2. 展開したいシートのドロップダウンメニューから、\[フィルターとして使用\]を選択します。
    
    ![フィルターとして使用するオプションが選択されたシートのコンテキスト メニュー。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/layout_container_qs3.png)
3. \[ダッシュボード\]、\[アクション\] の順に選択し、作成したフィルターをダブルクリックします。
4. \[フィルターアクションの編集\]ダイアログボックスの \[対象シート\] セクションで、レイアウトコンテナーにある別シートを選択します。
5. ソースシートにマークが選択されていない場合に対象シートのサイズ調整方法を制御するには、次のいずれかを選択します。
    
    - \[すべての値を表示\] は対象シートを元のサイズに戻し、全データを表示します。
    - \[すべての値を除く\] は対象シートをタイトルの下に折りたたみ、全データを非表示にします。

### レイアウトコンテナーを削除して含まれるアイテムを個別に編集

1. ダッシュボードまたは、レイアウト ペインのアイテム 階層いずれかにあるコンテナーを選択します。
2. コンテナーの上のドロップダウン メニューから、コンテナーの削除を選択します。

## ダッシュボード アイテムのタイルまたはフロート

### タイル レイアウトとフローティング レイアウト

ダッシュボード上に配置する各オブジェクト、レイアウトコンテナー、およびビューは、タイル (既定) またはフローティングです。

<table>
                    <colgroup><col style="width: 50%;">
                    <col style="width: 50%;">
                    </colgroup><tbody>
                        <tr>
                            <td><b>タイル レイアウト</b>
                            </td>
                            <td><b>フローティング レイアウト</b>
                            </td>
                        </tr>
                        <tr>
                            <td>タイル アイテムは重なりあいません。単一レイヤのグリッドの一部となり、ダッシュボード全体のサイズに基づいてサイズ調整します。</td>
                            <td>フローティング アイテムは別おオブジェクトの上に重なり合います。以下の例では、マップがタイル ビューでフロートしています。</td>
                        </tr>
                        <tr>
                            <td>
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_layout_tiled.jpg" alt="タイル化されたダッシュボード レイアウト コンテナ。">
                            </td>
                            <td>
                                <img src="https://help.tableau.com/current/public/desktop/ja-jp/Img/dashboard_layout_floating.jpg" alt="フローティング ダッシュボード レイアウト コンテナ。">
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>最適な結果を得るために、固定サイズのダッシュボードで、フローティング オブジェクトおよびビューに固定サイズと位置を指定します。</td>
                        </tr>
                    </tbody>
                </table>

### 新規アイテムをフロートまたはタイル

1. ダッシュボードペインの \[オブジェクト\] で、使用したいレイアウト オプションをクリックします。 \[フローティング\] または \[タイル\]。
    
    ![タイルまたはフローティング レイアウトのメニュー オプション。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboards_organize_switch2.png)
2. ビューまたはオブジェクトを右側のダッシュボードにドラッグします。

**ヒント**:また、キーボードの **Shift** を押したままダッシュボードにドラッグする方法でも、アイテムにフローティング レイアウトを割り当てることができます。

### 既存のアイテムをタイルからフローティングに切り替え

1. ダッシュボードでアイテムを選択します。
2. アイテムのショートカット メニューで、\[フローティング\] を選択します。
    
    ![ドロップダウン メニューにフローティング オプションが表示されています。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboards_organize_switch1.png)

## 個々のダッシュボード アイテムのサイズ、位置、並べ替え、および名前の変更

### アイテムのサイズと位置の設定

配置を詳細に制御する場合は、\[固定サイズ\] を選択し、次に各アイテムのサイズと位置を \[レイアウト\] ペインを使用して設定します。

1. 位置とサイズを指定するダッシュボード アイテムを選択します。レイアウト ペインで、項目の名前は \[選択した項目\] の下に表示されます。
    
    ![選択した項目の位置を設定するレイアウト ダイアログ。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboards_organize_position.png)
    
    **ヒント:** \[ダッシュボード\] ペインと \[レイアウト\] ペインを素早く切り替えるには、\[T\] キーを押します。
2. ダッシュボードの左上隅からのオフセットとして、アイテムの位置 **x** と位置 **y** をピクセル単位で定義します。たとえば、オブジェクトをダッシュボードの左上隅に配置するには、x = 0 および y = 0 を指定します。
    
    値には、正または負の整数を入力できますが。
3. アイテムのサイズを変更するには、クリックしてダッシュボードにドラッグします。また、\[サイズ\] の設定を使用することもできます。
4. 選択したアイテムのタイトルを非表示にするには、\[タイトルを表示\] チェック ボックスをオフにします。(類似する \[ダッシュボード\] ペイン コントロールの \[ダッシュボード タイトルを表示\] チェック ボックスは、ダッシュボードのタイトル全体を制御します。)

**ヒント:** フローティング アイテムを迅速に配置するには、矢印キーを押して 1 ピクセル移動させるか、または Shift+ 矢印キーで 10 ピクセル移動させます。アイテムサイズを迅速に調整するには、\[Alt (Windows)\] または \[Option (macOS)\] を上記ショートカットに追加します。

### アイテムをグリッドに合わせる

視覚的に一致したデザインにするために、ダッシュボードのアイテムをグリッドで並べ替えおよびサイズ調整します。

![アイテムをグリッドに揃えるためのダッシュボード設定。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboard_grid.png)

1. \[ダッシュボード\] > \[グリッド表示\]。
2. グリッド サイズを変更するには、 \[ダッシュボード\] > \[グリッド オプション\]を選択します。

**ヒント:** グリッドのオンとオフを素早く切り替えるには、\[G\]キーを押します。

### オブジェクトを並べ替える

\[レイアウト\] ペインの \[アイテムの階層\] 領域では、ダッシュボードでのオブジェクトのレイヤー化とグループ化の方法をすばやく変更できます。リストの一番上にあるアイテムが前に表示され、一番下にあるアイテムが後ろに表示されます。

#### Tableau Cloud または Tableau Server でオブジェクトを並べ替える

Tableau Cloud と Tableau Server では、階層内のタイル オブジェクトと浮動オブジェクトの両方を並べ替えることができます。アイテムは現在のコンテナー内でドラッグしたり、任意のレベルの他のコンテナーにドラッグしたりすることができます。これにより、キャンバスで編集するよりも柔軟にアイテムをネストでき、オブジェクトの配置場所が最も内側のコンテナー内に制限されます。

![階層内のタイル化されたオブジェクトとフローティング オブジェクトの両方を並べ替えます。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboard_drag_hierarchy.gif)

#### Tableau Desktop で浮動オブジェクトを並べ替える

Tableau Desktopでは、階層の最上位にある浮動アイテムをドラッグして、アイテムをレイヤー化する方法を変更できます。

![ドロップダウン メニューに、タイル レイアウトを選択するオプションが表示されます。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboards_organize_layout.png)

### アイテム名の変更

ダッシュボード アイテムの区別を明確にするため、名前を変更することができます。

\[レイアウト\] ペインの \[アイテムの階層\] 領域でアイテムを右クリックし、\[ダッシュボード項目の名前変更\] を選択します。ダッシュボード自体では、このコマンドは各オブジェクトのドロップダウン メニューからも利用できます。

![ダッシュボード コンテナのコンテキスト メニュー。ダッシュボード アイテムの名前を変更するオプションが強調表示されています。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboard_rename_item.png)

## 要素の透明性との視覚的統合

透明な要素は、ダッシュボードの外観をシームレスにするため、その裏側にあるオブジェクトやイメージが表示されます。

**ヒント:** 透明な浮動要素を通して見える背景イメージを作成するには、イメージ オブジェクトを唯一のタイル アイテムとして追加します。[固定サイズのダッシュボード](#Dashboard_Size_Options)を使用すると、画面サイズに関係なく、浮動要素においてイメージとの一貫した視覚的関連性が保たれます。

![浮遊する透明な要素を通して表示されるダッシュボードの背景画像。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/dashboard_transparent_sheet.png)

### ワークシートの背景を透明にする

1. ダッシュボードでシートを選択します。
2. \[書式設定\] > \[網掛け\] を選択し、\[ワークシート\] メニューをクリックして背景色に \[なし\] を選択します。
    
    シートの表示が不透明な場合、裏側にあるダッシュボード、オブジェクト、レイアウト コンテナーの背景色を \[なし\] に変更します。これらのアイテムはダッシュボードの \[レイアウト\] タブですぐに調整できます。
3. 透明なシートをその他のダッシュボード アイテムとスムーズに統合するには、\[書式設定\] > \[枠線\] および \[書式設定\] > \[線\] を選択して枠線や線を削除するか、それらの色を変更します。

#### 透明なマップにするための追加手順

1. \[書式設定\] > \[網掛け\] を選択し、\[ペイン\] メニューをクリックして色に \[なし\] を選択します。
2. \[マップ\] > \[マップ レイヤー\] を選択し、\[ベース\] の不透明なレイヤーを選択解除します。その後、透明マップがズームアウトの際により明瞭になるようにするには、\[海岸線\] レイヤーを選択します。
    
    マップのスタイルによっては、他のレイヤーを表示または非表示にしてみる必要が生じる場合もあります。

#### シートの一部を透明にする

1. ダッシュボードの \[レイアウト\] ペインで、シートを選択します。
2. \[バックグラウンド\] の色をクリックして、色と不透明度を設定します。

### フロートは凡例、フィルター、ハイライター、およびパラメーターを透明にします

フィルター、パラメーター、およびハイライターを関連データに視覚的に接続するには、既定により透明である、これらのアイテムをフロートさせます。テキストは読みやすいように常に全体的に不透明です。

![背景が透明なフィルター ボックス。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/format_transparent_example.png)

フローティング オブジェクトが引き続き色を表示する場合は、オブジェクト レベルおよびワークシート レベルの設定を確認します。

- オブジェクトを選択し、\[レイアウト\] タブで、\[バックグラウンド\] 色を選択し、\[なし\]を選択します。
- \[書式設定する\] メニューをクリックし、次に \[凡例\]、 \[フィルター\]、\[ハイライター\]、または \[パラメーター\]を選択します。次に、左側の書式設定ペインで、 \[網掛け\] > \[なし\]を選択します。
    
    ![背景色の書式設定オプション。](/tableau/current/ja-jp/public/desktop/ja-jp/Img/format_transparent_shading.png)

詳細については、[ワークシート レベルで書式設定](https://help.tableau.com/current/public/desktop/ja-jp/formatting_worksheet.htm)を参照してください。

## このセクションの他の記事