---
schema_version: "1"
id: da835814e4f7ee042b276261b808b74bbfb7b73d4f816eaa2b8baddbeb150d9f
title: ビューの埋め込みコードの記述
collection: tableau
version: current
locale: ja-jp
portal_url: https://docs.salesforce.com/tableau/current/ja-jp/pro/desktop/embed_code.md
canonical_url: https://help.tableau.com/current/pro/desktop/ja-jp/embed_code.htm
source_site: help.tableau.com
content_type: documentation
content_hash: 641b1a2b514b86e25236c29089226a7df2f78f2c2b2d28e86205ba52bcf59f27
description: Tableau Server 2022
---
[メイン コンテンツに進む](#main-content)

# ビューの埋め込みコードの記述

> [!TIP]
> 
> Tableau Server 2022.3 以降と Tableau Cloud の埋め込みコードは、埋め込み API v3 を使用するように変更されました。埋め込み API v3 を使用してビューを埋め込む方法についての最新情報は、[埋め込み API ヘルプ](https://help.tableau.com/current/api/embedding_api/ja-jp/index.html)の「[埋め込みの基礎](https://help.tableau.com/current/api/embedding_api/ja-jp/docs/embedding_api_basic.html)」を参照してください。このトピックの情報は、埋め込みの以前のバージョン (Tableau JavaScript API v1 および v2 を使用) を対象としています。

以前のバージョンの埋め込みコードの記述

独自の埋め込みコードを作成する場合は、次の 2 つの方法のどちらかを使用できます。

- **Tableau JavaScript を使用:** この方法をお勧めします。Tableau が生成する埋め込みコードを基にして、ツールバーやタブなどを制御するオブジェクト パラメーターを追加または編集し、独自のコードを作成します。Tableau JavaScript ファイルに依存する既定の埋め込みコードは、埋め込まれた複数のビューの読み込み順序を制御する唯一の方法でもあります。
- **ビューの URL を指定:** iframe またはイメージ タグを使用してビューを埋め込みます。ここで、ソースは、ビューで \[共有\]、\[リンクのコピー\] をクリックして取得する URL です。Web サイトで JavaScript を使用できない場合は、また、URLしか指定できない場合に、この方法を使用してください。

ビューを組み込む場合、ビューを表示する幅と高さを定義することをお勧めします。そうでない場合、クライアント ブラウザーは幅と高さを任意で取得します。

**注:** 埋め込みコードで Tableau Cloud のサーバー名を指定する必要がある場合 (たとえば、JavaScript API の場所をポイントするため)、URL **https://online.tableau.com** を指定します。

## Tableau JavaScript を使用

次のコードは、パブリッシュされたビューの \[共有\] をクリックしたときに生成される埋め込みコードの例を示しています。`host_url` パラメーター内の特殊記号は URL エンコードされており、`site_root` パラメーターと `name` パラメーター内の特殊記号は HTML の数値文字参照として記述されています。

Tableau Server の例:

<script type='text/javascript' src='http://myserver/javascripts/api/viz\_v1.js'></script> 
							<div class='tableauPlaceholder' style='width:800; height:600;'> 
							<object class='tableauViz' width='800' height='600' style='display:none;'>
							<param name='host\_url' value='http%3A%2F%2Fmyserver%2F' /> 
							<param name='site\_root' value=&#47;t&#47;Sales' /> 
							<param name='name' value='MyCoSales&#47;SalesScoreCard&#47;' /> 
							<param name='tabs' value='yes' /> 
						<param name='toolbar' value='yes' /></object></div>

Tableau Cloud の例:

<script type='text/javascript' src='https://online.tableau.com/javascripts/api/viz\_v1.js'></script> 
							<div class='tableauPlaceholder' style='width:800; height:600;'> 
							<object class='tableauViz' width='800' height='600' style='display:none;'>
							<param name='host\_url' value='https%3A%2F%2Fonline.tableau.com%2F' /> 
							<param name='site\_root' value='&#47;t&#47;Sales' /> 
							<param name='name' value='MyCoSales&#47;SalesScoreCard&#47;' /> 
							<param name='tabs' value='yes' /> 
							<param name='toolbar' value='yes' />
							</object>
						</div> 

`<script>` タグのソースは、Tableau Server または Tableau Cloud の JavaScript ファイル **viz\_v1.js** の URL です。JavaScript ファイルは、ユーザーに表示されるビューの完全な URL の構成を処理します。`name` および `site_root` オブジェクト パラメーターのみが必須のパラメーターです。それ以外のすべてのパラメーターはオプションです。

## ビューの URL を指定

iframe を使用して同じビューを埋め込む例を示します。ここで、ソースは、ビューで \[共有\]、\[リンクのコピー\] をクリックして取得する URL です。

Tableau Server の例:

<iframe src="http://myserver/t/Sales/views/MyCoSales/SalesScoreCard
						?:embed=yes&:tabs=yes&:toolbar=yes" width="800" height="600"></iframe> 

Tableau Cloud の例:

<iframe src="https://online.tableau.com/t/Sales/views/MyCoSales/SalesScoreCard
						?:embed=yes&:tabs=yes&:toolbar=yes" width="800" height="600"></iframe>

`embed` URL パラメーターを指定する必要があります。ツールバーや元に戻すオプションなどを制御するパラメーターをオプションで含めることもできます。ビューの読み込み時に表示される特定のデータを制御するフィルターを URL に追加することもできます。

> [!TIP]
> 
> **ヒント**: このメソッドを使用する場合は、HTML 属性 `allowfullscreen="true"` を iframe 要素に追加し、ビューの全画面表示ボタンを有効にしてください。