Java OpenCV Lv2 〜画像を表示する〜

インントロダクション

今までJavaFXだとか、根深いビデオキャプチャの問題があるとかやってきましたが。。。

OpenCVを学ぶのにそんなのはほっといても良いことに気がつきました。

単純に画像を表示できればOK!

参考サイト

https://www.tutorialspoint.com/opencv/opencv_gui.htm

<今までこんなことをやってきました。(OpenCV編)>

Eclipse セットアップ

  1. Java Install Eclipse〜開発ツールのインストール〜
  2. TensorFlow C++環境〜EclipseにCDTをインストール〜
  3. Setup OpenGL with Java〜JOGLを使う準備 for Eclipse〜
  4. Eclipse Meven 開発手順〜プロジェクトの作成〜
  5. Java OpenCV 環境セットアップ(on Mac)

OpenCV

  1. Java OpenCV 環境セットアップ(on Mac)
  2. Java OpenCv Lv1 〜入門: 写真の表示〜
  3. Java OpenCV Lv2 〜画像を表示する〜
  4. Java OpenCV Lv3 〜画像の平滑化(smooth())〜

<実行結果>

<実装したコードにコメント>


<作成したコード>

import java.awt.image.BufferedImage;
import java.io.ByteArrayInputStream;
import java.io.IOException;
import java.io.InputStream;

import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JLabel;

import org.opencv.core.Core;
import org.opencv.core.Mat;
import org.opencv.core.MatOfByte;
import org.opencv.imgcodecs.Imgcodecs;

/**
 * @author takunoji
 *
 * 2018/11/18
 */
public class TrainOpenCV {
	static {
		// OpenCVライグラリ
		System.loadLibrary(Core.NATIVE_LIBRARY_NAME);
	}
	public static void main(String[] args) {
		Mat image = Imgcodecs.imread(TrainOpenCV.class.getClass().getResource("/images/Experience.png").getPath());
		MatOfByte bytes = new MatOfByte();
		Imgcodecs.imencode(".png", image, bytes);
		byte[] b = bytes.toArray();
		InputStream in = new ByteArrayInputStream(b);
		BufferedImage buf = null;
		try {
			buf = ImageIO.read(in);
		} catch(IOException e) {
			e.printStackTrace();
		}
		// Create Swing Compoenent
		JFrame frame = new JFrame("Show Image");
		frame.getContentPane().add(new JLabel(new ImageIcon(buf)));
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.pack();
		frame.setVisible(true);
	}
}

明日から、こっちのコードでOpenCVの仕組みを学んでいこうと思います。

お疲れ様でした。

Java OpenCV Lv2 〜JavaFXでの画像表示〜

イントロダクション

前回は、写真などを表示しようと試みましたがImShowメソッドが使用できないということで、JavaFXを使用してやる方向にしました。

参考サイト;Java版OpenCVチュートリアル(英語です)

<工程>

  1. Eclipseのインストール
  2. OpenCVインストール
  3. JavaでOpenCVのライブラリを起動する(工程2の記事でやりました)
  4. JavaFXで写真を表示してみる(今回実行します)

画像(イメージ)表示の準備

こちらのサイトを参考にしてやります。

大雑把に上記の<工程>にあるようなことが書いてありました。今までに<工程>の1、2をやったので3からいきます。

<前提>

JavaFXでの画面作成のためにSceneBuiderをセットアップします。

  1. Eclipse SceneBuilderを追加する
  2. JavaFX SceneBuilder 〜EclipseとSceneBuilder連携~


JavaFXの実装

ソースコードはGITにあるものを参照(参考サイトより)

<今回の作成するアプリ構成>

ソースはGitにアップロードしてあります。

<Main.java>

import org.opencv.core.Core;

import javafx.application.Application;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.fxml.FXMLLoader;

/**
 * OpenCVnogaの学習用のGUIを作成する。
 * JavaFXで画面を作成している
 * 1.SceneBuilderでFXMLを出力
 * 2.FXMLで取得したコンポーネントを表示する
 * 
 * @author takunoji
 * 2018/11/18
 */
