javascript - 各ボールの背景画像が異なるようにキャンバス上に複数のボールを描画するにはどうすればよいですか?可能ですか?

質問: キャンバス上に複数のボールを描画する場合、各ボールの背景画像を異なるようにするにはどうすればよいですか? 可能ですか?私が今やりたいのは、それぞれのボールを異なる色にして、そのボールを写真で塗りつぶしたいということです。コードの一部: {code...} 現在の効果:

大家讲道理 2017-06-14 10:54:28 0  4  1041

正確なマウス座標を取得できない問題: ページのサイズを変更するときに HTML5 キャンバスを使用する

このピクセル効果をフロントエンドの専門家に作成してもらいたいと考えています。全画面キャンバスでピクセル効果全体を実現することはできますが、 constcanvas=getElementById('canvas');canvas.height=window.innerHeight;//全画面の高さをキャンバスに設定します Canvas.width=window.innerWidth ;//キャンバスを全画面幅に設定すると、マウスの座標を取得しやすくなります constmouse={x:unknown,y:u

P粉752290033 2023-09-12 12:20:33 0  1  774

html5 - キャンバスが toDataURL データを取得できない場合がある

質問: 1. 理由はわかりませんが、canvas が描画データを取得できず、「data:;」だけが取得されることがあります。これをどこで間​​違って書いたか教えてください。 2. Canvas をこんな感じで書いていますが、最適化する必要があるものはありますか? 関連コード: {code...} {code...}

高洛峰 2017-06-06 09:53:01 0  2  941

Vite React プロジェクトを保存するたびに、既存のキャンバス要素を置き換えるのではなく、新しいキャンバス要素がページ本文に追加されるのはなぜですか?

ThreeJs の学習を始めようとしています (JavaScript Web 開発も初めてです)。いくつかのチュートリアルを見た後、Vite と React から始め、次に基本的な回転立方体から始めました。この部分は機能します。しかし、vite について読んだところによると、作業中のファイルを保存するだけでページに再ロードできるはずです。しかし実際にはそうではありません。ページのコンテンツを確認したところ、ファイルを保存するたびに、(既存のキャンバス要素を置き換えるのではなく) 2 つの同じキャンバス要素がページ本文に追加されます。つまり、それを確認するにはページの一番下までスクロールする必要...

P粉186904731 2024-03-30 09:57:49 0  1  556

JavaScript - キャンバスデザインのマウス描画機能は、一度のストロークで複数の平行な色付きの線を描画します

1. キャンバスデザインのマウス描画機能は、複数の色の平行線を一度に描画できます 2. マウスイベントに描画 oCg.beginPath(); を追加してみましたが、イベントが上書きされてしまいます。 3. 同じ方法で複製キャンバスを追加しますが、キャンバスは覆われます。

PHP中文网 2017-06-13 09:24:08 0  1  1313

キャンバスが空白に見えますか?

BlazePose から取得できるキャンバスにキーをレンダリングしようとしていますが、キーをキャンバスに描画することができないようです。各キーポイントの x と y はわかっており、取得されていますが、それらをキャンバスに表示することができません。スタイルを変更しようとしましたが、今のところ成功していません。ご協力いただきありがとうございます。 constvideo=document.getElementById('webcam');constcanvas=document.getElementById('output')constl

P粉147045274 2024-03-31 17:20:31 0  1  617

javascript - Canvas ページ上でマウスをクリックしたとき、その点の位置がその中に描かれた線の上にあるかどうかを判断するにはどうすればよいですか?描かれた線で何かがイベントをトリガーしますか?

以下は、下線付きのコードの 3 つのセクションです。編集モードに入ると、マウスの左ボタンをクリックすると、vcanvas 内の左ボタンの対応する位置が記録されます。クリックした点が描画した線分上にあるかどうかを確認するにはどうすればよいですか? //これは下線付きのキーコードです {code...}

世界只因有你 2017-06-13 09:24:19 0  1  1208

javascript - キャンバスで半透明のモザイクを描画するのに役立ちますか?

私の要件は、ユーザーがマウスを使用してアップロードされたドキュメントをモザイクできるようにすることです。私のアイデアは、マウス イベントをキャンバスにバインドし、ユーザーがマウスを押したパスに沿ってドキュメント上に半透明の png を描画することです。今は半透明を使用したくありません。 PNG オーバーレイ、キャンバスを直接使用してマルセイユを生成したい...

仅有的幸福 2017-06-07 09:24:40 0  1  927

イメージストレージ - php mysqlはbase64イメージを保存します

HTML5 キャンバスでは、サードパーティ コントロールを使用して絵文字パッケージを作成しました。次に、完成した絵文字パッケージを mysql データベースにアップロードしたいと思います。ファイルをローカル サーバーにアップロードしてファイル アドレスをデータベースに保存するか、BLOB 形式で使用するかは、どちらでも可能です。方法を教えてください...

