【ReactNative開発】Expo-Image-Pickerで画像のGPS/EXIF情報を取得する

こんにちは。今日は、ReactNative+Expoのアプリで、画像のGPS情報を取得する方法について整理しておきます。

それでは早速参ります。

コードの実装

React Native + Expoで開発しているアプリの場合、デバイスのライブラリからの画像の選択などは、Expo-Image-Pickerを使う場合が多いかと思います。

この記事の目的はGPS情報の取得にフォーカスしているので、その前段の実装については割愛します。以下のDocにサンプルもありますので、参考にできるかと思います。

https://docs.expo.dev/versions/latest/sdk/imagepicker/

さて、GPS情報を取得する際のコードの実装ですが、とても簡単です。GPS情報を含む絵EXIFタグの取得を有効化するため、以下のオプションを追加するだけです。

const params = {
        mediaTypes: ImagePicker.MediaTypeOptions.Images,
        allowsEditing: false,
        quality:  0.5,
        exif: true,★これを追加

await ImagePicker.launchImageLibraryAsync(params)

exif (boolean) — Whether to also include the EXIF data for the image. On iOS the EXIF data does not include GPS tags in the camera case.

EXIFとは?

困った時はまずWikipediaさんです。

https://ja.wikipedia.org/wiki/Exchangeable_image_file_format

さて、このオプションを指定して取得できる情報を確認しておきます。

今回は、iOSのライブラリにデフォルトで入っている写真に対して、EXIF情報を取得してみました。

  "exif": Object {
    "ApertureValue": 6.643855776306108,
    "ColorSpace": 1,
    "ComponentsConfiguration": Array [
      1,
      2,
      3,
      0,
    ],
    "Contrast": 0,
    "CustomRendered": 0,
    "DateTimeDigitized": "2012:08:08 14:55:30",
    "DateTimeOriginal": "2012:08:08 14:55:30",
    "DigitalZoomRatio": 1,
    "ExifVersion": Array [
      2,
      3,
    ],
    "ExposureBiasValue": 0,
    "ExposureMode": 1,
    "ExposureProgram": 1,
    "ExposureTime": 20,
    "FNumber": 10,
    "FileSource": 3,
    "Flash": 16,
    "FlashPixVersion": Array [
      1,
      0,
    ],
    "FocalLenIn35mmFilm": 16,
    "FocalLength": 16,
    "FocalPlaneResolutionUnit": 4,
    "FocalPlaneXResolution": 204.840206185567,
    "FocalPlaneYResolution": 204.840206185567,
    "GPSAltitude": 107.46666666666667,
##### GPS情報 ここから #####
    "GPSGPSVersion": Array [
      2,
      3,
      0,
      0,
    ],
    "GPSImgDirection": 265.8132992327366,
    "GPSImgDirectionRef": "T",
    "GPSLatitude": 63.5314,
    "GPSLatitudeRef": "N",
    "GPSLongitude": 19.5112,
    "GPSLongitudeRef": "W",
    "GPSMapDatum": "WGS-84",
    "GPSSpeed": 2.0533344256922823,
    "GPSSpeedRef": "K",
##### GPS情報 ここまで #####
    "GainControl": 0,
    "ISOSpeedRatings": Array [
      200,
    ],
    "LightSource": 0,
    "MaxApertureValue": 4,
    "MeteringMode": 5,
    "Orientation": 1,
    "PixelXDimension": 3000,
    "PixelYDimension": 2002,
    "Saturation": 0,
    "SceneCaptureType": 0,
    "SensingMethod": 2,
    "Sharpness": 0,
    "ShutterSpeedValue": -4.321927997619756,
    "SubjectDistRange": 0,
    "SubsecTimeDigitized": "4",
    "SubsecTimeOriginal": "4",
    "WhiteBalance": 0,
  },

上のサンプルからも、GPSの緯度・経度情報が含まれていることがわかりました!

以上、短いですがExpo-Image-PickerでGPS情報を取得するまで、でした!

おしまい

この記事を気に入っていただけたらシェアをお願いします!

コメントを残す

メールアドレスが公開されることはありません。

ABOUT US

Yuu113
初めまして。Yuu113と申します。 兵庫県出身、東京でシステムエンジニアをしております。現在は主にデータ分析、機械学習を活用してビジネスモデリングに取り組んでいます。 日々学んだことや経験したことを整理していきたいと思い、ブログを始めました。旅行、カメラ、IT技術、江戸文化が大好きですので、これらについても記事にしていきたいと思っています。