3dテキストがthree.jsに表示されない

Question

私はthree.jsを学んでいて、キューブをうまくやった。今、私は3Dテキストを作ろうとしています。私が見つけた最も単純なもの（例はhere）であるWebの例のコードをコピーしました。 この例のすべてのファイルを、「janda_manatee_solid_regular.js」というフォントを含むhtml、css、および4つの参照された.jsファイルにコピーしました。その後、HTMLを読み込むと、3Dテキストは表示されません（キャンバスには何も描画されません）が、コンソールにエラーは表示されません。

私はhereとhtml以外のもの（cssとjs）をアップロードしました。このコードの問題は何ですか？あなたのページのHTMLコード内

Answer 1

（あなたが提供されるリンクから）、があります：おそらく

<div id="canvas"> 
    <canvas width="800" height="600"></canvas> 
    <canvas width="800" height="600"></canvas> 
</div> 

、ソースコード中にあなたがfont-example.jsで、その後

<div id="canvas"> 
    <canvas width="800" height="600"></canvas> 
</div> 

としてそれを持っているし、そのあなたはこれを行う

container = document.getElementById('canvas'); 

したがって、あなたはすでにキャンバス要素をに持っていますdivとし、同じサイズのキャンバス要素をもう1つ追加します。

var SCREEN_WIDTH = 800, SCREEN_HEIGHT = 600; 
... 
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT); 

は結果として、次の2つのキャンバスを持っており、それはあなたの画面の下の下だから、あなたは（うまく探してテキスト付き）は、第2のものを見ることができません。 ソリューションは、あなたのソースHTMLで空canvasのdivを維持することです：

<div id="canvas"></div>