canvas.toDataURLメソッドを使う
canvasで描画したデータを、Base64エンコードした文字列で取得するメソッドがtoDataURLです。 これにより、canvasの画像データをGETやPOSTで送信したり、ブラウザのlocalStrageやsessionStrageに保存して後で利用するなどのことが非常にやりやすくなります。ただし、このメソッドは利用する上でいくつかの注意点があります。
「2013年01月」一覧
HTML5/canvas上に読み込んだ画像を貼り付ける
ここからしばらく、HTML5のcanvasについて書こうと思います。 canvasは、何やら新しいもののように思えますが、実際に操作する時に働くのはjavascriptなので、描画に関するルールや関数を覚えてしまえば、あとはスクリプトが書けるかどうかのお話です。
HTML5/canvasでのアイコン画像の加工を採用するにあたって
APIで取得したアイコン画像をいったんサーバーに保存し、そのパスをjavascriptに渡して読み込み・canvasへ描画して元アイコンを表示し、更にフレーム画像のサムネイルをクリックすると、そのフレームをまたjavascriptで読み込んでcanvasへ上から重ねる、といった手順です。
TwitterOAuthでプロフィール画像を変更する
下準備については下記で紹介したので、実際にプロフィール画像を変更する時のお話です。 TwitterAPIを利用するためのOAuth認証処理ライブラリについて アクセストークンを取得してAPIが使えるようになったので、プロフィール画像を変更するAPIに画像をPOSTでリクエストします。
PHPのGDイメージストリームを文字列に変換する
前回画像を加工するまでは完了しましたが、このままではTwitterAPIにリクエスト出来ませんので、イメージストリームを文字列に変換するか、あるいは一旦ファイルに出力してしまう必要があります。当初は一旦ファイル化していましたが、サーバー容量の無駄遣いになってしまうので、文字列に変換する方法に切り替えました。
スポンサーリンク