カテゴリー:JavaScript

TweenJSのTimelineを使ったテキストアニメーション

前回の投稿「トゥイーンで簡単canvasアニメーション!TweenJSの使い方」では、TweenJSの基本的な使い方を紹介しましたが、TweenJSにはTimelineクラスが用意されており、Flashのタイムラインに似た概念で複数のトゥイーンをまとめて操作することができます。今回は、TweenJSのTimelineクラスを使って、EaselJSのTextクラスをアニメーションさせてみます。

トゥイーンで簡単canvasアニメーション!TweenJSの使い方

TweenJSは、Grant Skinner氏が開発しているCreateJSに含まれるJavaScriptトゥイーンライブラリです。CreateJSのサイトからダウンロードできます。本来、JavaScriptでのアニメーションには比較的面倒な記述が必要になりますが、TweenJSを使うと驚くほど簡単な記述でオブジェクトをアニメーションさせることができます。

PreloadJSで外部ファイルを読み込む

PreloadJSは、画像, 音声, CSS, JS, XMLといった外部ファイルを読み込むことができるJavaScriptライブラリです。CreateJSのサイトからダウンロードできます。これまで、JavaScriptで複数の外部ファイルを読み込む処理は比較的面倒でしたが、PreloadJSを使うと簡単に行えるだけでなく、読み込み状況のパーセンテージを取得することもできます。

JavaScriptのクロージャを利用したprivate staticメンバ

JavaScriptには、アクセス修飾子がないため、クラスに属するstaticプロパティやstaticメソッドを外部からアクセスできないようにすることはできません。しかし、クロージャを使うことにより、privateなstaticプロパティやstaticメソッドに似た機能を実現することができます。

JavaScriptでのprototypeを利用したクラスの継承

JavaScriptは、プロトタイプベースのオブジェクト指向言語であるため、クラスベースのプログラミング言語で使われるextendsのようなクラスを継承するための特別な構文はありませんが、prototypeを利用することにより、継承の機能を実現することができます。

JavaScriptにおけるクラス定義

JavaScriptは、プロトタイプベースのオブジェクト指向をサポートしています。クラスベースのオブジェクト指向言語に比べて記述は大きく異なりますが、JavaScriptでもクラスを利用することができます。

JavaScriptの無名関数を利用した名前衝突の回避

JavaScriptは、言語として名前空間をサポートしておらず、また変数や関数を上書きすることができるため、特に複数人で開発する場合などに名前の衝突が問題になる場合があります。無名関数のローカルスコープを利用することで、変数名や関数名の衝突を効率的に回避することができます。

Googleアナリティクスの_trackPageviewで計測できないケース

Googleアナリティクスでは、外部へのリンクのクリック数やPDF、zip等のアクセス数を計測するために_trackPageviewという機能が用意されていますが、残念ながら正確に計測できないケースが存在するようです。どのようなケースで計測ができないのか、様々な環境でテストしてみましたので、結果をレポートしたいと思います。

Googleアナリティクス非同期トラッキングコード

今回は、Googleアナリティクスの非同期トラッキングコードに関するメモです。Analyticsヘルプによると、非同期トラッキングコードのメリットは、ページの読み込み時間が短縮され、滞在時間が短い場合でもセッションを記録でき、トラッキングコードを読み込む前に発生したクリックについてもデータを収集できるとありますが、良いことづくしですね。

3 / 41234