レンダリング
ノーツのレンダリング
タップノーツ（Tap Notes）
タップノーツのレンダリングが最も基本的なものであり、ホールドノーツやフリックノーツ、及びそれぞれのクリティカルノーツも同様な要領でレンダリングすることができます。これらをシングルノーツと言います。
ノーツのデータには、tick と lane と width が含まれます。ノーツには異なる width があるものの、同じテクスチャーを用います。しかし普通にスケールを掛けた場合、以下のように縁まで拡大されてしまい、大変なことになります。それに対応するためには、9-Slice Scaling という技術を使います。
簡単に言えば、テクスチャーを既定の幅や高さで 9 つに分割し、その中心部のみをスケーリングすることで、周りの部分の形状を保ったまま、テクスチャーを希望のサイズにすることができます。
上段は単純なスケーリングで、周りの部分が変形してしまう
下段は 9-Slice Scaling を用いたもので、拡大しても周りが変わらない
（画像は Alwik, CC BY-SA 4.0, Wikimedia Commons より）
クリティカルノーツ（Critical Notes）
クリティカルノーツは基本的にタップノーツのテクスチャーを変えればできます。タップノーツ、フリックノーツ、ホールドノーツのいずれもクリティカルが付いていれば、同様なテクスチャーが使われています。
フリックノーツ（Flick Notes）
フリックノーツには二つのパーツに分かれます。下部にあるものは、タップノーツのテクスチャーを変えることで描画できます。上部にあるものは矢印であり、別のテクスチャーがあります。ノーツの width によって 6 種類の矢印テクスチャーがあります。計算方法は【TODO: 】。エディターを作る場合、平面にしか描画する必要がないため、矢印を適宜な距離に置く事で解決できますが、シミュレーターを作る場合、投影変換をしないように注意してください。また、動かす必要があります。いずれも矢印が一番上に描画される。
ロングノーツ・ホールドノーツ（Hold Notes）
ホールドノーツは、やや複雑です。まず起点と終点には、シングルノーツがあります。また、起点と終点のノーツの間には、中継点及びそれらの点を繋ぐための経路があります。
起点・終点
起点のノーツは、緑のノーツか黄色いクリティカルノーツの二種類のみあるのに対し、終点のノーツは緑のノーツか、クリティカルノーツか、フリックノーツの三種類があります。
中継点
中継点には、可視中継点及び不可視中継点があります。可視中継点の位置には、ダイアモンドが置かれます。不可視中継点は描画されません。
可視中継点・不可視中継点と関係なく、位置が無視されるタイプのものがあります。位置が無視される不可視中継点はそもそも考慮する必要がありませんが、位置が無視される可視中継点の場合、経路と同じ曲線によって横軸の値を決めなければなりません。具体的には、無視されていない、繋がっている両点（重複あり）、及びその間の無視された点を含んだグループ（connectedGroups）を計算し、無視された点の縦軸の値から、前後の無視されていない点の経路曲線によって、その横軸を決めなければならない。
経路
経路は起点・終点・中継点のいずれか二つを繋げます。位置が無視される中継点の場合、無視してその前後を繋げて描画しなければなりません。具体的に、無視される中継点を filter すればよい。
正しくは、二次イージング曲線によって描画されますが、Bezier 曲線によって近似的に描画されることが多いです。
