【Unity】レーダーチャート作成の続き


多角形のメッシュを使ってレーダーチャートを作れたが、塗りつぶしではなくて線で表現したいこともある。

今回は多角形の線を引くための2つの方法を覚書。

1.線状のメッシュを使う

2.LineRendererを使う

線状のメッシュ作成

前回のメッシュ作成部分(makeParams関数)を変更する。

【Unity】多角形のメッシュでレーダーチャート作成
多角形の描画は微妙だった。そこで多角形のメッシュを使ってレーダーチャートのようなものを作ってみる。まず多角形のメッシュを持ったオブジェクトを作る。 Vector3 v...

メッシュで線を表現するために多角形の座標と、それより微妙に小さい多角形の座標を取得する。

そして2つの多角形の座標から三角形をつなげて線にする。

メッシュの法線がカメラの方を向くように三角形は時計回りで作る。

プログラムはこんな感じ。

前回の背景にこれで線状の多角形をあわせるとこうなる。

 

座標の問題で線の角度によって太さが微妙に違うが、レーダーチャートっぽくなった。

線の太さを一定にするには多角形の頂点付近の4点を使ってメッシュを作ればいい。

LineRenderer使用

Unityには空間に直線を書くためにLineRendererコンポーネントが用意されています。

これを使ってレーダーチャートを書いてみます。

スクリプトから弄る場合は Unity5.4 から Unity5.5 で結構変わってます。

size が 2.8f なのは背景の Quad の localScale が 2.8f  のため。

Quaternion で回転させているのも背景にあわせた処理。

2回分余計にまわすのは線の端部分に違和感が出ないようにするため。

次のように呼び出す。

すると結果はこんな感じになる。

 

見た目も処理の簡潔さもこれが一番だと思う。

ただし Line Renderer はあくまで3次元空間上に線を引く機能なので、思い通りにするにはちゃんと計算しないといけない。

 


コメントを残す

メールアドレスが公開されることはありません。