Three.js: r73：何も機能しません！？！

何が機能しないのですか？ どのようなエラーが発生していますか？ 私は常にすべての例がまだ機能することを確認します。 何かが壊れた場合は、それをテストする例を追加する必要があります。

何が機能しないのですか？

何も機能しません!!!
単なる例（あなたのために）：
http://necromanthus.com/Test/html5/dog_r72.html
http://necromanthus.com/Test/html5/dog_r73.html
エラー：

• THREE.MorphAnimMeshは未定義です
• loader.loadは関数ではありません

なぜそのようなものをリリースしたのですか？

ああ！ そうですか。

アニメーションシステムを完全に置き換えましたが、SEA3Dはまだ古いものに依存しています（ @sunagはアップデートに取り組んでいると思います）。

それまでの間、プロジェクトに古いアニメーションシステムを含める必要があります。

<script src="js/MorphAnimMesh.js"></script>
<script src="js/loaders/collada/Animation.js"></script>
<script src="js/loaders/collada/AnimationHandler.js"></script>
<script src="js/loaders/collada/KeyFrameAnimation.js"></script>

ファイルはexamplesフォルダーにあります。

アニメーションシステムを完全に置き換えました

そして再び、あなたは後方互換性を台無しにしました... OMG

とにかく、ここに何か他のものがあります（アニメーションとローダーなし）：
http://necromanthus.com/Test/html5/koolmoves_r72.html
http://necromanthus.com/Test/html5/koolmoves_r73.html
エラー：

• _typeface_jsが定義されていません
• THREE.TextGeometryはコンストラクターではありません

正直なところ、r73は完全に混乱しているため、削除する必要があります。
乾杯

私は約1。5年間ChiliPepprをThree.jsに依存してきました。 今朝はTHREE.FontUtilsが定義されていないため、ChiliPepprですべてのフォントレンダリングが壊れているようです。 @RemusMarが言及しているのと同じr73の問題だと

FontUtilsおよびTextGeometry utilsもコアから削除されました。

ここで、ファイルを個別に含める必要があります。

<script src="js/geometries/TextGeometry.js"></script>
<script src="js/utils/FontUtils.js"></script>
<script src="fonts/helvetiker_regular.typeface.js"></script>

とにかくユーザーが*.typeface.jsを含める必要があったので、コアからそれらを移動することにしました。

@RemusMarバージョン間の下位互換性は保証されません。 ただし、ユーザーに通知し、可能な場合はいつでもどこでもコードを機能させ続ける遷移コードを追加します。

FontUtilsおよびTextGeometryutilsもコアから削除されました。

コアからすべてを削除してみませんか？
ZEROバイトのコアをダウンロードする必要はまったくありません。

バージョン間の下位互換性は保証されません。

それは悪い動きですリカルド。
私が最初から言ったように：

下位互換性は、深刻なプロジェクトでは必須です。
そうでなければ、そのプロジェクトに興味を持つ人はますます少なくなります。

乾杯

コアからすべてを削除してみませんか？
ZEROバイトのコアをダウンロードする必要はまったくありません。

私はあなたが感情的な男だと思います。 しかし、あなたは周りにいるので、私はまた、一日の終わりにあなたがプロジェクトが役に立つと思うことを集めます😉

下位互換性は、深刻なプロジェクトでは必須です。

たぶん、これはあなたが思っているほど深刻なプロジェクトではありませんか？ 私はあなたが知っているアドビではありませんか？

そうでなければ、そのプロジェクトに興味を持つ人はますます少なくなります。

興味を失った人は私が心配することではありません。 代わりに、コンピューターグラフィックスの煩わしさを抽象化する美しいAPIの作成に焦点を当てると同時に、ライブラリを100kbのgzip圧縮に収めたいと考えています。 人々が追加するすべての機能を永久に含めることは不可能です。

