rails3 + html5 canvasでお絵かき投稿サイトを作ろう！
はじめましてこんにちは。 KRAYアルバイトの浅海です。 html5のcanvasを使ってお絵かき投稿サイトを作ってみようと思います。 初めてブログ記事を書くということで気合が入りました。 ちょっと長めですがお付き合い下さい。 機能 お絵かき投稿サイトの必要最低限な機能って？ ざっと下のような機能を入れてみます。 絵を描ける 絵を消せる 描画を一回分戻れる 線の太さを変えられる 線の色を変える 絵を投稿できる 投稿された画像の一覧を表示できる → 完成見本はこちら完成見本の公開は終了致しました。 絵を描ける HTML5のcanvasにマウスの軌道に線を引いていくわけです。 canvasでのマウス軌道の描き方は、 ・mousemoveイベント発生時に点をプロット という手段が真っ先に思い浮かぶと思いますが、これは、以下の様になります。 これではお話になりません。 なので、点ではなく線を引くこ
Node.jsでコロンビア(AA略 :ダメ人間オンライン
意味わからないタイトルですね。すいません。 簡単に言うと「さぁ解答をお書き下さいどうぞ！」と言って解答者が答えを手元のフリップなりなんなりに書いたやつがリアルタイムで視聴者が見れるみたいなのをやりたかったのです。 で、それをNode.jsを使って実装したという話です。Node.jsを使った理由はただ使いたかったというそれだけの理由です。socket.ioを使わずwebsocket-server使ってますし。 node-columbia canvasを共有してリアルタイムに描画します。わりかし最近のバージョンのsafariかchromeで見れます。あとiPhoneやiPadのタッチイベントも対応してます。 demoページ(不安定でよく止まるので見れないかもしれません。)複数ブラウザを立ち上げて同じページを見るとどんな感じかわかると思います。 コロンビア 冗長かつ汚いコード・・・ https:
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
サービス終了のお知らせ
