[Github Pages] update sample04 document.

Add paragraph about scatter plot and solving coord chain.

Author: HiroakiIMAI

docs/sample_04_DrawGraph.md

@@ -25,6 +25,12 @@ SODLは、簡単な2Dグラフのプロット機能を提供します。
 別々のオブジェクトを描画する事ができます。
 SODLは描画空間を簡単に追加する機能を提供します。
 
+#### 機能：根本座標系(ワールド座標系)から見た子オブジェクト位置の取得
+SODLは、連鎖座標系の末端(あるいは中間)に位置するオブジェクトが、
+ワールド座標系原点から見た、どのような位置姿勢に存在しているかを
+計算して結果を返す機能を座標系オブジェクトのメソッドとして提供します。
+これにより、例えば関節角度を自由に変更した後のロボットハンドの手先位置を
+メソッド呼び出しだけで取得する事ができます。
 
 ### サンプルコードの解説
 サンプルコードは、ロボットを表示する部分については[sample_02_6AxRobot](#sample_02_6AxRobot)と同じです。
@@ -162,6 +168,120 @@ Eigen::Vector3f型の3次元空間上の点をプロットデータに追加す
 
 時系列グラフの説明は以上です。
 
+#### 2. 散布図グラフ
+```
+//----------------------------------------------------
+// 散布図グラフ(2次元)の作成と描画空間[2]への配置
+//----------------------------------------------------
+// 散布図グラフの作成
+auto scttrGrph = sodl::GraphObj::create(
+  "Mouse Drag Trajectory",				// オブジェクト名称 = グラフタイトル
+  camGrph									// 関連付けるカメラ(カメラ投影行列などの設定が済んでいること)
+);
+// ラベルの設定
+scttrGrph->xAxisLabel->text = "X [pix]";
+scttrGrph->yAxisLabel->text = "Y [pix]";
+// 描画空間[2]にグラフを追加
+sodl::drwMngr->AddObjTree_ToDrwSpace(scttrGrph, 2);
+```
+散布図グラフの作成手順も時系列グラフと同じです。
+ビューポートとカメラの追加はコードの引用も省略しています。
+差分は、グラフのインスタンスが`TimeSeriesGraph`であるか、`GraphObj`であるか、です。
+`TimeSeriesGraph`はデフォルトで古いデータが左に流れて見えなくなるようなプロット範囲をとるのに対し、
+散布図で用いている`GraphObj`は、デフォルトで古いデータがいつまでも流れないようなプロット範囲を維持します。だだし、古いデータ自体はやはりメモリの問題でサンプル数が`dataNumMax`を超えると削除されます。
+
+以降は、プロットデータを作成している箇所を見ていきます。
+2つの散布図はマウスドラッグ軌跡とロボットの手先の軌跡をそれぞれブロットしています。
+
+##### 2.1 マウスドラッグ軌跡のプロット
+```
+while(1)
+{
+
+  (略)
+
+  //-----------------------------------------------------
+  // ドラッグ中のマウス位置X,Yを散布図グラフにプロット
+  //-----------------------------------------------------
+  scatterGraph_mouseDrag->addData(Eigen::Vector3f(app::mouse_x, app::mouse_y, 0));
+
+  //-----------------------------------------------------
+  // 描画マネージャから描画更新を実行する
+  //-----------------------------------------------------
+  sodl::drwMngr->drawUpdt();
+
+  ++count;
+  Sleep(10);
+}
+
+```
+メインループでは、単に`app::mouse_x`, `app::mouse_y` をプロットに加えているだけです。
+これらの変数はグローバル変数で、マウスコールバック関数で更新されています。
+コールバック関数を以下に示します。
+```
+namespace app {
+  //================================================================
+  //
+  //	<Summary>		GLウィンドウ上でマウスドラッグ時のコールバック
+  //	<Description>
+  //================================================================
+  void onMouseDrag(int u, int v)
+  {
+  	mouse_x = u;
+  	mouse_y = WINDOW_SIZE_Y - v;
+  }
+}
+```
+いたってシンプルです。
+コールバックで得られる値がWindowsのウィンドウ座標系準拠なので
+画面左上原点の下方向が(+)の座標値となります。
+一方、グラフプロットの座標系は左下原点の上方向が(+)の座標系としたかったので
+反転してウィンドウサイズから減算した値を`mouse_y`に代入しています。
+
+他に、マウスボタンを押したときのコールバック関数`onMouseBtn()`と
+ボタンを押さずにウィンドウ上をにマウスを乗せて移動させたときのコールバック関数
+`onMouseHover()`が何もしない関数として実装されています。
+
+##### 2.2 ロボットの手先軌跡のプロット
+```
+while(1)
+{
+  (略)
+
+  //-----------------------------------------------------
+  // ロボットハンド位置X,Yを散布図グラフにプロット
+  //-----------------------------------------------------
+  Eigen::Vector3f handPos = J6_Crd->GetTf_root2self().translation();
+  scatterGraph_RobotHandXY->addData( handPos );
+
+  (略)
+
+  //-----------------------------------------------------
+  // 描画マネージャから描画更新を実行する
+  //-----------------------------------------------------
+  sodl::drwMngr->drawUpdt();
+
+  ++count;
+  Sleep(10);
+}
+```
+ロボットハンドの手先座標の計算は、メイン関数の中で実装しています。
+`Eigen::Vector3f handPos = J6_Crd->GetTf_root2self().translation();`
+の一行です。
+`J6_Crd`はロボットの手先を表現している座標系オブジェクト(`CoordChainObj`のインスタンス)です。
+そして、座標系オブジェクトクラス`CoordChainObj`のメソッドである`GetTf_root2self()`は、
+座標系連鎖を親の親の・・・と辿って、
+根本までたどり着いた座標系オブジェクトから見た、自分自身までの座標変換
+(言い換えると、自分自身の位置姿勢)を表す`Eigen::Affine3f`オブジェクトを返します。
+`Eigen::Affine3f`から位置情報だけを取り出す`translation()`をコールして得られた
+`Eigen::Vector3f`がワールド座標原点から見たロボットハンドの手先位置として`handPos`
+に代入されます。
+
+`CoordChainObj::GetTf_root2self()`は使いこなすと強力な座標変換ツールになります。
+また`Eigen::Affine3f`の扱いを理解することは、それ以上に座標変換の実装を楽にしてくれます。
+
+sample_04_DrawGraph の説明は以上です。
+
 [サンプル一覧へ戻る](FunctionExplainedWithSamples.md)
 
 [トップページへ戻る](README.md)