jThree備忘録 - 画像のようにページ内の一部にWebGLを使用する

WebGLが1つだけの場合

rdrタグのframe属性にCSSセレクタを指定することで好きなHTML要素をWebGLのフレームに出来ます。
フレームに出来る要素の条件は「幅と高さが設定されている」ことです。
pxでも%でも構いません。フレームの動的なサイズ変更を常に監視しており自動でリサイズします。
(jThreeのcanvasタグ挿入が原因でフレームのサイズが変わるとそれ自体も検知して無限にリサイズを繰り返すようになるので注意してください)

HTMLでフレーム要素の準備
<style>
#jthree {
    width: 400px;
    height: 300px;
}
</style>
<div id="jthree"></div>

GOMLのrdrタグでフレーム要素を指定
<rdr frame="#jthree" />

WebGLが2つ以上の場合

iframeを使うのがベストです。
GOMLの仕様としてはrdrタグを増やすことで複数描画にも対応できるのですが制約が多くて現実的ではありません。
(IEでは2つ目が描画されない、ほかのブラウザでもオブジェクトの共有が出来ないなど)