画像ビューワー

撮影画像を表示して写った魚の数を記録しましょう。

画像ビューワーの目的

パラパラビューワーの画面

パラパラビューワー の画面

水中タイムラプス撮影で得られた一連の画像を順番に表示して、 魚が写っているかどうかを確認します。 魚が写った画像があれば、その画像ファイル名と、魚の種類や数を記録します。 パラパラビューワー は、 タイムラプス撮影画像を順番に表示して、 写った魚の種類や数を記録するのに便利な画像ビューワーです。 Google Chromeや、Firefox、Mac Safariで動作し、 ダウンロードすればオフラインでも使用できます。 ここでは、パラパラビューワー の使い方を説明します。

>>パラパラビューワー はこちら

パラパラビューワー の使い方(1)-画像の表示-

パラパラビューワーの操作ボタン

操作ボタン、ファイル選択ボタン

パラパラビューワー を開くと、 あらかじめビューワーに組み込まれたサンプル画像が表示されます。 サンプル画像は計4枚組み込まれていて、 画像の上部にある"Next"ボタンをクリックまたは 右矢印キー(→)で次の画像が表示されます。 "Prev"ボタンをクリックまたは 左矢印キー(←)で前の画像に戻ります。 "Start"ボタンをクリックまたは 上矢印キー(↑)で複数画像が順番に表示され、 "Stop"ボタンをクリックまたは下矢印キー(↓)で停止します。

画像をクリックするとフルスクリーン表示になり、 フルスクリーン時は、矢印キーで操作できます。 フルスクリーンから元に戻るには、画像を再度クリックするか Escキーを押します。

手元の画像を表示するには、 "ファイル選択"ボタンをクリックし、表示したい画像ファイルを選択します。 このとき、Shift+矢印キーを使うと複数の画像ファイルを選択できます。 複数の画像ファイルを選択したら、 "Start"ボタンをクリックまたは上矢印キー(↑)で画像が順番に表示されます。 表示間隔は"Interval (ms)"フィールドでミリ秒単位で設定可能で、 デフォルトでは1000 ms(1秒)になっています。 "Image orientation"フィールドでは、画像の向きを選択できます。

パラパラビューワー の使い方(2)-写った魚の記録-

パラパラビューワーのAdd noteボタン

Add note ボタン

魚の写った画像があれば、画像ファイル名と、魚の種類や、数を記録しましょう。 "Add note"ボタンをクリックすると、 { "img":"img01.jpg", "site":"abc", "spname":0 } のような文字列がテキストボックスに追加されます。 この文字列は、表示されている画像のファイル名と、 "Default note"フィールドに設定された文字列が連結されたもので、 { "img":"画像ファイル名", "site":"撮影地点", "魚の種類":数 } のような書式になっています。 これを編集し、画像中に写った魚の種類と数を記録します。 例えばスズキが2匹写っていれば、 { "img":"img01.jpg", "site":"abc", "スズキ":2 } のように書き換えます。

"site":"abc" の部分には、撮影地点を記入します。 地点xyzで撮影された一連の画像を表示し、写った魚を記録する場合は、 あらかじめ、"Default note"の "site":"abc" を "site":"xyz" に書き換えておくと毎回地点名を入力せずに済みます。 記録の書式は、"文字":"文字", "数値":0 のように、 文字は""で囲い、数値は囲わずに書きます。

パラパラビューワー の使い方(3)-記録の保存-

パラパラビューワーのExport noteボタン

Export note ボタン

記録した画像ファイル名や、魚の種類、数を保存するには、 "Export note"ボタン をクリックします。 ボタンをクリックすると、右側にリンクが表示されるので、 リンクを右クリックし、”名前を付けてリンク先を保存” します。

"Export note"ボタンでは、JSON形式で記録が出力されます。 JSON形式では以下のような書式になります。

[{"img":"img01.jpg","site":"abc","スズキ":2},
{"img":"img02.jpg","site":"abc","ガザミ":1},
{"img":"img03.jpg","site":"xyz","クロダイ":1},
{"img":"img04.jpg","site":"xyz","アカエイ":1}]

"Export csv"ボタンでは、CSV形式で記録が出力されます。 CSV形式では以下のような書式になります。

