WEBブラウザ上で画像に書込みを行う方法

質問

分かりづらい質問で申し訳ありませんが、
ご存知の方がいらっしゃいましたら恐れ入りますがご教授下さい。

以下の様な事を実現するにはどの様な技術、手法で実現可能でしょうか？

基本となる画像をWEBブラウザ上に表示
↓
画像に対してWEBブラウザ上で書込みを行う
↓
書込みを行った内容を画像にする。

例）
車の絵が描かれた画像をWEB画面上に表示
↓
車の画像の特定の部分に、何かしらの書込みを行う
↓
その結果を画像化

回答No.3

LancerVII

こんにちは。

http://ascii.jp/elem/000/000/513/513377/
http://ytkm.naobun.com/wordpress/?p=386
上記サイトが参考になると思います。

流れとしては
ブラウザ上にCanvasを利用して画像と描画エリアを作成。
↓
画像に対して絵を描いたり字を描いたり。
↓
Canvasの内容をBase64形式でサーバに送信する
↓
送信されたBase64形式のデータを利用して画像を生成し、任意の場所に保存

>自分でも今調べているのですが、HTML5のCanvas機能を利用した場合に画像をjpgやgifで保存して、サーバ側に残す手段はあるでしょうか？
>一度ダウンロードする必要が有るのでしょうか？
どの部分でダウンロードの想定だかわかりませんが、上で述べた流れになります。

文字を任意の場所に入れる、定型画像と合成して画像を生成するetc.であればNo2さんのやり方でも良いはずです。

回答No.2

aoyama984

http://silverzwei.sakura.ne.jp/content/php/picprocess/content001.php
PHPがあれば可能です
http://www.php-labo.net/tutorial/php/upload.html
アップロードするなら　まずUPして　表示

文字　色　大きさ　位置　を指定させて合成
PHPが利用可能なサーバが必要になります
また画像処理に必要なGDなどが使えることが条件です

補足

ありがとうございます。
なるほど、PHPで画像操作が出来るのですね
参考にさせていだきます。

回答No.1

LancerVII

こんにちは。

HTML5のCanvas機能を利用する。
Flashを利用する。
Javaアプレットを利用する。

とサーバ側で画像を保存する、表示する
という機能が必要になります。
(Java,PHP等)

補足

大変参考になりました。ありがとうございます。
自分でも今調べているのですが、HTML5のCanvas機能を利用した場合に画像をjpgやgifで保存して、サーバ側に残す手段はあるでしょうか？
一度ダウンロードする必要が有るのでしょうか？