8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Salesforce画面へのTableau表示

Posted at

概要

Tableauで作成したワークブックやダッシュボードをSalesforceの画面で表示することができます。
今回実施するやり方は、TableauシートのURLをVisualforceに埋め込み、そのVFをLightningレイアウトに追加するという方法です。

完成図

完成すると以下のようにTableauのシートがSalesforceの画面に表示されます。
以下の例では、何かしらのデータを都道府県別にバブル表示したTableauレポートをSalesforceのホーム画面に埋め込んでいます。
もちろん取引先や商談の画面に埋め込むこともできます。
TableauHome.PNG

手順

全体の手順は以下のような感じです。

  1. Tableauでワークブックを作成
  2. 作成したシートやダッシュボードの共有URLを取得
  3. Visualforceページを作成して、iframeタグに共有URLをセットする
  4. Lightningページに、作成したVisualforceページを埋め込む

では早速やっていきましょう。
まずはTableauにログインしてワークブックを作成します。
tab1.PNG
出来上がったものが以下になります。右上の共有ボタンを押して共有URLを取得しましょう。
tab2.PNG
今回必要なのは「リンク」のほうです。コピーしておきます。
tab3.PNG
次にSalesforceにて以下のようなVisualforceを作成します。

TEST_Tableau.page
<apex:page >
  <apex:iframe src="先ほどコピーした共有URL"/>
</apex:page>

あとは作成したVFページをLightningレイアウトに埋め込むだけです。
今回はホーム画面に追加します。
Lightningレイアウトの編集画面でコンポーネント一覧からVisualforceをドラッグアンドドロップして先ほど作成したページを選択します。
ここで表示する枠の高さも指定できるのでTableauレポートに合わせて指定します。
tab4.PNG
ホーム画面を表示してTableauにログインすると、以下のようにTableauレポートが表示されました。
tab5.PNG
以上!!TableauレポートのSalesforce画面への表示手順でした。
今回は単純に表示するだけでしたが、Tableauのフィルタ条件をVisualforce側のJavascriptで設定するといったこともできます。
それについては余裕があればまた別の記事を書こうかと思います。

それでは、よいSalesforce&Tableauライフを~( ^_^)/~

8
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?