自作ゲームの数学計算ゲームで数学の表現を行う

前回、新しく作成したアプリを紹介しました

このアプリには加算、減算、乗算、除算だけでなく、階乗から対数、三角関数、逆三角関数など

高等数学も入っています、今回はこの表現方法についてみていきます

概要

今回作成したアプリにはこのように

階乗

対数

三角関数

逆三角関数

数学記号が出てくる問題があります

また、以下のアセットで吹き出し同様テキストにもアニメーションを入れています

アセットストアには数学記号を表現するアセットも存在しますが、現在のところ共存ができないため独自に作っていく必要があります

表現方法

各々の数学記号の表現方法はこの通りになります

• 階乗関数

{0}!

シンプルに！をつけるだけで完成します

• 指数関数

{0}<sup>{1}</sup> 

指数部分supタグで上付き文字にすることで表現しています

• 対数関数

log<sub>{0}</sub>{1}

対数関数のlogと文字を書き、底の部分をsubタグで下付き文字にすることで表現しています

• 三角関数

sin {0}<margin-right=-5em>゜</margin
cos {0}<margin-right=-5em>゜</margin>
tan {0}<margin-right=-5em>゜</margin>

°は記号と存在するのでマージンをやや調整することで角度の表現をしています

• 逆三角関数

sin<sup>-1</sup>{0}
cos<sup>-1</sup>{0}
tan<sup>-1</sup>{0}

対数関数同様-1を下付き文字とすることで表現しました

このようにして問題に表示する数学記号を表現しました

しかしタグだけでは解決できないものもあります

それは分数と√表現です

次はこの分数と√をどのようにして表現してかを見ていきます

分数と√表現を行う

分数と√表現ですが、まず結論から言うとタグを駆使して表現していません

マイナス以外はすべてspriteタグを使っています

つまりすべて画像ということになります

なぜ分数と√表現が画像で完結できるかというと、三角関数は回答が決まっているからです

以下の三角関数の問題及び回答にできそうな数値を見てみるとこのような図になります

ここからマイナスを除いて、解なしと負数の数字を除くと

この5パターンしかないのがわかります

これを画像化しマイナスをつけることで表現しています

まとめ

このようにTextMeshProだけでも数学記号の表現を用いて問題を作ることは可能です

三角関数に関しては画像を使用していますが、

選択肢がある程度決まっているのであればこのように画像化してしまうのもありかと思います

可読性と簡略化を優先するのであれば、複雑なタグを書くよりも有効な手の一つかもしれません