PlayCanvasでUnderscore.jsを使う

わりと簡単に導入できました。
これでもうJavaScriptの配列操作で疲弊しない＼(^o^)／

Underscore.jsの入手

まず、Underscore.jsのページに行って、Undersore.jsのコードを拾います。
https://underscorejs.org/

DevelopmentでもProduction(minifyされたもの)でもどちらも動くはずですので、問題がなければサイズの小さいProductionを使います。

ファイルをDLしてエディタで開くかブラウザ上でソースを表示して、全選択(Ctrl+A)してコピー(Ctrl+C)しておいてください。

PlayCanvasに追加する

Underscore.jsのようなライブラリは、Rootにくっつけておくと良いかと思います。

HIERARCHYでRootを選択した後、ENTITYでAdd ScriptでUnderscore.js(.jsは省略可)を追加します。

ASSETSの中にUnderscore.jsが作成されるので、ダブルクリックしてファイルを編集します。

この作成されたファイルの*最後尾(自動生成されたコードは消しません)*で、
https://underscorejs.org/
より入手(Ctrl+C)したソースコードを貼り付け(Ctrl+V)ます。

Productionから拾うとスクリプトエディタ上でエラーがでます。コード量を減らすために動作に問題がない命令終端の;を抜いたりとかしているので、構文的なエラーが表示されます。

実行時にエラーがでるわけではないので気にしなくて大丈夫ですが、どうしても気になるならDevelopmentバージョンを貼り付けてください。こちらは綺麗なコードなのでエラーは表示されません。

動作確認

適当にスクリプトを作って、Underscore.jsの機能を使ってみます。

var Test = pc.createScript('test');

// initialize code called once per entity
Test.prototype.initialize = function() {
    this.data = [1, 2, 3, 2, 1, 2];

    console.log(_.uniq(this.data));  // Underscore.jsで重複削除
};

// update code called every frame
Test.prototype.update = function(dt) {

実行すると、ブラウザのデバッグ出力にconsole.logの結果が表示されます。

エラーも出ず、ちゃんとunique化されました。