@RemusMar下位互換性。このようなjsライブラリを使用する場合、サポートされなくなったものがあれば、自分で問題を修復できるはずです。 そうでない場合は、より協力的な方法で質問してください。誰もが喜んでお手伝いします。 例が壊れている場合は、お気軽に修理してください...

@RemusMar JavaScriptで3Dプログラミングを始めたときにthree.jsについて最初に学んだことの1つは、下位互換性がないという事実でした。

私のプロジェクトでは、コードを作成したのと同じバージョンのthree.jsにリンクしていることを確認するだけでよいので、一般的にはまったく問題ないと思います。

後方互換性を考慮しないというポリシーは、これまで、非常に素晴らしい可能性を備えた、このような動的な方法でthree.jsを開発するチャンスの基礎でした。

それは悪い動きですリカルド

70以上の改訂後に人々がこれにどのように気付くか驚くべきこと）

しかし、要点を付け加えると、最近誰かが私に「最新の安定したthree.jsはr72です」と書いていました（笑）。 安定したthree.jsはありません。 古いリビジョンをバグ修正で更新するのではなく、バグ修正を含む新しいバージョンと、重大な変更または新しいバグがあります。

繰り返しになりますが、基になるコードが逆さまになった場合でも、いくつかのことが魔法のようにバージョンを介して機能します。 バッファジオメトリを使用するスキンのように）

私たちが重大な変更の対象になっている間、私を最も怒らせているのはjsonの変更です。 誰かが彼の3dmaxに古いエクスポートプラグインを持っていて、アニメーションを機能させるためにjsonを手作業で編集することに何年も費やしています。

繰り返しになりますが、基になるコードが逆さまになった場合でも、いくつかのことが魔法のようにバージョンを介して機能します。 バッファジオメトリを使用するスキンのように）

それには少し手間がかかりました！ 😅

私たちが重大な変更の対象になっている間、私を最も怒らせているのはjsonの変更です。 誰かが彼の3dmaxに古いエクスポートプラグインを持っていて、アニメーションを機能させるためにjsonを手作業で編集することに何年も費やしています。

はい。 アニメーションはできるだけ早く安定させる必要があります。 新しいアニメーションシステムは正しい方向への大きな一歩だと思います。

r73が変更されたため、このサンプルは壊れているようです。 http://threejs.org/docs/scenes/geometry-browser.html#TextGeometry

ああ！ ドキュメントのサンプルは常に忘れてください...

@mrdoob
「古い」THREE.Animationクラスを置き換えるには何を使用すればよいですか？
新しいアニメーションシステムを使用した例はありますか？ 例のページで何が新しくなったのかはそれほど明確ではありません。

私たちが重大な変更の対象になっている間、私を最も怒らせているのはjsonの変更です。 誰かが彼の3dmaxに古いエクスポートプラグインを持っていて、アニメーションを機能させるためにjsonを手作業で編集することに何年も費やしています。

これは私の懸念でもあります。 何百ものモデルを再エクスポートする必要は本当にありません。

@jostschmithals
後方互換性を考慮しないというポリシーは、これまで、非常に素晴らしい可能性を備えた、このような動的な方法でthree.jsを開発するチャンスの基礎でした。

それは間違った声明です。
実際、下位互換性を常に壊すと、サードパーティの開発者はTHREE.jsをあきらめることになります。
一方、新機能やバグ修正は、古いプロジェクトとの互換性を損なうことを意味するものではありません。
リカルドがこの道を歩み続けるなら、私が正しいかどうかは時が経てばわかるでしょう。
乾杯

これは私の懸念でもあります。 何百ものモデルを再エクスポートする必要は本当にありません。

同意しました！ json形式は、下位互換性が非常に重要だと思うものです。 とにかくするのは難しいことではありません。

同意しました！ json形式は、下位互換性が非常に重要だと思うものです。 とにかくするのは難しいことではありません。

安堵のため息をつく=]

