Reactで、文章によく出る言葉をワードクラウドで表示する方法
文章によく出る言葉を、回数が多いほど大きな文字で並べるワードクラウドを、ライブラリを使わずに React で作りました。回数から文字の大きさを決める計算、canvas で文字の幅を測ってうず巻きに沿って重ならないように置く方法、枠に入 ...
Reactで、マス目に色を塗るドット絵エディターを作る方法
16×16 のマス目をクリックやドラッグで塗るドット絵エディターを React と TypeScript で作りました。ポインターの位置からマスを求める方法、速く動かしても線が途切れない塗り方、塗りつぶし、元に戻す機能、PNG での保 ...
ReactでuseRefを使ってCanvasのアニメーションを作る方法
Reactで、canvasの中のボールをrequestAnimationFrameで動かす方法です。canvasの要素とボールの位置をuseRefに持ち、useEffectで始めたループをcancelAnimationFrameで止め ...
