Cubism SDK‎ > ‎プラットフォーム‎ > ‎WebGL‎ > ‎

WebGL SDK 2.0→2.1の変更点

2.1からクリッピングマスク機能がサポートされました。
2.0から2.1の変更点は以下の通りです。


変更点１： 「Live2DModel.setGLからLive2D.setGLに変更する」

変更前：
176
177
178
// OpenGLのコンテキストをセット
Live2DModel.setGL(gl);


変更後：
107
108
109
// OpenGLのコンテキストをセット
Live2D.setGL(gl);

　変更前の場合、以下のエラーがでますので上記を修正して下さい。
　「Cannot read property 'createProgram' of undefined」

複数Canvasを使用する場合は、mocファイルロード処理部分でsetGL処理を入れて下さい。
　また、loadModelの第2引数にCanvasのインデックス番号も指定して下さい。
　（インデックス番号は1つ目のCanvasが0、2つ目のCanvasが1となり、第2引数が0, 1...となります）
　詳しい実装は、SimpleMultiCanvasプロジェクトを参照して下さい。

複数Canvasの場合：
114
115
116
117
118
119
// mocファイルからLive2Dモデルのインスタンスを生成
this.loadBytes(this.modelDef.model, function(buf){
// OpenGLのコンテキストをセット（MultiCanvasの場合はここでglをセットする）
Live2D.setGL(gl);
thisRef.live2DModel = Live2DModelWebGL.loadModel(buf, thisRef.glno);
});


変更点２： 「createTexture処理に乗算済アルファチェックを追加する」
以下の3行をcreateTexture処理に追加します

追加：
233
234
235
236
if(live2DModel.isPremultipliedAlpha() == false){
    // 乗算済アルファテクスチャ以外の場合
    gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, 1);
}

クリッピングマスクのサイズについて

　クリッピングマスクのサイズはデフォルトは256 x 256サイズです。
　クリッピングマスクのジャギりなど気になる場合は、大きいサイズを指定して下さい。
　指定できるサイズは2の累乗である必要があります（128, 256, 512, 1024, 2048...）
　以下のコードでクリッピングマスクサイズを変更する事ができます。


1
2
3
　// クリッピングマスクサイズを1024x1024にする
　Live2D.setClippingMaskBufferSize(1024);



Comments