重大な変更が含まれている場合、移行ガイドを更新せずにビルドをリリースするのは少し時期尚早のようです。 私はこれらのボードをフォローしているので幸いなことに、アニメーションの変更に気づいていました。 すべてのユーザーが平等に準備されているとは思いません。

100KBのサイズ制限を維持するためだけにコアから物を削除することについて、Remusに同意します。 個人的には、数バイトを削るよりも機能性を10000倍気にしています。 例から必要なファイルを取得できることは知っていますが、それはお尻の一種の不必要な苦痛のようです（特にリリースごとにそれらを更新する必要があります）。

とにかく私からの不満は十分です。 これらのいくつかの批判はさておき、素晴らしい仕事の人たち！

重大な変更が含まれている場合、移行ガイドを更新せずにビルドをリリースするのは少し時期尚早のようです。

リリースを行うには、かなりの数の手順が必要です。 時々私の忍耐/献身が尽きます...😕
誰でも移行ページを更新できます。 そこで助けを求めたいです。

r73が変更されたため、このサンプルは壊れているようです。 http://threejs.org/docs/scenes/geometry-browser.html#TextGeometry

修繕！

r74のFontUtilsはどこにありますか？ r74で削除されたようです...

@pjanik

ええ、申し訳ありませんが、 TextGeometry APIが再び変更されました。 しかし、それはコアに戻っています！

http://threejs.org/examples/webgl_shadowmap.htmlを参照してください。

var loader = new THREE.FontLoader();
loader.load( 'fonts/helvetiker_bold.typeface.js', function ( font ) {

    var textGeo = new THREE.TextGeometry( "THREE.JS", {

        font: font,

        size: 200,
        height: 50,
        curveSegments: 12,

        bevelThickness: 2,
        bevelSize: 5,
        bevelEnabled: true

    });

    textGeo.computeBoundingBox();
    var centerOffset = -0.5 * ( textGeo.boundingBox.max.x - textGeo.boundingBox.min.x );

    var textMaterial = new THREE.MeshPhongMaterial( { color: 0xff0000, specular: 0xffffff } );

    var mesh = new THREE.Mesh( textGeo, textMaterial );
    mesh.position.x = centerOffset;
    mesh.position.y = FLOOR + 67;

    mesh.castShadow = true;
    mesh.receiveShadow = true;

    scene.add( mesh );

} );

誰かが興味を持っているなら、これは私がNPM [email protected]モジュールとwebpackを使用して非同期リクエストなしでフォントをロードする方法です： https ：//gist.github.com/pjanik/49c03c02c66341a26904
他のビルドツールを使用している場合、重要なことはフォントファイルを文字列としてロードすることです。 たぶん、この面白い構文解析は、将来、何らかのヘルパーメソッドに抽出される可能性がありますか？

ちなみに、r74に/examples dirが含まれているのはすばらしいことです（r73には含まれていません）。引き続き実行してください。 ：wink：最後に、 threeパッケージのみを使用でき、外部スクリプトファイルは使用できなくなりました（ examples/js/controls/OrbitControlsも使用しています）。 例がUMD形式を使用して公開された場合はさらにクールになるため、グローバルな3つの依存関係を変更せずにOrbitControlsを直接要求できます（ほとんどのビルドツールで処理できるため、大したことではありませんが、それでも）。

ありがとう！

または、_typeface_js.loadFaceをローカルで定義して評価することもできますか？

ええ、申し訳ありませんが、TextGeometryAPIが再び変更されました。 しかし、それはコアに戻っています！

それは賢明な決断でした。リカルド。
ローダーの構文を少し変更する必要がありますが、下位互換性があります。
r71： http ：//necromanthus.com/Test/html5/koolmoves.html
r74： http ：//necromanthus.com/Test/html5/koolmoves_r74.html
乾杯

ObjectLoaderにテキストジオメトリのバックロードを追加する必要がありますか？

