« ◇原発ロボットの謎 | トップページ | なぜ無いJavaのStringの==比較をエラーとするモード »

◇数式をグラフ化してcanvasに描画する

メモ:万能ではなくてもメモがあれば心理的壁が低くなる

 数式をグラフ化してcanvasに表示する

前の記事 ★星は暗いのではなく小さいのです-4 で数式をグラフ化してcanvas上に表示しました。

こんな感じのものです。

グラフ-1

軸スケール表示をn倍ベースにもできます (この例ではX軸表示を63241で1光年としています、Y軸は計算式で対数としています)。

グラフ-2

上のグラフは次のコードで表示しています。

Canvasにグラフを描画するhiGraphクラス(後述)を作り、 パラメタにCanvasと領域サイズを設定し、数式を与え、表示しています。
「像の明るさ(5mm)」などの文字列はhiGraphとは別に描画しています。

 hiGraphクラスの使い方

hiGraphは次のAPIを持ちます。全てstaticメソッドです。

 hiGraph.axis(param);      // 領域をクリアしX軸、Y軸を描画する
 hiGraph.xScale(param      // X軸スケール(横線と値)を描く
               ,start      // 開始値
               ,step       // ステップ値
               ,unit_start // 値文字表示の開始値
               ,unit_step  // 値文字表示のステップ値
               ,unit_str   // 値文字表示の単位名
               );
 hiGraph.yScale(param      // Y軸スケール(横線と値)を描く
               ,start      // 開始値
               ,step       // ステップ値
               ,unit_start // 値文字表示の開始値
               ,unit_step  // 値文字表示のステップ値
               ,unit_str   // 値文字表示の単位名
               );
 hiGraph.calc(param        // 計算し表示する
              ,式          // y=式(x) の形の式
              ,color       // 色
              );

第一引数のparamで領域の定義を行います。

  param.canvas    : canvas
  param.margin_x  : 左右のマージン
  param.margin_y  : 上下のマージン
  param.offset_x  : X軸の位置(左から)
  param.offset_y  : Y軸の位置(下から)
  param.range_x_s : Xの開始値
  param.range_y_s : Yの開始値
  param.range_x_e : Xの終了値
  param.range_y_e : Yの終了値


hiGraph.axis   :canvas全体をクリアした上で軸の線を書く
hiGraph.xScale :スケール線(横線)を描き、値を表示する
                startからstep単位で線を描く
                unit_startからunit_stepずつ増加し数値を表示する
                unit_strを数値の単位として表示する
hiGraph.yScale :スケール線(縦線)を描き、値を表示する
                startからstep単位で線を描く
                unit_startからunit_stepずつ増加し数値を表示する
                unit_strを数値の単位として表示する
                例えばグラフ-1/-2とも値は「天文単位」だが、
                グラフ-1では100天文単位ごとに縦線を描き100天文単位
                毎に数値を表示しているが、グラフ-2では63241天文単位
                毎に縦棒を描き数値は1から始まる「光年」で表示して
                いる
hiGraph.calc   :式の結果をグラフ上に描く

 hiGraphクラスのコード

hiGraphクラスは次のように定義されています。

|

« ◇原発ロボットの謎 | トップページ | なぜ無いJavaのStringの==比較をエラーとするモード »

トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/489055/69671873

この記事へのトラックバック一覧です: ◇数式をグラフ化してcanvasに描画する:

« ◇原発ロボットの謎 | トップページ | なぜ無いJavaのStringの==比較をエラーとするモード »