写真サービス機能のブラウザ内実装 | 株式会社サイバーエージェント
2-1. リサイズ処理 Figure 2. Mobile Safariによる画像アップロード画面 最終成果の画像データを、サーバーサイドAPIにPOSTすることがゴールである。Androidにおいて、XMLHttpRequestでBlobをリクエストに設定しても空のボディで送信される問題がみられるため、今回はBase64 encoded DataURIとしてPOSTすることにしている。 2-1-1. 基本実装 ƒ 今回のリサイズ処理では、Canvas要素とFile APIを利用する。基本方針としては、inputtype='file'のchangeイベントから、Fileオブジェクトを取得し、それを一度Canvasに書き出すことでリサイズを試みる。最終的には、canvas.toDataURL() によってDataURIを取得する。 下記に、基本実装のサンプルを示す。( http://co
Commons Imaging – Commons
Imaging Overview Mailing Lists Issue Tracking Source Repository Javadoc Javadoc Archive Download Documentation Why Use Imaging Getting Started Sample Usage Format Support History Sanselan Incubation Status Reports References Sample Images Roadmap Project Documentation Project Information About Summary Team Source Code Management Issue Management Mailing Lists Dependency Information Dependency Mana
Dockerfile Best Practices
Dockerfiles provide a simple syntax for building images. The following are a few tips and tricks to help you get the most out of Dockerfiles. 1: Use the cache Each instruction in a Dockerfile commits the change into a new image which will then be used as the base of the next instruction. If an image exists with the same parent and instruction ( except for ADD ) docker will use the image instead of
画像を選ぶとbase64形式のURLに変更してくれる便利ツール「Image2Base64」:phpspot開発日誌
Image2Base64 | Image to Base64 Data URIs Converter Using the new HTML5 File API by Acid.JS | Version 1.0 画像を選ぶとbase64形式のURLに変更してくれる便利ツール「Image2Base64」。 ページを開くとダイアログが出るので、ローカルからファイルを指定するとブラウザ上に表示され、それをクリックすると、data:image/jpeg;base64〜の形式に変更してくれ、imgのsrc属性や、CSSのbackground:url の中にそのまんま指定できる便利ツールです。 とりあえず画像はimgでインラインとしてHTMLに埋め込んだり、CSSの中に埋め込んで高速化したいような場合に便利に使えるツールですね 対応ブラウザがもっともっと増えていけば一般に使えますね 関連エントリ ブラウ
ImageOptim — better Save for Web
ImageOptim makes images load faster Removes bloated metadata. Saves disk space & bandwidth by compressing images without losing quality. Faster web pages and apps Reduces image file sizes — so they take up less disk space and download faster — by applying advanced compression that preserves quality. Image files scrubbed clean Removes invisible junk: private EXIF metadata from digital cameras, em
簡単！リアルタイム画像変換をNginxだけで行う方法
先週金曜日（12/2）にクックパッドインフラ勉強会に参加しまして、そこで同社の成田さんから「今日からできるApacheモジュール開発と運用」という発表がありました。 リアルタイム画像変換モジュールの「TOFU」を開発するに至った経緯と、Apacheモジュール開発についてのお話でした。 TOFUは、S3に置かれたマスターとなる画像ファイルを取得し、与えられたパラメータでリアルタイム（オンザフライ）にリサイズ・トリミングを行うモジュール（mod_tofu）です。 料理を楽しくする画像配信システム 実際は、モジュールによる画像取得・変換をベースに、キャッシュや配信までも含めた一連の画像配信システムと言えそうです。 この仕組みをNginxを使って実装できないかと考えて、リアルタイム変換の仕組みをNginxだけで実現する方法を実験してみました。 準備するもの HttpImageFilterModul
Color Coherence Vectorで画像検索を作ってみた - きしだのHatena
ということで、昨日のColor Coherence Vector使って、似た画像を検索するプログラム作ってみた。 ちょっと簡単に似た画像を求めたいときには、なかなかよさげ。 左側がキーになる画像 ソースはこんな感じで。最初のパスには、画像のフォルダを入れてください。 画像のパスをテキストフィールドに入力して「検索」ボタンで探します。 import java.awt.*; import java.awt.image.BufferedImage; import java.io.*; import java.util.*; import java.util.List; import javax.imageio.ImageIO; import javax.swing.*; public class ColorCoherenceVectorSearch extends javax.swing.JFr
次世代HTMLの新仕様「レスポンシブ・イメージ（仮）」についてまとめてみた
レスポンシブWebデザインを実装する際、画像の扱いは一つの課題として残っています。現在、PHPを使用した「Adaptive Images」やJavaScriptを使った「Responsive-Images」などが現実的な対応策としてありますが、どちらもApacheの設定を必要とします。レスポンシブWebデザインが広まって標準的な実装方法の一つになろうとしている今、サーバサイド技術に依存しない解決策が早急に求められています。 そんな中、HTMLの仕様策定の一端を担うWHATWG（Web Hypertext Application Technology Working Group – ワットダブルジーと読む）で、新たな仕様が検討されています。 では、どんな議論がされていて、今どんな状況なのか？ なかなか複雑なことになっているようなので、調べてまとめてみました。 ※この記事は、レスポンシブWeb
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
業務アプリケーションにおけるモダンWeb開発の現状ーHTML5開発って簡単なの？
林檎商人の開発日記:Java - livedoor Blog（ブログ）
PHP サムネイル用正方形画像の生成 | h19e