javascript - xtk でのレンダラーのサイズ

Question

xtk (http://www.goxtk.org) で遊んでいます。レンダラーにサイズを課すにはどうすればよいですか? レンダラーで init を呼び出すと、コンテナーの div が大きくなるためです。例のように width または high 100% を使用していません。絶対サイズを使用しています。ヒントをありがとう。

Answer 1

X.renderer のコンテナーである -tag を調整して、レンダラーのサイズをピクセル単位で指定すると機能するはずです。

たとえば、これは XTK レッスン 7 からのもので、3 つの X.renderer が絶対サイズで使用されています ( http://lessons.goxtk.com/07/を参照)。

...
<div id='r1' style='background-color:#000000; float: left; width: 300px; height: 300px; margin:10px;'></div>
<div id='r2' style='background-color:#000000; float: left; width: 300px; height: 300px; margin:10px;'></div>
<div id='r3' style='background-color:#000000; float: left; width: 300px; height: 300px; margin:10px;'></div>
...

それでも、自動プログレスバーが適切に表示されるように、位置スタイルはrelativeに変更されます。これにより、一般的なページ レイアウトの外観に応じてコンテナーが調整される場合があります。

絶対位置スタイルが必要でプログレスバーが不要な場合は、次のように無効にすることができます。これにより、コンテナーの位置スタイルの変更も防止されます。

...
r1 = new X.renderer('r1');
r1.config.PROGRESSBAR_ENABLED = false;
r1.init();
...