スキップしてメイン コンテンツに移動

投稿

ラベル(Picasa)が付いた投稿を表示しています

Javascriptで実装された画像ギャラリーライブラリ

(2020年5月更新) こちらの下記理由により、デモを非公開にしました。 picasaはもうGoogle Photosに統合されてAPIが変わった。 Gallerifficももうアクティブに開発されていない。JQueryのプラグイン化されたようです。 記録目的で記事は残してあります。 Javascriptで実装された画像ギャラリーのライブラリ集です。 試しにいくつか使ってみた中で実際に使えると思ったものを選びました。 他にもかっこいいものがいっぱいあるのですが、実際使うとなると、なかなか厳しい(=使いにくい)ものも多いです。 最近はブラウザのJavascriptエンジンの性能も上がっていますし、HTML5やCSS3も徐々に浸透してきていますので、 ブラウザでお手軽に見栄えのするものが作れるのが魅力かなと思います。 注意点をいくつか。 上記のデモの場合、1つのオリジナル画像につき、「75px程度の正方形にクロップされた画像」と「幅が500px程度にサイズ変更された画像」の2つが必要です。 Picasaについては画像サイズを指定してクエリを投げられるので、ちょうどよい大きさの画像のクエリを作成して投げれば簡単にサムネイルが画像を取得できます。 肝はデモで使っているURLの https://picasaweb.google.com/data/feed/api/all?alt=rss&kind=photo&thumbsize=72c,512&access=public&imgmax=1600&hl=en_US&max-results=50 のthumbsize=72c,512の部分です。 簡単に説明しますと、サイズの後にcをつけると画像を正方形にクロップしてくれます。何もつけないとアスペクト比を固定して画像をリサイズしてくれます。 詳しく知りたい方は Picasa Data APIの公式ドキュメント を参照してください。 自分で大量の画像のサイズ変更するのは面倒くさいと思います。私の場合はJavaやC#で画像サイズを変更するプログラムを書きました。バッチ処理が可能な画像処理用のソフトを使うのもいいかもしれません。 C#のコードは簡潔で、実行性能もいいので載せておきます。画像を指定したサイズの正方形