私はインターネットから入手したいくつかのballonsでキャンバスを持っています。 基本的に、私は私のページの片側にそのキャンバスを使用することができますが、私は反対側のキャンバス風船を必要とするので、私はレンダリングキャンバススクリプトを2回
<canvas class="canvas"></canvas>
<canvas id="canvas"></canvas>
を変更しました
と私が必要とするセクションで再びタグを使用して、それは動作しません、あなたはどのように私はその問題を解決することができます知っていますか？
使用したサンプルは、1つのキャンバスを処理するサンプルスクリプトです。抽象化されておらず、多くの変数とメソッドがグローバルスコープにあります。したがって、複数のキャンバスを処理できるようにそのコードをリファクタリングするには不十分です（パラメータとして渡された特定のキャンバスに適用するラッパーに少なくとも機能をカプセル化する必要があります）。このアプリケーションをiframeとして含めることができます。
<html> <body> <iframe src="ballons.html" height=300 width=300></iframe> <iframe src="ballons.html" height=300 width=300></iframe> </body> </html>
ちょうど質問友人、これはちょうどpreetyコードの再利用とpreetyされているメインではないここでは、そのバルーンスクリプトのような2つのスクリプトを作成する場合、私は別のキャンバスでそれぞれ1を使用できますか？どのように、私はtryedと1が正しく表示されません – caxinaswin
それはそのように動作しません。与えられたスクリプトは大量のグローバル変数を作成します。 2番目の同じスクリプトはそのような変数を上書きし、ページの名前空間を共有します。 2つのキャンバスを処理できるようにスクリプトをリファクタリングする必要があります。 iframeを使用することはまさにあなたが望んでいたものです。試してみてください。 –
私たちはあなたを助けるために多くの情報を必要とします。どのようにキャンバスのCSSのように見えるのですか？ – Edgesoft
https://codepen.io/Gthibaud/pen/grvrYq私はこれを使用し、自分のコードに適応し、2回使用する必要があります – caxinaswin