実は以下のこれ、画像として表示しているわけではなく SVG を使って表示している。
先日からステラナイツ向けの支援ツールを作ろうとしているが、戦闘時に使うマップが独特であり、円形のガーデンと呼ばれる場所で戦う。このガーデンは6つに分かれている。PC は1～6のいずれかの場所にいる。
円形のマップというのは HTML/CSS だけでは少々表現しがたく、 Canvas を使うことを検討したが「そういえば大学で学んで以来使ってなかったな」と思い SVG を使ってみた。SVG には Vue で直接イベントをバインドしたりできるのでもしかしたら Canvas より楽かもしれない。加えて、CSS で見た目を変えることも可能だ。
ただいまコメントを受けつけておりません。