@fraguadaええと、それほど簡単ではありません。フォントファイルも処理する必要があります...

FontUtilは私が取得しているr74のバージョンでは定義されていません： https ：

これはhttp://threejs.org/examples/webgl_shadowmap.htmlで使用されているものと同じように見えますが（縮小化されている場合を除く）、FontUtilsや書体が明示的に含まれていることもわかりません...それでもそのサンプルページは機能します。 （私はまだ「_typeface_jsが定義されていません」と表示されますが）あなたはあなたのコメント（これの上の6つのコメントのコードサンプル）に示されていることに加えて何かをしていますか？

APIの変更に応じてドキュメントを更新する必要がありますが、これは適用されなくなりました： http ：

フォント、ウェイト、ベベルを切り替えるすべてのキーストローク記録がない非常に基本的な例があれば、非常に便利でした。 それらも持っているのは素晴らしいことではありませんが、あなたの例の単純な基本的なものは私にたくさんの時間を節約したでしょう。

この例は大いに役立つ可能性があります： http ：

このスレッドを見つけた人のために、この簡単な例をJSFiddleにまとめました。
https://jsfiddle.net/287rumst/1/

非常に基本的な例があれば非常に便利でした

r75およびr76dev：
http://necromanthus.com/Test/html5/koolmoves.html

私は下位互換性のファンでもあるため、わずか2セントです。

互換性が保証されない場合は、古いバージョンと新しい処理を示すupgradeフォルダー（またはfixes ）をgithubに用意しておくと便利です。 参照。

このようにして、プログラマーが変更に追いつくのは簡単です。

これらの問題を修正する方法を考え出すために余分な時間を費やすことができないような「未知の」問題のために、私はまだr65を使用しています。

みなさん、こんにちは。r71からr76に移動して、新しいanimation.mixerを発見しました。 そのため、古いjson 3Dオブジェクトライブラリを機能させ続けるために、MorphAnimMesh.js Animation.jsAnimationHandler.jsとKeyFrameAnimation.jsをjavascriptライブラリにコピーしました。 しかし、「データ階層が未定義」というエラーが発生します。 これは、以前の3D jsonオブジェクトをすべてBlenderから再エクスポートする必要があることを意味しますか、それともこれらを機能させ続ける方法はありますか？

こんにちは、「undefineddata.hierarchy」を手伝ってくれる人はいませんか？

StackOverflowを使用してください。

リリースを行うには、かなりの数の手順が必要です。 時々私の忍耐/献身が尽きます...：混乱：
誰でも移行ページを更新できます。 そこで助けを求めたいです。

私は最近、古いバージョンのthree.jsを使用してこの問題に遭遇しました。

しかし、受け取ったコメントや侮辱を読んだ後、助けを求める代わりに、three.jsを維持してくれてありがとうと言いたかっただけです。

あなたは非常に献身的で忍耐強い人です！ ：+1：

r72からr84への更新は、一連の作業でした（1つのプロジェクトで最大3時間）。

役に立った：

• フォントの問題については、 http：//necromanthus.com/Test/html5/koolmoves.htmlのソースコードを参照してください（フォントをHTMLでロードするのではなく、JSで変数を割り当てると、これがパラメーターに組み込まれます。ロードされた後にのみフォントを割り当てるように注意してください）
• 開発コンソールのエラーメッセージを参照してください。何をすべきかを教えてくれるので、非常に役立ちます（good work
• https://github.com/mrdoob/three.js/wiki/Migration-Guideも

私の幸せな結果： https ：

v72からv84に何をする必要があるかを詳しく説明します。

1. HTMLファイルから削除します。

   <!-- OLD <script src="../../threejs/geometries/TextGeometry.js"></script>  -->
   <!-- <script src="../../threejs/helvetiker_regular.typeface.js"></script>  -->
   

2. threejsシーンを実行すると、おそらく次のようになります。

   Uncaught TypeError: c.generateShapes is not a function
   

