ブックマーク / mmsrtech.com (1)

  • AngularとPaper.jsで簡易なデジタイザを作る3 - HAKUTAI Tech Notes

    概要 完成イメージ 実装 レイヤー分割 座標軸設定パスの描画 座標軸設定用パスの再描画 基準軸の最大値、最小値の設定 座標値の変換 おわりに 概要 最終的にデジタイザとして機能させるためには、自分で設定した任意の座標系で点をプロット(座標を取得)可能にする必要がある。今のままでは単にキャンバスのView基準の座標しか取得できないので、任意の座標系を基準とした値に変換しなければならない。ここでは、プロット機能を実装するための準備として、座標系の設定機能と座標変換処理について述べる。 完成イメージ 座標系の基準範囲を設定するパス(紫色の線)をドラッグで調整する 基準範囲の左端、右端、上端、下端の座標値を指定する 実装 レイヤー分割 この辺りから色々と処理が複雑になってくるので、キャンバスを複数のレイヤーに分割して各レイヤーに役割分担させることにする。 ここでは、画像を表示するbackgroun

    AngularとPaper.jsで簡易なデジタイザを作る3 - HAKUTAI Tech Notes
  • 1