[解決済み] <canvas> 要素の最大サイズ
2022-08-09 03:41:48
質問
canvas 要素の高さが
600
から
1000
ピクセル、幅は数万から数十万ピクセルになります。しかし、あるピクセル数(当然不明)を超えると、JSで描いた図形がキャンバスに表示されなくなります。
どなたか制限をご存じないでしょうか?
Chrome 12とFirefox 4の両方でテストしています。
どのように解決するのですか?
2014年10月13日更新
テストしたすべてのブラウザで、canvas 要素の高さ/幅に制限がありますが、多くのブラウザで canvas 要素の合計面積も制限されています。私がテストできたブラウザでは、制限は次のとおりです。
Chrome。
最大高さ/幅: 32,767 ピクセル
最大面積 268,435,456 ピクセル(例:16,384×16,384 ピクセル)
Firefoxです。
最大高さ/幅: 32,767 ピクセル
最大面積 472,907,776ピクセル(例:22,528×20,992ピクセル)
IEです。
最大高さ/幅: 8,192 ピクセル
最大面積 N/A
IEモバイルです。
最大高さ/幅: 4,096 ピクセル
最大面積 N/A
その他
現時点では、他のブラウザをテストすることはできません。追加の制限については、このページの他の回答を参照してください。
ほとんどのブラウザで、最大長/最大幅/最大面積を超えると、キャンバスが使用できなくなります。(使用可能な領域であっても、描画コマンドは無視されます。) IE および IE Mobile は、使用可能な領域内のすべての描画コマンドを尊重します。
関連
-
[解決済み】ある要素を別の要素に移動させるには?
-
[解決済み] 要素外でのクリックを検出するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] 要素を水平方向にセンタリングする方法
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] 画面サイズ、現在のウェブページ、ブラウザウィンドウのサイズを取得する
-
[解決済み] 再描画のためにキャンバスをクリアする方法
-
[解決済み] HTML5/Canvas/JavaScriptを使用してブラウザ内のスクリーンショットを撮影する
-
[解決済み] Reactメモを使うべきではない場合とは?
-
[解決済み] 各オブジェクトに?重複
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] JavaScriptで次の要素/前の要素を取得しますか?
-
[解決済み] JavaScript で範囲を作成する - 奇妙な構文
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] JavaScriptで:hoverのCSSプロパティを変更する
-
[解決済み] オブジェクトの配列からReactコンポーネントをレンダリングする
-
[解決済み] 無効になっている入力フィールドの値を送信する
-
[解決済み] react-routerのハッシュフラグメントからクエリパラメータを取得する
-
[解決済み] ECMAScriptとは?
-
[解決済み] JSHintの'+'前の改行不良の説明
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?