Afrous にはデフォルトのダッシュボードサービス ( http://dashboard.afrous.com ) から作成したダッシュボードをエクスポートする機能があります。エクスポートされたダッシュボードはどのようなWebサイトにも埋め込むことができます。つまり自分自身のダッシュボードサービスをWebサイトの訪問者に対してホストすることができます。ホストするダッシュボードの振る舞いは設定値によって変えることもできます。

エクスポートウィザードはメニューバーから「エクスポート」を選ぶことで表示されます。エクスポートを行うためにはAfrousプラットフォームのアカウントをあらかじめ登録してログインしておく必要があります。未ログインの状態では「エクスポート」メニューは無効の状態になっています。

ダッシュボードをWebサイトに埋め込む

もしWebサイトの管理者であったり、あるいは（JavaScriptも含めて）HTMLを貼付けることができるなら（例：ブログサイトなど）、Webサイトにダッシュボードを埋め込むのは非常に簡単です。Afrousでは次の２つのタイプの埋め込み方法を提供しています：

• インライン
• ボタン

インラインでの埋め込みは、ダッシュボードをページ全体、あるいはHTMLブロック要素の中に埋め込むためのものです。もしページにあまりスペースがない場合は、ボタン形式での埋め込みができます。その場合ダッシュボードのスクリーンはボタンをクリックされた際にブラウザのウィンドウ全体にオーバーレイされて表示されます。

エクスポートウィザードはサイトの名前およびそのベースURLの入力を求めます。たとえば、もし埋め込み先のページが "http://www.examplej.com/path/to/page.html" で提供されていたとき、ベースURLには "http://www.example.com" あるいは "http://www.example.com/path/to/" などと入力します。これにより生成された埋め込みコードが他のURLでは使えなくなります。

最後にダッシュボードを埋め込むためのコードが表示されるので、これをコピーしてHTMLファイルとして保存し、Webサイトに配置します。

ブックマークレットとしてエクスポートする

もしサイトの管理者ではないためダッシュボードをホストすることができない場合、「ブックマークレット」という仕組みを利用して自分のみのプライベートにダッシュボードを保持しておくことで、どんなウェブサイトでもそのダッシュボードを呼び出すことができます。エクスポートウィザード内で「ブックマークレット」を選択することで、ブラウザにブックマークとして登録するためのアンカーリンクが生成されます。

注意：

作成されたブックマークレットはセッショントークンが含まれているため、自分以外の他のユーザに公開すべきではありません。

生成されたコードとダッシュボードの設定オプション

ウィザードによって生成されたJavaScriptコードを見てみると、そこにはAfrousで定義されたJavaScriptの関数がダッシュボードを呼び出しているのがわかります。このメインメソッドは”afrous.dashboard.showDashboard" (ボタンでの埋め込みの場合は“afrous.dashboard.createButton”という関数）であり、引数としてハッシュオブジェクトのパラメータを指定します。このハッシュオブジェクトに設定オプションが渡されます。

コードの例

<script type="text/javascript" src="http://resource.afrous.net/release/2.1/js/afrous-dashboard-include.js"></script>

<script type="text/javascript">

afrous.config = {

  SITE_KEY : '7e0cd16c11ff3ffe8ad75dfc981b37ee'

};

window.onload=function() {

  afrous.dashboard.showDashboard({

    el : 'dashboard',

    id : '4bf13a9aef4428fe235ed090d3cf112d',

    hideDrawer : true

  });

}

</script>

設定オプション