ringa_lee 2017-05-19 10:07:42 0  4  1033

javascript - CANVASで描画されたグラフィックを確認する方法

たとえば、線を使用してハートや V を描いている場合、キャンバス上に何を描いているかをどのように判断できますか? 。ハートかVかを判断するにはどうすればよいですか？ 。そして、二人の絵の類似性を判断します。条件は複数のストロークではなく 1 つのストロークにすることができます

PHP中文网 2017-05-16 13:27:54 0  2  683

ctx 代替。 requestAnimationFrame() を使用する場合は、ストロークスタイルを使用します。

ホームページの背景キャンバスとして描画するためにimplerand mmotionを実装しようとしていますが、クエリの色を見つけるのに苦労しています。

P粉605385621 2023-08-01 16:06:12 0  1  525

JavaScript-キャンバス描画

初めて Canvas のdrawImage を呼び出してローカル画像の一部を描画する関数を作成しました (成功する可能性があります)。次に toDataURL を呼び出して Canvas によって描画された画像を画像オブジェクトの src 属性に変換します。キャンバスに描かれた絵は、二次描画でも同じメソッドを呼び出します...

PHP中文网 2017-07-05 10:46:27 0  1  783

html5 - 花びら散乱エフェクトの書き方と花びらを多数生成する方法

{コード...} 一枚一枚書いているのですが、とてもめんどくさいので花びらがたくさんありません。数枚しかないのに、どうしたら無限に花びらを生成できるのでしょうか? キャンバスなしで実現できますか? または、どうすれば実現できますか?キャンバスで実現？

我想大声告诉你 2017-06-22 11:53:27 0  3  2082

javascript - キャンバスの画像処理に関する問題

ユーザーがアップロードした画像を処理するにはキャンバスを使用する必要があります。ユーザーがアップロードしたサイズは非常に大きい可能性があります。たとえば、現在のブラウザ ウィンドウの幅と高さを超えるため、表示領域に比例して拡大縮小します。ブラウザの画像をキャンバス上に描画しますが、これはユーザーの絵を縮小することに相当します...

扔个三星炸死你 2017-06-10 09:49:16 0  3  1042

スライド矢印のクリック領域がアイコンより広い

私の WordPress 開発サイトには、ギャラリー用のスライドショー機能があります。画像をクリックするとスライドショーが始まります。私の問題は、左側と右側の 2 つの白い矢印です。矢印のクリック可能領域はアイコンのサイズよりも広いです。以下の写真をご覧ください。クリック可能な領域はアイコンよりも広いです これは私の開発 Web サイトの URL この質問にコードを含めようとしましたが、「あなたの質問はスパムのようです」と言われました。 CSS ファイルは「https://dev.francisbegin.ca/wp-」です。

P粉195200437 2023-09-13 19:29:50 0  1  659

Chartjsのレスポンスサイズ

文字幅が狭い場合にフォントサイズを調整したい。 ChartJとLine typeを使用しています。キャンバスの幅が 100% (1500px) の場合、次のようになります。 しかし、キャンバス サイズを 50% (750px) に変更すると、次のようになります。 テキストが小さすぎて読めないため、フォント サイズを変更しないでください。これはできるでしょうか?

P粉321584263 2023-09-15 13:28:07 0  1  616

JavaScript - キャンバス上で鉛筆の線画効果を実現する方法

最近描いている線画は全てlinetoで描いているのですが、全て実線で描いているので、クリエイティブの効果という観点からすると、【鉛筆】を描いたような効果が欲しいんです～マスターの皆さん、描き方を教えてください。 。

習慣沉默 2017-05-24 11:37:40 0  1  1079

javascript - jQuery File Upload プラグインに関する質問

ユーザーは、input="file" タグを使用して画像を選択します。ユーザーが選択した画像を処理のためにキャンバスに描画した後、base64 画像データを取得します。次に、この結果を jQuery ファイルにどのように入力するかが問題になります。アップロードして、ボタンをクリックします。アップロードについてはどうですか? {コード...}

淡淡烟草味 2017-06-10 09:49:07 0  1  675

3 つの要素ごとに親要素をラップします

検索オーディオ用のクラスを含む 3 つの div ごとに、スライドショー クラスを含む div をラップしたいだけです。私が受け取ったエラーの 1 つは、elem.parentElement が未定義であるということでした...そのため、この部分は正常に機能します... constaudioBlocks=document.querySelectorAll('.search-audio');constslider=document.querySelector(' .slider');コンスタジオ

P粉211273535 2024-04-02 13:11:31 0  2  487

JavaScript - キャンバス ゲームを作成しました。マップ カメラがマップ オブジェクトをズームインすると、fps が非常に固まり、アニメーションが滑らかではありません。この問題はどうすれば解決できますか?

キャンバスであるカメラを拡大するためのCSSが不安定になるはずなのですが、どうすればよいでしょうか？

女神的闺蜜爱上我 2017-07-05 11:03:02 0  2  978