Memo toDataURLの際にjpegと比較して軽い方を選ぶように
canvasから画像スキームデータを抽出する際のtoDataURL()メソッドですが、そのままだとpng画像になります。toDataURL()はpngの対応が必須実装なので、canvasが使えるブラウザは必ずpng出力が出来ます。ですが、j...
canvas
Memo Web アイコンのデコレーション処理をnode.jsで立ち上げたAPIに回す
以前ちょっとnode.jsについて書きましたが、概ねAPIの立ち上げが済んだので、今は試験的に内部運用しています。ざっくりどういうAPIかというと、パラメータをGETで渡すと、iconDecotterのcanavs上で描画されるような画像を...
Web canvas.getImageData・putImageDataを利用したレイヤー効果
canvasに画像を貼り付ける際に、様々な画像加工エフェクトを付けられたら幅が広がるのでは、と思って少し調べた所、こちらのスクリプトで同様のことがされておりましたので、参考にさせて頂きました。フォトレタッチやドローイングツールのレイヤー効果...
Web canvas.drawImagで貼り付ける画像を回転させる
さて今度は回転の話です。これはdrawImageの引数では指定できませんので、変形マトリックスを使います。これもまた2通りのやり方があります。 rotateメソッドでcanvasの変形をしてから、drawImageで貼り付ける transf...
Web canvas.drawImageで貼り付け先のサイズを調整する
位置調整が出来たら、今度は拡大縮小についてです。これについてもいくつかの方法があります。 drawImageメソッドの引数で貼り付けサイズを指定する scaleメソッドでcanvasの変形をしてから、drawImageで貼り付ける tran...