public class Main extends Application {
	/**
	 * このアプリケーション(Mainメソッド)が起動する前に
	 * 起動(OpenCVのロード)する
	 */
	static {
		System.loadLibrary(Core.NATIVE_LIBRARY_NAME);
	}
	/**
	 * スーパクラスApplication)のstartメソッドを起動する
	 * オーバーライドしているので、本当は親クラスのメソッドが起動するが
	 * 子クラスで上書きするので、このクラスを起動した時にはこちらのメソッドが起動する。
	 */
	@Override
	public void start(Stage primaryStage) {
		try {
			// FXMLをロード
			BorderPane root = (BorderPane)FXMLLoader.load(getClass().getResource("OpenCvTest.fxml"));
			// 表示領域を作成する
			Scene scene = new Scene(root,400,400);
			// JavaFX用のCSSを適用する
			scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
			// Sceneをステージに設定する
			primaryStage.setScene(scene);
			// 表示処理
			primaryStage.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	/**
	 * メインメソッド。
	 * JavaFXの規定部品
	 * Application{@link #start(Stage)}を起動する
	 * 
	 * @param args プログラム引数
	 */
	public static void main(String[] args) {
		// スーパークラス(親)のメソッドを起動する
		launch(args);
	}
}

<OpenCvController.java>

/**
 * FXMLで定義したコントローラクラス。
 * 参考サイトを写経しようとしたが、ソースを少しいじる
 * 基本的には写経している。
 * @see 
 * @author takunoji
 * 2018/11/17
 */
public class OpenCvController {
	 /** FXML定義のボタン */
	@FXML
	private Button button;
	/** FXML定義のImageViewer */
	@FXML
	private ImageView currentFrame;
	
	/** ビデオキャプチャ */
	private VideoCapture capture = new VideoCapture();
	
	private ScheduledExecutorService timer;
	// a flag to change the button behavior
	private boolean cameraActive = false;
	// the id of the camera to be used
	private static int cameraId = 0;
	
	/**
	 * ボタン押下時のアクション処理。
	 * "@FXML"アノテーションでFXMLとの同期を取っている
	 * @param event ボタン押下のイベント
	 */
	@FXML
	protected void startCamera(ActionEvent event) {
		// カメラがアクティブ状態の時は停止する
		if (this.cameraActive) {
			this.cameraActive = false;
			this.button.setText("Start Camera");
			this.stopAcquisition();
			// 処理終了
			return;
		}
		// カメラ
		this.capture.open(this.cameraId);
		// カメラが開いていない時
		if (this.capture.isOpened() == false) {
			// エラーログを出力して処理を終了する
			System.err.println("Impossible to open the camera connection...");
			return;
		}
		// カメラが正常に開いている時
		this.cameraActive = true;
		// 匿名クラス
		Runnable frameGrabber = new Runnable() {
			@Override
			public void run() {
				Mat frame = grabFrame();
				Image imageToShow = Utils.mat2Image(frame);
				updateImageView(currentFrame, imageToShow);
			}
		};
		this.timer = Executors.newSingleThreadScheduledExecutor();
		this.timer.scheduleAtFixedRate(frameGrabber, 0, 33, TimeUnit.MILLISECONDS);
		this.button.setText("Stop Camera");
	}

	/**
	 * 開いているビデオストリームからフレームを取得する
	 * @return {@link Mat}
	 */
	private Mat grabFrame() {
		Mat frame = new Mat();
		if (this.capture.isOpened()) {
			try {
				this.capture.read(frame);
				if (frame.empty() == false) {
					Imgproc.cvtColor(frame, frame, Imgproc.COLOR_BGR2GRAY);
				}
				
			} catch(Exception e) {
				System.err.println("Exception during the image elaboration: " + e);
			}
		}
		return frame;
	}

	private void stopAcquisition() {
		if (this.timer != null && this.timer.isShutdown() == false) {
			try {
				this.timer.shutdown();
				this.timer.awaitTermination(33, TimeUnit.MICROSECONDS);
			} catch(Exception e) {
				// log any exception
				System.err.println("Exception in stopping the frame capture, trying to release the camera now... " + e);
			}
		}
		// @FIXME-[カメラを解放するだけで良い?]
		if (this.capture.isOpened()) {
			this.capture.release();
		}
	}
		/**
		 * Update the {@link ImageView} in the JavaFX main thread
		 * 
		 * @param view
		 *            the {@link ImageView} to update
		 * @param image
		 *            the {@link Image} to show
		 */
		private void updateImageView(ImageView view, Image image) {
			Utils.onFXThread(view.imageProperty(), image);
		}
		
		/**
		 * On application close, stop the acquisition from the camera
		 */
		protected void setClosed() {
			this.stopAcquisition();
		}
}

ボタンを押下したらエラーが出た!

下のキャプチャのようにbottunの変数名とIDが違っていると次のようなエラーが出ます。

 

Exception in thread "JavaFX Application Thread" java.lang.RuntimeException: java.lang.reflect.InvocationTargetException

<BorderPane xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="zenryokuservice.opencv.fx.OpenCvController">
   <center>
      <BorderPane prefHeight="522.0" prefWidth="410.0" BorderPane.alignment="CENTER">
         <bottom>
            <Button fx:id="start_btn" mnemonicParsing="false" onAction="#startCamera" text="StartCamera" BorderPane.alignment="CENTER" />
         </bottom>
         <center>
            <ImageView fx:id="currentFrame" fitHeight="248.0" fitWidth="234.0" pickOnBounds="true" preserveRatio="true" BorderPane.alignment="CENTER" />
         </center>
      </BorderPane>
   </center>
</BorderPane>

上のコード赤字の部分を変数名に合わせます。「button」に修正。

<問題>

このVideoCaptureを起動し、閉じるときにメモリの使用量の部分(そのほかにもあるかも?)で問題があります。

ソースの方では、カメラを停止したときに「System.gc()」でメモリを解放するようにしたのですが、操作を早くするとクラッシュします。

この部分は、根深い問題なのでとりあえずは、飛ばしてOpenCVを学んでいくようにします。。。

エラーログ

#
# A fatal error has been detected by the Java Runtime Environment:
#
#  SIGSEGV (0xb) at pc=0x00007fffcfe13017, pid=1748, tid=0x000000000001560f
#
# JRE version: Java(TM) SE Runtime Environment (8.0_144-b01) (build 1.8.0_144-b01)
# Java VM: Java HotSpot(TM) 64-Bit Server VM (25.144-b01 mixed mode bsd-amd64 compressed oops)
# Problematic frame:
# C  [libobjc.A.dylib+0x7017]  objc_msgSend+0x17
#
# Failed to write core dump. Core dumps have been disabled. To enable core dumping, try "ulimit -c unlimited" before starting Java again
#
# An error report file with more information is saved as:
# /XXX/git/OpenCvFX/OpeCvFX/hs_err_pid1748.log
#
# If you would like to submit a bug report, please visit:
#   http://bugreport.java.com/bugreport/crash.jsp
# The crash happened outside the Java Virtual Machine in native code.
# See problematic frame for where to report the bug.
#

 

関連ページ一覧

<JavaFXの準備>

  1. EclipseにSceneBuilderを追加する
  2. JavaFX SceneBuilder 〜EclipseとSceneBuilder連携~
  3. Java OpenCv Lv1 〜入門: 写真の表示〜
  4. Java OpenCV Lv2 〜JavaFXでの画像表示〜
    1. バグを回収しました。

Java OpenCv Lv1 〜入門: 写真の表示〜

イントロダクション

前々回に、家計簿アプリのグラフ部分を作成が一区切りついたので今度は入力部分を作成しようとOpenCvに着手しました。

今までにやってきたこと

そして、入力部分は手入力を行いたくないのでアプリケーションに入力させようと思うのです。つまり、アプリのユーザーはレシートの写真をとるだけ(カテゴリの追加などは別です)という仕様にしようと思い現在に至る次第です。

まずは、OpenCv in Javaと、JUnitのセットアップを行いました。

OpenCvを学ぶ

画像から文字を取得することが最優先なのですが、なんだかんだと初めから学ぶことになりそうなので初っ端から学び始めてしまおうと思います。※OpenGLをやった時に途中から学んだけど初めからやり直しました。。。

画像を表示する

上のツイート画像にある様にその本に書いてあることを実行します。よくわからなかったら、とりあえず進んで見れば良いのです。

※危険な事は神経質になった方が良い、痛い目にあいます。。。

そんなわけで、上記の18ぺーじにC/C++で書かれたソースがあります。そいつをJavaに書き換えて実行します。

駄菓子菓子、OpenCV3.XからはImShowメソッドが、HightGUIが使用できない(しない)仕様になったということで。。。

JavaFXで実装します。続きは以下参照でお願いします。

Eclipse SceneBuilderを追加する – PGボックス

www.youtube.com


JavaFX SceneBuilder 〜EclipseとSceneBuilder連携~ – PGボックス

www.youtube.com

関連ページ一覧

  1. Java OpenCV 環境セットアップ(on Mac)
  2. Java OpenCv Lv1 〜入門: 写真の表示〜
  3. Java OpenCV Lv2 〜画像を表示する〜
  4. Java OpenCV Lv3 〜画像の平滑化(smooth())〜
  5. Java OpenCV Lv3 〜画像にガウシアンフィルタ(GaussianBlur())〜
  6. Java OpenCV Lv3 〜画像に中央値フィルタ(medianBlur())〜
  7. Java OpenCV Lv4 〜画像の中身をみてみる〜
  8. Java OpenCV Lv5 〜Matクラスで描画処理〜
  9. Java OpenCV Lv6 〜Matクラスで背景から作成してみる〜
  10. Java OpenCV Lv7 〜MatクラスでEllipseしてみる〜
  11. Java OpenCV Lv9 〜画像編集「足し算」(cvAdd)〜
  12. Java OpenCV Lv9 〜画像編集「引き算」(cvSubtract)〜
  13. Java OpenCV Lv9 〜画像の掛け算〜
  14. Java OpenCV Lv10 〜行列演算Mat#submat()〜
  15. Java OpenCv Lv10〜画像の平均値をだす〜

Java OpenCv Hello in Java〜OpenCv事始め〜

イントロダクション

ついに最近流行りの技術「人工知能」への入り口画像解析を始めたいと思います。以前、中途半端にPythonでOpenCvを使ったのですが、すごく簡単に扱えて「あ〜したらこ〜なる」なんてことを考えさせられる。。。そんなフレームワークだと思います。

参考サイト:https://www.tutorialspoint.com/opencv/opencv_reading_images.htm

 

事始めということで

年の瀬も近いのに「事始め」とはおかしな話ですが。。。思い立ったが吉日やらないわけには行きません。
そんなわけで早速サンプルコードを見てみます。

import org.opencv.core.Core; 
import org.opencv.core.Mat;  
import org.opencv.imgcodecs.Imgcodecs;
 
public class ReadingImages {
   public static void main(String args[]) { 
      //Loading the OpenCV core library  
      System.loadLibrary( Core.NATIVE_LIBRARY_NAME ); 
     
      //Instantiating the Imagecodecs class 
      Imgcodecs imageCodecs = new Imgcodecs(); 
     
      //Reading the Image from the file  
      String file ="C:/EXAMPLES/OpenCV/sample.jpg"; 
      Mat matrix = imageCodecs.imread(file);
     
      System.out.println("Image Loaded");     
   } 
}

赤字で書いている部分が気になったのでJavaDocAPIを参照してみます。

参考サイトからコードをパクった感じにして以下の様にコードを組みました。

<読み込んだ画像>


<実行結果>

import org.opencv.core.CvType;
import org.opencv.core.Mat;
import org.opencv.imgcodecs.Imgcodecs;

/**
 * OpenCVの機能を実装するクラス。
 * 
 * @author takunoji
 *
 * 2018/11/11
 */
public class ReceiptCv {
	Imgcodecs imgCodecs;
	static {
		System.loadLibrary("opencv_java343");
	}

	public static void main(String[] args) {
		ReceiptCv rece = new ReceiptCv();
		rece.loadImg("download-1.jpg");
	}

	/**
	 * コンストラクタ
	 */
	public ReceiptCv() {
		imgCodecs = new Imgcodecs();
		
	}
	
	private void loadImg(String fileName) {
		Mat matrix = Imgcodecs.imread(getClass().getResource("/sampleImages/" + fileName).getPath());
		System.out.println("type: " + matrix.type());
		System.out.println("dims: " + matrix.dims());
		System.out.println("height: " + matrix.height());
		System.out.println("width: " + matrix.width());
		System.out.println("rows: " + matrix.rows());
		System.out.println("cols: " + matrix.cols());
	}

	public void helloCv() {
		Mat m = Mat.eye(3, 3, CvType.CV_8UC1);
		System.out.println("m = " + m.dump());
	}
}

処理の概要

  1. メインメソッドでこのクラスをインスタンス化、loadImg()に「”download-1.jpg"」を私て実行します
  2. "resources/sampleImages/download-1.jpg"を読み込んでMatを返します、
  3. Matの中身をコンソールに表示 

読み込んだ画像は「レシート」です。家計簿を書く時に使うでしょ?(笑)

関連ページ

  1.  Java OpenCV 環境セットアップ(on Mac)
  2. Java Install Eclipse〜開発ツールのインストール〜
  3. Java Doc読解 BufferedReader
  4. Java Doc 読解〜BufferedWriter〜

 

Java OpenCV 環境セットアップ(on Mac)

インントロダクション

画像解析処理を行いたく思い「OpenCV」をセットアップします。

brewコマンドでインストールなどもできる様ですが、GitでPULLするのが一番早いと思いましたので、そのようにやります。

そもそも。。。

機械学習の理解をしようと色々と試みましたが、撃沈。。。(TensorFlow関連では基本的なこと、モデルの作成の理論までは理解できなかった)ので、OpenCVで機械学習を学ぼうとなりました。

OpenCVには色々な「アルゴリズムを使」うとか、ベクトル、パターン認識、特徴量の計算など「機械学習で必要になるであろう」事が記載されていました。

必要な工程

  1. Eclipseのインストールなどのセットアップ
  2. OpenCVのインストール(ここから記載します)
  3. OpenCVのJARファイルとOpenCVのC言語資源(ソース) インストール
  4. OpenCVの起動確認

OpenCVのインストール(makeコマンドを使う)

コマンドを叩いていけばOKですので。。。

参考サイト :本家家元OpenCVのページです。

参考サイト2:JavaでのOpenCVのページ。Javaでやるのでこちらを参照。

 

以下のコマンドを実行します(gitはインストール済みの場合)

>git clone git://github.com/opencv/opencv.git

gitのインストール:このページを参照しました。

>brew install git

そして以下のコマンドと続きます(対象のバージョンは「3.4.3」

>cd opencv
>checkout 3.4.3
>mkdir build
>cd build
>cmake -DBUILD_SHARED_LIBS=OFF ..

そして処理が流れ始め。。。

javaフォルダができたかな?と思いきや。。。「ない」

そんな時は下のコマンドを叩く様です。

>export JAVA_HOME=/usr/lib/jvm/java-6-oracle
>cmake -DBUILD_SHARED_LIBS=OFF ..

「/usr/lib/jvm/java-6-oracle」の部分は自分のマシンで使用するJDKの場所を指定します。自分の場合は以下の様になります。

>export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_144.jdk/Contents/Home/
>cmake -DBUILD_SHARED_LIBS=OFF ..
>make -8j

そして、ビルドの結果

javaフォルダがない。。。

と思ったらopencv/binの中にありました。

そんなわけで、以下のコマンドでファイルをビルドパスに繋げやすい様にファイルを移動します。

>cp ./bin/opencv-343.jar ~/Java/OpenCv/
>cp ./lib/libopencv_java343.dylib ~/Java/OpenCv/

リンク先のファイルが「libopencv_java343.dylib」とは違う様ですが、このファイルで良い様です。

Eclipseのプロジェクトを右クリック > Build Pathを選択

Native Libraryを選択して。。。

Native libraryにOpenCVを登録(設定)します。

そして、実行!撃破!!



ソースは下の様になりました。対象のライブラリ部品から定数で参照する値は名前が違う場合がある様です。。。なのでハードコーディング(笑)

import org.opencv.core.CvType;
import org.opencv.core.Mat;

/**
 * OpenCVの部品を実行するクラス。
 * 
 * @author takunoji
 *
 * 2018/11/11
 */
public class ReceiptCv {
	static {
		System.loadLibrary("opencv_java343");
	}
	public static void main(String[] args) {
		new ReceiptCv().helloCv();
	}

	public void helloCv() {
		Mat m = Mat.eye(3, 3, CvType.CV_8UC1);
		System.out.println("m = " + m.dump());
	}
}

そしてImShow(画像表示)→OpenCV3.Xではできません。

OpenCVの3.XからはHightGUIを使用しないようです。なのでJavaFXでイメージの表示を行います。「Java OpenCv Hello in Java〜OpenCv事始め〜

旧バージョンでのImShowメソッドの使用方法

JARファイルをGitから直接ダウンロードします。

Imshow.jarを直接ダウンロードします。

Downloadボタンをクリックしてダウンロードします。

BuildPathをJARファイルに通します。

プロジェクトを右クリック > BuildPath

「Add External Jar」でダウンロードしたファイルを追加します。

実際の作業

次は、画像の表示をするための準備を行います。

ImShowのメソッドが使えないのでJavaFXによる画像表示GUIを作成していきます。

参考サイトはこちらです。

ちなみにチュートリアルでは「シーンビルダー」をインストールして画面の土台を作っています、下のような感じです。

関連ページ一覧

<JavaFXの準備>

  1. Eclipse SceneBuilderを追加する
  2. JavaFX SceneBuilder 〜EclipseとSceneBuilder連携~

<TensorFlow関連>

 家計簿アプリ作成

  1. Eclipse アプリ作成 Lv1〜家計簿を作る準備〜
  2. Eclipse アプリ作成 Lv2〜家計簿を作る土台作り〜
  3. Eclipse アプリ作成 Lv3〜3Dグラフ用Cube作り〜
  4. Eclipse アプリ作成 Lv4〜3Dグラフ用Cubeに高さを与える〜
  5. Eclipse アプリ作成 Lv5〜惨敗:CubeにTextureを貼る〜
  6. Eclipse アプリ作成 Lv7〜Cubeを日付順に並べる〜