問題タブ [morphing]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
ios - スプライトの回転リングをアニメーション化する
iOS用のアプリケーションを作成したいのですが、cocos2dの専門知識があります。たくさん検索しましたが、Webkitを使用したこのアニメーションのCSS実装だけが見つかりました。C、Objective C、VHDL以外の言語はわかりません。
1-cocos2dまたは他のFrameWorkでこのアニメーションを作成するにはどうすればよいですか?
2-どうすればインタラクティブにすることができますか(タッチで)。
インタラクティブにすることはできますが、このアニメーションの作成方法へのポインターが必要です。私が念頭に置いているのは、各スプライトを手動で拡大縮小して移動し、不透明度を変更して、この効果を作成することですが、時間がかかります。
こちらがアニメーションへのリンクです
https://www.webkit.org/blog-files/3d-transforms/morphing-cubes.html
three.js - Three.js - ジオメトリのモーフィングと三角形メッシュの改良
Three.js を使用して、あるジオメトリを別のジオメトリにモーフィングしようとしています。これまでに行ったことを次に示します (実際の例については、 http://stemkoski.github.io/Three.js/Morph-Geometries.htmlを参照してください)。
小さな多面体から大きな立方体 (三角形分割され、原点を中心とする) に変形しようとしています。アニメーションはシェーダーを介して行われます。小さい多面体の各頂点には、最終位置と最終 UV 座標という 2 つの関連付けられた属性があります。各頂点の最終的な位置を計算するために、原点から小さい方の多面体の各頂点をレイキャストし、大きい方の立方体との交点を見つけました。最終的な UV 値を計算するために、重心座標と、大きな立方体の交差面の頂点での UV 値を使用しました。
それはひどいものではありませんが、素晴らしいものではない最初の試みにつながりました。(通常) 大きな立方体のどの頂点も、小さな多面体のどの頂点の最終位置でもなかったため、立方体の表面の大きなチャンクが欠落していました。次に、次のように頂点を追加して、小さな多面体を改良しました。大きな立方体の各頂点について、原点に向かってレイキャストし、各光線が小さな多面体の面と交差する場所で、その三角形の面を削除し、点を追加しました。交点とそれを置き換える 3 つの小さな面。これでモーフは改善されましたが (これは上記にリンクされた実際の例です)、モーフはまだ立方体のボリューム全体を埋めていません。
私の最善の推測は、大きな立方体の頂点を小さな多面体に投影することに加えて、エッジも投影する必要があるということです.AとBが大きな立方体のエッジで接続された頂点である場合、これらの頂点の投影より小さな多面体でもエッジで接続する必要があります。しかし、もちろん、投影されたエッジが小さい多面体のメッシュ内の複数の既存の三角形をまたぐ可能性があり、複数の新しい頂点の追加、再三角形化などが必要になります。実際に必要なのはアルゴリズムのようです2 つの三角形メッシュの共通の改良を計算します。上記のようなモーフィング (異なる三角形化を持つ 2 つのメッシュ間) のアルゴリズムや例 (コード付き) を知っている人はいますか?
3d - メッシュ間の補間
3 つの顔メッシュがあります (人物 A のニュートラルな顔と表情の顔、人物 B のニュートラルな顔)。この単純な変換方法を使用して、新しい顔メッシュを作成しようとしています *y'_i = y_i + x'_i – x_i* ここで、
*y_i* は人物 B のニュートラルな顔の頂点
*x'_i* は人物 A の表情の顔の頂点です*x_i* は人物 Bの
表情の頂点です。
これを行うには、頂点が対応している必要があります。たとえば、B さんの左目角は A さんの左目角に対応します。また、各顔の 26 個のランドマーク ポイントの x、y、z 座標も持っています。2 つのメッシュ間でこの対応関係を構築するにはどうすればよいでしょうか?
javascript - モーフ ターゲット Three.js
モーフ ターゲットと three.js を使い始めようとしています。ただし、この件に関するドキュメントはあまりないようです。
ソースコードを見ていると:
morphTargetInfluences[]
魔法のようです...これはどのように機能しますか?これをどのように使用しますか?値 1 は完全な強さですか? 同じモデルの異なるモーフ ターゲットを区別するにはどうすればよいですか? 私は理解しようとしているだけです:
前もって感謝します
android - Androidでjhlabs画像ライブラリのワープフィルターを使う方法
WarpFilter
Androidアプリケーションで使用したいのですjhlabs
が、jhlabsが提供するjarを使用しましたが、その中にはWarpFilterクラスの定義がありません。WarpFilterとこのリンクを参照しました。そのクラスをアプリケーションにコピーして使用しようとしました。しかし、問題は、Android SDK でサポートされていないいくつかのクラスを使用していることです。Googleコードリンクも参照しましたが、そのための実装も提供していません.誰かが私にいくつかの解決策を提案できますか? ワーピング画像機能を提供する他のライブラリ/jarはありますか? この問題を解決するために私を助けてください。
ありがとう。
image - Delaunay 三角形分割による画像モーフィング
キーポイントとドローネ三角形分割を使用して 2 つの画像を変形する単純なアルゴリズムを開発しています。アイデアは単純でなければなりません:
- ソース管理ポイントを選択する
- 目的地のコントロール ポイントを選択します
- ソース フレームと宛先フレームのドローネ三角形分割を取得する
- ソース画像の各ピクセル
- ピクセルが存在するソース三角形に関連するピクセルの重心座標を取得します
- ピクセルが位置する目的の三角形に関連するピクセルの重心座標を取得します
- 関係 Px = w1*v0x + w2*v1x + w3*v2x (y と宛先ピクセルも同じ) を使用して、OUT[PdestX,PdestY] = IN[Px,Py] を割り当てます。
しかし、それは動作しません X_X これは私の matlab ソースです:
これらは、コントロール ポイントを取得するためのユーティリティ関数です。
そして、この関数(私はネット上で見つけました)は、ポイントが特定の三角形上にあるかどうかをテストし、u、v、w の値を返します。
なにか提案を?さよなら!
image-processing - ピクセル グループごとに画像を並べ替える方法
画像遷移プログラムを作成したいと思います。ある画像からピクセル領域をシフトし、色や形状などの特定の基準に基づいて別の画像に移行する必要があります。
これを行うには、画像を分析し、グループに分割し、これらのグループをシフトできる必要があります。
- 最初の問題は、ピクセル グループの決定からすでに始まっています。ランダムまたは完全なポリゴン/形状で選択しないでください。異なるテクスチャ/周囲/境界を区別できるアルゴリズムを知っている人はいますか?
- 次に、領域を新しい画像に合わせて微調整する必要があります。次に、領域が移動されます。それは最初の問題ほど難しくありません。
パフォーマンスはそれほど重要ではありません。まず、プログラムを動作させる必要があります。事前にトランジションをロードするのに1時間かかる場合があります;)
どこから始めるべきか、またはどのテクノロジー/APIを使用できるかについて、誰かアドバイスをいただけますか? ほとんどのプログラミング言語、できれば C#、VB、JavaScript、PHP、Java などに問題はありません。プラットフォームも問題ではありません。
これは複雑ですが、説明するために最善を尽くしました。何か案は?