img,site,スズキ,ガザミ,クロダイ,アカエイ
img01.jpg,abc,2,,,
img02.jpg,abc,,1,,
img03.jpg,xyz,,,1,
img04.jpg,xyz,,,,1

"Export sum"ボタンをクリックすると、 グループ毎("site"毎)に数値データ("スズキ"等の数)が合計され、 CSV形式で出力されます。"site"毎の合計データは以下のようになります。

site,スズキ,ガザミ,クロダイ,アカエイ
abc,2,1,0,0
xyz,0,0,1,1

グラフ化

Rの実行画面

R の実行画面

記録した魚の種類、数のデータをグラフにしてみましょう。 ここでは R(アール) を使ってグラフを作成します。 R はデータの統計解析やグラフ化に便利なプログラミング言語とその実行環境で、無償で利用可能です。 R をインストールするには、 こちらのサイト(CRAN) からインストーラーをダウンロードし、ダウンロードしたインストーラーを実行します。

グラフ化 その1

"Export sum"ボタンを使って出力した、 グループ毎("site"毎)の合計データファイル(data.csv)を R で読み込み、グラフに表示してみましょう。 データファイルを R に読み込むには、 R を起動後、ファイル > ディレクトリの変更 メニューから、 作業ディレクトリをデータファイルの置いてある場所に変更して、 R Console画面に 以下のコードを入力し、実行します。

data <- read.csv("data.csv", fileEncoding="utf-8", row.names=1)
data

上のコードを実行すると、読み込んだデータが以下のように R Console画面に表示されます。

    スズキ ガザミ クロダイ アカエイ
abc      2      1        0        0
xyz      0      0        1        1

続いて、棒グラフを表示するため、データを整形します。

t(as.matrix(data)) # matrix型に変換、データの行列を入れ替え 
         abc xyz
スズキ     2   0
ガザミ     1   0
クロダイ   0   1
アカエイ   0   1

最後に、棒グラフを表示するコマンドを実行します。

barplot(
  t(as.matrix(data)),
  legend.text = colnames(data),
  beside = TRUE,
  col = topo.colors(length(colnames(data))),
  xlab = "Site",
  ylab = "Total count",
  las = 1 )
Rで作成した棒グラフ
R で作成した棒グラフその1

グラフ化 その2

"Export note"を使って出力したJSON形式のファイル (note.json) を R で読み込むには、以下のようにします。 あらかじめ、パッケージ > パッケージのインストール から、 jsonliteパッケージをインストールしておきます。

library(jsonlite)
data <- fromJSON("note.json")
data
        img site スズキ ガザミ クロダイ アカエイ
1 img01.jpg  abc      2     NA       NA       NA
2 img02.jpg  abc     NA      1       NA       NA
3 img03.jpg  xyz     NA     NA        1       NA
4 img04.jpg  xyz     NA     NA       NA        1
data[is.na(data)] <- 0 # NA(欠損値)を0に置換
data
        img site スズキ ガザミ クロダイ アカエイ
1 img01.jpg  abc      2      0        0        0
2 img02.jpg  abc      0      1        0        0
3 img03.jpg  xyz      0      0        1        0
4 img04.jpg  xyz      0      0        0        1

jsonファイルを Rに読み込むことができました。

このデータを"site"毎に集計するには、以下のようにします。

data[data$site=="abc",-(1:2)] # siteが"abc"のデータ(最初の2列を除く)
  スズキ ガザミ クロダイ アカエイ
1      2      0        0        0
2      0      1        0        0
abc <- apply(data[data$site=="abc",-(1:2)], 2, sum) # siteが"abc"のデータを合計
abc
  スズキ   ガザミ クロダイ アカエイ
       2        1        0        0
xyz <- apply(data[data$site=="xyz",-(1:2)], 2, sum) # siteが"xyz"のデータを合計
xyz
  スズキ   ガザミ クロダイ アカエイ
       0        0        1        1
sumdata <- rbind(abc, xyz)
sumdata
    スズキ ガザミ クロダイ アカエイ
abc      2      1        0        0
xyz      0      0        1        1

データを"site"毎に集計できました。

以下のようにしても同様に集計できます。

