問題タブ [kineticjs]

ねえ、Kineticjsを使用してドラッグアンドドロップ操作を実装しています。画像が近づいたら、互いにスナップさせたいです。KineticJsでビーチの動物の例を見ましたが、私の機能には役に立たなかったので、jqueryスナップを見ました。グリッドに..しかし、それを使用する場合は、KineticJsを削除する必要があります.kineticJsの要素にjqueryスナップを適切に実装する方法はありますか？jqueryでは、imgのIDを渡してドラッグ可能にしますそしてスナップします。では、これをkinetic.js画像でどのように使用できますか

jqueryドラッグ可能：http：//jqueryui.com/demos/draggable/#snap-to

Kinetic.js：http ://www.kineticjs.com/

ありがとう

Ashish

私はjqueryを初めて使用します。Kinetic.jsを使用してドラッグアンドドロップ操作を実装しました。htmlにいくつかの画像があり、それらをjavascript関数に渡して、ドラッグ可能にします。2セットの画像があります。彼らが近づいたら彼らを互いにスナップさせるために。私はjqueryを初めて使用するので、動的jsイメージ変数をjquery操作に渡してimgidタグを渡す方法がわかりません。また、jquery関数を配置する場所と方法がわかりません。

ここにコードがあります..誰か助けてください..

jqueryライブラリの読み込み

Kinetic.js-画像を読み込んでドラッグ可能にする

このjquery関数の使用方法と動的jsドラッグ可能画像をここに渡す方法についてのヘルプが必要です

ドラッグ可能な機能

画像クリック時のHTML定義操作

html5 img タグを使用して複数の画像をキャンバスにロードしようとしています。
画像は置換可能です。たとえば、画像の 5 つのリストがあります。画像もドラッグ可能
で、特定の画像をクリックすると、同じリストから最後にアップロードされた画像が置き換えられます
。私が直面している問題は、新しい要素をアップロードするときに表示されることです。他のトップ。一番下の要素のonclickを一番上に移動してドラッグしたい。move to top と呼ばれる kineticjs 関数を使用しようとしましたが、何も起こりません.ライブラリもチェックしましたが、問題ありません...
ここに完全なコードを貼り付けることができないため、サイズが大きすぎます。
これは、トップ機能への移動を追加しようとしている部分です。

この機能は動作していません

終わり

画像を失いたくないので、キャンバスをクリアするのではなく、画像の一部のテキストを置き換える必要があります。キャンバスの外側の入力ボックスからその画像のテキストを置き換えることができるようにしたいだけです。また、追加します。その画像の色、フォント、サイズの変更などの機能。Kineticjs形式で利用可能なテキストプラグインを試しましたが、要件を満たしていないため、理解できません。それで、これについて何か考えはありますか？

ありがとう

別のソースから動的に画像を追加できるキネティック キャンバスを作成しようとしています。背景にグリッドが必要だったので、キネティック v3.8.2 の kinetic.rect を使用しました。画像はキネティック v.3.6.0 からドラッグ可能である必要がありますが、v3.8.2 をアクティブにしているときにドラッグ可能に設定すると壊れます。FireBug によると、「config is undefined」です。「img.kinetic.draggable はメソッドではありません」と FireBug は言います。

これに対する修正はありますか？

次のように、linesLayer を含むいくつかのレイヤー (およびステージ) を作成する document.ready 関数があります。

私の document.ready 関数には、キャンバスのクリック機能があります。ここでは、たとえば、次のように新しい円を作成します (画面上のポイント/ドットを表します)。

その後、私は自分の行を作成します:

そして、それらをそれぞれのレイヤーに追加します。

それらをステージに追加します。

今何が起こるかというと、ドット/円を描くと、それらはすべて画面に表示されたままになります。したがって、10 回クリックすると、10 個のドットが表示されます。問題は、これは線を描画しますが、画面上に以前のすべての線を残すのではなく、2 つの点の間の最新の線である毎回 1 行だけを描画することです。レイヤーにそれらを追加していて、ラインレイヤーの前の行で何もしていないので、なぜこれが起こっているのですか?

したがって、基本的には、円を必要に応じてポイントレイヤーに追加し、以前に追加した要素はそのままにしますが、線レイヤーに線を追加すると、線レイヤーの以前のすべての要素が消えますか?

編集:このコードで修正しましたが、なぜこれが機能するのか不明です。

HTML5 で作成した図形をアニメーション化しようとしています。

jQuery.animate を使用してanimationValue、ある値から別の残業に変更したいと考えています。これを達成する方法がよくわかりません。またLayer.draw();、私の形状はキャンバス形状であるため、アニメーションのすべてのステップで関数を実行する必要があります。

animationValuemyShape.drawFunc でアニメーション化する方法を知っている人はいますか?

myShape.on("mouseover",{});setInterval メソッドなどを使用してアニメーション化しようとしていることを追加する必要がありますか?

アップデート：

console.log は setInterval が呼び出されていることを示していますが、形状は再描画されていないようです。

画像を 3D にする方法はありますか? 私は jquery リールのようないくつかのプラグインを見ました.しかし、それらは私が探している機能には十分ではありません..ユーザーが最初に画像を選択し、次にグラフィックを追加してからテキストを追加するタイプのビジュアルスタジオを作成しました..今何が私が望むのは、このユーザーが組み立てられた要素を回転させて 360 度ビューを表示できるようにすることです。360 度ビューにするために必要なすべての画像がありますが、どうすればよいかわかりません。助けていただければ幸いです..

ありがとうアシッシュ

kinetic という素晴らしい .js を見つけました。私はhtml、cssをしばらくいじっていて、コンテナを全画面表示に設定できません。

http://designobvio.us/v4design/demo.html

すべての親を 100% の高さに設定し、フルスクリーンの jQuery を試しました。残念ながら、まだ運がありません。

読みやすくするために、コードを可能な限り組み合わせました。ご覧のとおり、高さを 400px に設定しました。他にサポートとして提供できることがありましたら、遠慮なくお尋ねください。

2番目のリクエストとして、境界線を内側に設定する方法を誰でも知っているでしょう. または、幅がそのままボーダーにうまく収まることを確認しますか?

KineticJS を使用して画面上を移動する画像をアニメーション化しようとしていますが、関数ではないというエラーが発生し続けます。画像は正常に表示されますが、imageObj.move は関数ではないと言い続けており、その理由がわかりません。私はjavascriptとKineticJSに慣れていないので、本当に基本的なエラーを犯している可能性があるので、助けていただければ幸いです。ありがとう！