最近, Sprite3D.jsを使い始めて, 少しずつ分かってきたので, 簡単なリファレンスを作成. よく分からないメンバ関数なんかも多いので, 教えていただければ幸いです.
Sprite3D.jsとは
JavaScriptで3D描画を行うためのオープンソースのライブラリ. 内部実装上は, CSS3で導入された3D関連の指定をJavaScriptで動的に行うことで3D表現を実現している. jQueryなどの追加のライブラリは不要だが, 3D表現をCSSでサポートしていないブラウザでは閲覧できない. WebGLなどと比較すると, 表現力は劣るがハードウェアの性能には左右されにくいという特徴がある.
ダウンロード
Sprite3Dクラスのメンバ関数
setTransformString
setX, setY, setZ, setPosition
オブジェクトを指定した位置に移動させる.
moveX, moveY, moveZ, move
オブジェクトを指定した座標分だけ指定した方向に移動させる(差分を指定する).
setRotationX, setRotationY, setRotationZ, setRotation
オブジェクトを指定した角度に回転させる.
rotationX, rotationY, rotationZ, rotation,
オブジェクトを指定した方向に指定した角度分だけ回転させる(差分を指定する)
setScaleX, setScaleY, setScaleZ, setScale
オブジェクトの各指定する方向への拡大率を指定する(1が等倍).
setRegistrationPoint
オブジェクトの中心座標を設定する.
setTransformOrigin
変形処理の原点となる座標(x, y)を指定する.
setSize
setOpacity, getOpacity
透過度を指定する, 取得する.
setClassName, getClassName, addClassName, removeClassName
オブジェクトに対するクラス名を設定, 取得, 追加, 除去するためのユーティリティ関数.
setId, getId
オブジェクトに対してidを割り当てる, 取得するためのユーティリティ関数.
setCSS, getCSS
要素にCSS文字列をセットする, 要素に設定されているCSS文字列を取得する.
setInnerHTML
オブジェクトのinnerHTMLを設定する.
setTileSize
setTilePosition
setProperty
オブジェクトに対して, key/value形式でプロパティを保持させたり, 既存のプロパティをこれで書き換えることが可能. 引数には, keyとvalueをこの順序で渡す.
setRotateFirst
update, update2D, updateAll, updateCHildren, updateChildrenAll, updateWithChildren
オブジェクトを更新する. これを呼び出したときにCSS文字列を生成しオブジェクトに対して適用させる. 他のメソッドでプロパティを変更しても, このメソッドを呼び出さない限り, 描画上は反映されない.
addChile, removeChile, removeChildAt
子オブジェクトを追加, 子オブジェクトを除去する.
findFromDOMElement
addEventListener, removeEventListener
オブジェクトに対するイベント・リスナーを追加, 除去する.
createCenterdContainer
createTopLeftCenterdContainer
isSupported
レンダリングを行っているブラウザ(環境)がSprite3Dでの3D表現をサポートしているかどうかを返す. 3D表現をサポートしていない場合であっても, 2D表現をサポートしている場合は, isSupportedはfalseを返すが, 2D表現で描画を行う.