Iフレーム内で可変幅のテキストエンティティをどのように並べますか？

Iフレームで可変幅のテキストエンティティをどのように整列させますか？Iフレーム内で可変幅のテキストエンティティをどのように並べますか？

私はI-Frame WordPressテンプレートを開発しようとしていますが、私は理解できないようなnewbeの問題に取り組んでいます。ループを使用してメニューアイテムをフレームテキストコンポーネントのエンティティに吐き出していますが、各アイテムの位置を編集することなく自動的に整列させたいと思います。問題は幅です。私はアイテムの幅を測定でき、それぞれのアイテムセットの間にあらかじめ決められたスペースをあけて隣り合わせに置く方法はありますか？

または、I-FrameのAPIを使用して各アイテムを繰り返して、ページの読み込みに配置しますか？

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>MyPage</title> 
     <script src="<?php echo get_stylesheet_directory_uri(); ?>/js/aframe.min.js"></script> 
     <script src="https://rawgit.com/ngokevin/aframe-text-component/master/dist/aframe-text-component.min.js"></script> 
    </head> 
    <body> 
     <a-scene> 
      <? $my_menu = wp_get_nav_menu_items('Menu 1'); 
      foreach ($my_menu as $key => $menu_item) { ?> 
       <a-entity id='menu_i_<? echo $key; ?>' material="color: #FFC65D" position="0 3.25 -4" text="text: <? echo $menu_item->title; ?>" url='<? echo $menu_item->url; ?>'></a-entity>    
      <? } ?> 
     </a-scene> 
    </body> 
</html>

出典

2016-10-01 user1772754

bmfont-text componentを使用すると、よりエフェクトのある、よりきれいな、自動的に揃えられます。

しかし、境界ボックスを使用してテキストをオフセットすることもできます。

var bbox = new THREE.Box3().setFromObject(textEl.getObject3D('mesh')); 
textEl.setAttribute('position', { 
    x: (bbox.max.x - bbox.min.x)/2, 
    y: textEl.object3D.position.y, 
    z: textEl.object3D.position.z 
});

出典

2016-10-01 22:44:58 ngokevin

ありがとうございましたngokevinしかし、私は奇妙な "e.updateMatrixWorld関数ではありません"エラーが発生しています。私はbmfont-textコンポーネントが好きですが、インタラクティブな目的のために別々の要素を使用しなければならないので、同じボートに入っています。互いの隣に要素を置く方法は分かっていないが、依然として別個の要素であることが分かっていなければ。私は彼らのページ全体を見て、それをする方法を見つけることができません。 – user1772754

そのコードを呼び出すときに、メッシュが初期化されていることを確認してください。依存関係：['text'] 'を持つコンポーネントにコードを貼り付けるか、' loaded'イベントリスナーを使用してください。 – ngokevin

Iフレーム内で可変幅のテキストエンティティをどのように並べますか？

答えて

関連する問題