まめージェント

Android, GAE, AngularJSの技術ネタ中心。Twitter: @mame01112

Angularticsでイベントがトラッキングされない

Angularticsについて

AngularJSのライブラリで、Google Analyticsを始めとした各種トラッキングサービスを使うためのAngulatics (
http://luisfarzati.github.io/angulartics/
)というライブラリがあり、非常に便利です。

導入方法

導入も非常に簡単で、ページ遷移なども、下記の本家サイトに従えばサクサク対応できるかと思います。luisfarzati.github.io
※このサイトにもあるように、

ga('send', 'pageview');

を削除するところだけは要・注意でしょうか。

何故かイベントがトラックできない

ただ、ボタンやリンクをクリックしたときのイベントのトラッキングが、本家に載っている下記のコードだと動きません(2015年7月21日時点)

<a href="file.pdf" analytics-on="click" analytics-event="Download">Download</a>

何でかなー、と探しまわることしばし。
どうやら、ライブラリの仕様が変わったようです。。。(本家のドキュメントがそれに追従していないとはどういうことだ。。。)

下記の履歴によれば、0.17.0になったときに、categoryも一緒に送らないといけない仕様になったようです。
https://github.com/luisfarzati/angulartics/commit/4b7c60fc831948a1e64ca7fffbc2b26ef7199941

"Google Analytics - do nothing if there is no event category (required)"って、書いてありますね。(しれっと。。。)AngularJSのライブラリは、日本語の情報が少ないので、こーいうところでハマります。僕が今回気づいたのも、英語版Stack overflowでした。下記リンク。
javascript - Angulartics GA events not getting tracked - Stack Overflow

ということで、こうすれば動く。

こんな感じ。

<a href="file.pdf" analytics-on="click" analytics-category="overview" analytics-event="Download">Download</a>

ちなみにGoogle Analyticsの場合はリアルタイムでは取得できないので(他のサービスは知りませんが・・・)、データの更新は、数時間〜1日ほど待ってからアクセスしてみてください。

以上、Angularticsでイベントをトラッキングする方法でした!