Windows ペイント プログラムは、Windows のすべてのバージョンに付属しています。この非常にシンプルでほとんど役に立たないプログラムは、最も基本的な描画機能を備えており、落書きに非常に適しています。 HTML5 の Canvas オブジェクトを使用すると、オンライン描画が可能になります。HTML5 はまだ成熟していませんが、多くの人がそれを使用して素晴らしいアプリケーションを設計することを待ち望んでいます。
CanvasPaint は、HTML5 に基づいた標準の Windows ペイント プログラムです。Windows ペイント プログラムと同じインターフェイスと操作があり、特定のブラウザをサポートしているため、最終的な作品をローカル マシンに保存することもできます。これは最近のプロジェクトではなく、2006 年から存在しているため、標準をサポートする現在のほとんどのブラウザ (Firefox、Safari、Chrome、Opera) はこのプログラムを通常どおり使用できます。このプロジェクトについて著者からの説明がいくつかあります。
なぜこのプログラムが開発されたのでしょうか?
Windows 描画プログラムの開発が目的ではなく、HTML5 の Canvas 機能を体験することが目的です。
使い方はWindows標準の描画ソフトと同じです。
保存できるでしょうか？
はい、ただし、Firefox 2 と Opera 9 のみをサポートしています (翻訳者注: これは、著者が 2006 年に実装したプログラムです)。ローカルに保存するには、[ファイル] メニューの [ダウンロード] を選択し、[オンラインで保存] を選択します。オンラインで作品を表示するための URL が自動的に生成されます。
ブラウザ自体の右クリック メニューは、右クリック メニューの使用に影響します。ブラウザの設定で右クリック メニューを無効にすることができます。
一部の機能が利用できないのはなぜですか?
一部の機能は特定のブラウザ バージョンでサポートされています (翻訳者注: これは 2006 年時点のものです)。
カラーピッカーFirefox 2.0Opera 9 Flood fillOpera 9 画像の保存Firefox 2.0Opera 9 URLを開くFirefox 1.5Opera 9最新 WebKit Canvas オブジェクトは使いやすいですか?
クロスブラウザーのサポートを必要としないアプリケーションに最適です。しかし、ペイントにおける最大の問題は、mousemove イベントのリフレッシュ レートによって制限され、特にエアブラシを使用する場合にカーソルの位置を見つけるのが簡単ではないことです。また、サイズが非常に大きくなると非常に遅くなり、getPixel()関数がありません。
技術的な詳細 プログラムでは 5 つの Canvas オブジェクトが使用されます。
メイン アートボード、プレビュー ペイント コンテンツを表示するために上に浮いている透明なアートボード レイヤー、選択したコンテンツをキャッシュするために使用される非表示のキャンバス、元に戻すステータスをキャッシュするために使用されるキャンバス、およびグラデーション カラーを表示するためにプログラム タイトル バーで使用されるキャンバス。
他人の HTML5 Canvas の実験
Canvascape 3D (HTML5 を使用したシンプルな一人称シューティング ゲームの実装)
CanvasGraph (HTML5 Canvas 描画 JavaScript ライブラリ)
画像の反射 (HTML5 Canvas を使用した画像の反射の実装)
Canvas Painter (よりシンプルな Canvas 描画プログラム)
本当に素晴らしい HTML 描画プログラム 上記のプログラムを読んで HTML5 の Canvas 機能に興味を持った方は、ここにあなたを驚かせる描画プログラムを紹介します。デスクトップと比べても劣らないインターフェイスの操作性と滑らかさは、マルチスクリーン コンピューター上では、フローティング ツール パネルを 2 番目の画面にドラッグしたくなるほどです。
-