3. これは、フォントをロードせずにレンダラーが起動するために発生します。 それでは、最初にフォントをロードしてから、起動時にレンダラーを呼び出しましょう。

   var text3dparams;
   var font_helvetiker;
   var fontload = new THREE.FontLoader();
   fontload.load( '/threejs/fonts/helvetiker_regular.typeface.json', function ( font ) {
       font_helvetiker = font;
       initStageText();
   
       // startup
       render(); 
   });
   

4. 実行時にテキストを新しく設定するときに、グローバルスケープでステージオブジェクトを定義する必要があります。例：

   var text3d_r;
   var text3d_s;
   var text3d_h;
   var material1;
   var material_s;
   var material2;
   

5. 開始機能の例：

   function initStageText()
   {
       // 3D TEXT LABELS
       text3dparams = {
           font:           font_helvetiker, // font, important to change, before was "helvetiker", now the font directly!
           size:           0.3,    // size of the text
           height:         0.05,   // thickness to extrude text
           curveSegments:  2,      // number of points on the curves
           weight:         'normal',       // font weight (normal, bold)
           style:          'normal',       // font style  (normal, italics)
       }
   
       // label radius
       material1 = new THREE.MeshBasicMaterial({color: 0x009900});
       var text3dgeom_r = new THREE.TextGeometry('r = '+cone_radius, text3dparams);
       text3d_r = new THREE.Mesh(text3dgeom_r, material1);
       text3d_r.position.y = cone_height+0.1;
       text3d_r.position.z = cone_radius/2-0.35;
       text3d_r.rotation.y = -Math.PI/2;
       scene.add(text3d_r);
   }
   

6. また、エラーTHREE.GridHelper: setColors() has been deprecated, pass them in the constructor instead.これを解決するために、次のものを削除しました。

   gridHelper.setColors( new THREE.Color(gridcolor), new THREE.Color(gridcolor) );
   

追加（グリッドステップは以前は1でしたが、同じグリッドを取得するには値を20に設定する必要がありました）：

    var gridHelper = new THREE.GridHelper(gridplaneSize/2, gridstep, gridcolor, gridcolor);

1. 次に、threejsの変更を処理する必要があります（Chromeコンソールに警告として表示されます）。

6.1 THREE.MeshBasicMaterial: 'ambient' is not a property of this material. new THREE.MeshBasicMaterial();からambient:color,を削除することで解決

6.2ライトが変更されました。警告に記載されているように交換してください。

    THREE.Light: .shadowMapWidth is now .shadow.mapSize.width.
    THREE.Light: .shadowMapHeight is now .shadow.mapSize.height.
    THREE.Light: .shadowCameraNear is now .shadow.camera.near.
    THREE.Light: .shadowCameraFar is now .shadow.camera.far.
    THREE.Light: .shadowCameraFov is now .shadow.camera.fov.
    THREE.Light: .shadowCameraVisible has been removed. Use new THREE.CameraHelper( 
    THREE.WebGLRenderer: .shadowMapEnabled is now .shadowMap.enabled.

6.3 THREE.Light: .shadowDarkness has been removed. -削除します。

1. レンダラーの設定も変更しました。

   // OLD 
   var renderer = Detector.webgl ? new THREE.WebGLRenderer({ antialias: true }) : new THREE.CanvasRenderer({ antialias: true });
   
   // NEW
   var renderer;
   if(Detector.webgl)
   {
       renderer = new THREE.WebGLRenderer({ antialias: true });
   }
   else
   {
       renderer = new THREE.CanvasRenderer({ antialias: true });
   }
   

2. また、シーンの設定に白い背景色を追加する必要がありました。

   var scene = new THREE.Scene();          
   scene.background = new THREE.Color( 0xffffff );
   

これで、私のアプリケーションは古いthreejsバージョンと同じように実行されます。 あなたのプロジェクトにも頑張ってください！