library(jsonlite)
data <- fromJSON("note.json")
data[is.na(data)] <- 0 # NA(欠損値)を0に置換
sites <- levels(as.factor(data$site))
sumdata <- NULL
for (s in sites) {
  sumdata <- rbind(sumdata, apply(data[data$site==s,-(1:2)], 2, sum))
}
rownames(sumdata) <- sites
sumdata
    スズキ ガザミ クロダイ アカエイ
abc      2      1        0        0
xyz      0      0        1        1

棒グラフの表示は先ほどと同様です。 以下のコードを実行すると、棒グラフをpng画像として保存します。 棒グラフの色は先ほどとは異なる色パターンに変えています。

png("barplot2.png", pointsize=14) # グラフをpng画像に出力
barplot(
  t(sumdata),
  legend.text = colnames(sumdata),
  beside = TRUE,
  col = rainbow(length(colnames(sumdata))),  
  xlab = "Site",
  ylab = "Total count",
  las = 1 )
dev.off() # png画像への出力をオフ
Rで作成した棒グラフ
R で作成した棒グラフその2

グラフ化 その3

次のような、複数のjsonファイルを Rに読み込んで結合し、集計、グラフ化するには、以下のようにします。

note.json

[{"img":"img01.jpg","site":"abc","スズキ":2},
{"img":"img02.jpg","site":"abc","ガザミ":1},
{"img":"img03.jpg","site":"xyz","クロダイ":1},
{"img":"img04.jpg","site":"xyz","アカエイ":1}]

note2.json

[{"img":"img05.jpg","site":"uvw","クロダイ":1},
{"img":"img06.jpg","site":"uvw","クロダイ":1},
{"img":"img07.jpg","site":"uvw","アカエイ":1},
{"img":"img08.jpg","site":"uvw","ボラ":1}]

あらかじめ Rの ファイル > ディレクトリの変更 メニューから note.jsonnote2.json の置いてあるフォルダを選択した後、以下のコードを実行します。

library(jsonlite)
files <- list.files(pattern=".json") # 作業ディレクトリ内のjsonファイル一覧
files
[1] "note.json"  "note2.json"
pages <- list() # 空のリスト
for(i in 1:length(files)) {
  data_i <- fromJSON(files[i])
  pages[[i]] <- data_i
}
pages
[[1]]
        img site スズキ ガザミ クロダイ アカエイ
1 img01.jpg  abc      2     NA       NA       NA
2 img02.jpg  abc     NA      1       NA       NA
3 img03.jpg  xyz     NA     NA        1       NA
4 img04.jpg  xyz     NA     NA       NA        1

[[2]]
        img site クロダイ アカエイ ボラ
1 img05.jpg  uvw        1       NA   NA
2 img06.jpg  uvw        1       NA   NA
3 img07.jpg  uvw       NA        1   NA
4 img08.jpg  uvw       NA       NA    1
data <- rbind.pages(pages) # 結合
data[is.na(data)] <- 0 # NA(欠損値)を0に置換
data
        img site スズキ ガザミ クロダイ アカエイ ボラ
1 img01.jpg  abc      2      0        0        0    0
2 img02.jpg  abc      0      1        0        0    0
3 img03.jpg  xyz      0      0        1        0    0
4 img04.jpg  xyz      0      0        0        1    0
5 img05.jpg  uvw      0      0        1        0    0
6 img06.jpg  uvw      0      0        1        0    0
7 img07.jpg  uvw      0      0        0        1    0
8 img08.jpg  uvw      0      0        0        0    1

複数の jsonファイルを Rに読み込んで結合できました。

このデータを"site"毎に集計し、グラフ化するには、これまでと同様、以下のようにします。

sites <- levels(as.factor(data$site))
sumdata <- NULL
for (s in sites) {
  sumdata <- rbind(sumdata, apply(data[data$site==s,-(1:2)], 2, sum))
}
rownames(sumdata) <- sites
sumdata
    スズキ ガザミ クロダイ アカエイ ボラ
abc      2      1        0        0    0
uvw      0      0        2        1    1
xyz      0      0        1        1    0
barplot(
  t(sumdata),
  legend.text = colnames(sumdata),
  beside = TRUE,
  col = rainbow(length(colnames(sumdata))),
  xlab = "Site",
  ylab = "Total count",
  las = 1 )
Rで作成した棒グラフ
R で作成した棒グラフその3