HTML5 Canvasで画像のリサイズするならコレ！「JS-Image-Resizer」
クライアントサイドでのHTML5での画像のリサイズは普通Canvasを使うだろう。 しかし、実際にCanvasのリサイズをやってみて、そのクオリティーの低さに驚いた。 1. Canvasでリサイズ これがMacのPreviewでリサイズしたもの。 ジャギジャギしてて画像としての価値は大きく下がってしまう。 Flashなんかだと、デフォルトでまあまあのクオリティーのスムージングがかかるのであまり気にすることはなかったが、こりゃダメダメだ。 2. Lanczosアルゴリズムでリサイズ そこで、もっとハイクオリティにリサイズする方法は無いかと調べた。まずあたったのはこちら。 javascript - Resizing an image in an HTML5 canvas - Stack Overflow これはLanczosアルゴリズムでリサイズする方法だ。 ハンガリーの人「Cornelius
HTML5 Canvasを使った画像の拡大＋アニメーション - システム開発ブログ （システム開発のアイロベックス｜東京都新宿区の業務システム開発会社）
みなさん、こんにちは。 突然ですが、こちらの記事に触発され、HTML5 Canvasを少しは触ってみようと思い、 画像の拡大を行うJavaScriptのコードを書いてみました。 ただ拡大するだけではつまらない（その辺にいくらでも転がっている）ので、 マウスがクリックされている間、 クリックされた位置を中心に拡大するアニメーションを追加してみました。 HTMLコード <!DOCTYPE html> <html> <head> <meta charset="shift-jis"> </head> <body OnLoad="init()"> <canvas id="canvas" width="661" height="500" style="border:1px solid #CCC;"></canvas> </body> </html> JavaScriptコード var ti
ActionScript入門Wiki - Arctic.js
AS3ライクに記述できるJavaScriptゲームライブラリです。(ライセンスはMIT License) ダウンロード - https://github.com/DeNADev/Arctic.js <html> <head> <script type="text/javascript" src="js/arctic.js"></script> <script type="text/javascript" src="js/game.js"></script> </head> <body> <canvas id="canvas"></canvas> </body> </html> (function() { // arcGameクラスを継承したメインクラス var Main = arc.Class.create(arc.Game, { // コンストラクタ(必要なら引数を指定) initial
Akiba Hideki is under construction
Thank you for being patient. We are doing some work on the site and will be back shortly.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
