A Day in the Life

はてなブログ + Google Photos (というか Lightroom Classic の現像のカスタムファイル名) で、写真の exif を表示する

Google Photos のオリジナルデータには exif の情報が入っているので、こいつを exif-js でパースして表示、と思ったけどそもそも CORS 的に無理だった。

なので割と力業で表示させてみた。こんな感じで exif を表示してる。

やり方

Lightroom Classic のファイル書き出しで、カスタムファイル名にゴリっと必要そうな exif をいれちゃう。これでファイル名が長い jpg ファイルができあがる。なお私の環境だと、カスタムファイル名でカスタムテキストや、テンプレート以外の文字列を埋め込むと、高確率で Lightroom が落ちたり、意図したファイル名にならなかったりした。

少なくとも、Windows 環境(NTFS) + Windows の Google バックアップと同期 だと、意図したファイル名で Google Photos にアップロードされる。

はてなブログ側は、このファイル名を読み取って適当に HTML に挿入する JS をフッタなどに埋め込む。これで、このエントリーのような表示になる。力業で全然美しい方法では無い…。

document.addEventListener('DOMContentLoaded', function() {
  jQuery('img.magnifiable').each(function(_, e) {
    var filename = e.src.replace(/.*\//, '').replace(/\.*/, '');
    // YYYYMMDD__exif1__exif2__exif3 な lightroom から出力したファイル名。カスタムテキストは __ をセットしてセパレータに。
    var regexp = /^\d{8}__(.*)\.[^.]+$/;
    var matches = filename.match(regexp)
    if (matches) {
      var exif = decodeURI(decodeURIComponent(matches[1]))
        .replace(/__/g, ', ')
        .replace(/\+/g, ' ')
        .replace(/1-(\d+)\s/, '1/$1')
        .replace(' mm,', 'mm,')
        .replace(/ ISO (\d+)/, ' ISO$1')
        .replace(/\s\(f\s-\s(.+?)\)/, ', F$1');

      var exifElement = jQuery('<div/>', {
        text: exif,
        style: 'text-align: right; color: #AAAAAA; font-size: 80%; margin: -5px 5px 0 0;'
      });
      jQuery(e).parent().parent().append(exifElement);
    }
  });
});
撮影機材α7III/FE 24mm F1.4 GM

関連するかもエントリー

レンズやカメラごとのページ / 2021年1月9日
今日も風が強く、日が出ていたけど外の体感温度はだいぶ寒かった。このWebサイトに、Exif やメタデータから、記事で使ったカメラ・レンズなどを一覧表示するページを作った。jpeg に Exif があるものはそのデータをもとに、オールドレンズなどで Exif が無いものは mark...
今日も風が強く、日が出ていたけど外の体感温度はだいぶ寒かった。このWebサイトに、Exif やメタデータから、記事で使ったカメラ・レンズなど...
はてなブログで埋め込んだ Google Photos の長辺を変更する
Google Photos を手軽に埋め込める機能、とても便利なんだけど、長辺が 1024px で固定されてしまい小さい。この長辺を変更するには、textarea に埋め込まれた img src を直接変えることで対応できるのだけど、毎度の変更はめんどくさいので JavaScri...
Google Photos を手軽に埋め込める機能、とても便利なんだけど、長辺が 1024px で固定されてしまい小さい。この長辺を変更する...
Google Photos へ WebP 圧縮したファイルをアップロード
2021年5月末で Google Photos の実質無料が終わってしまい、その代替をどうするか問題。Google Photos は適切な共有もでき、アプリも写真検索・閲覧用途でも使いやすく(顔認識もあるしね)、また今あるフォトストレージの中では一番なくならなさそう、ということで...
2021年5月末で Google Photos の実質無料が終わってしまい、その代替をどうするか問題。Google Photos は適切な共...