鳩でもわかるC#鳩でもわかるC#C#とJavaScriptをメインに情報発信をしています。TOPJavaScriptパーティクル同士をつないで幾何学的模様をつくるパーティクル同士をつないで幾何学的模様をつくる2024年2月20日JavaScriptTweetパーティクル同士をつないで幾何学的模様をつくります。更新処理HTML部分やっていることは点を移動させる。移動方向は最初にランダムに決めておく。近くに別の点があったらつなぐ。近ければ濃い直線を描画する。"./index.js"></script></body></html>JavaScript部分グローバル定数はこれだけです。$canvas.getContext('2d');Particleクラスの定義Particleクラスを定義します。コンストラクタの引数は生成された座標と移動速度です。Move関数で移動させますが、canvasの端にきたら反対側にワープさせます。'#fff';ctx.fill();}}ページが読み込まれたときの処理ページが読み込まれたらパーティクルを生成します。初期座標は0以上CANVAS_WIDTHまたはCANVAS_HEIGHT未満です。移動速度は0.4以上0.8未満、移動方向もランダムに決めます。パーティクルを移動させて描画します。それぞれのパーティクルの近く(距離80以内)に他のパーティクルがあるか調べます。1.6でアルファチャンネルを求め、1を超えたときは1を設定します。${alpha})`;ctx.stroke();}}}requestAnimationFrame(update);}動作確認はこちらからよろしければ記事の拡散をお願いします。鳩でも分かるC#管理人からのお願いできる仕事であれば請け負います。鳩でもわかるC#管理人はクラウドワークスに在宅ワーカーとして登録しています。お仕事の依頼もお待ちしております。仕事を依頼するコメントについてコメントで英語などの外国語でコメントをされる方がいますが、管理人は日本語以外はわからないので基本的に内容が理解できず、承認することもありません。それからへんな薬を売っているサイトやリンク先のサイトが存在しないというスパムコメントも多々あります。comments.そんななか日本語のコメントもいただけるようになりました。「○○という変数はどこで宣言されているのか?」「××というメソッドはどこにあるのか」「例外が発生する」「いっそのことソース丸ごとくれ」という質問ですが、管理人としては嬉しく思います。「自分が書いた記事は読まれているんだな」と。疑問点には可能な限り答えます。記事に問題があれば修正いたします。そのうえでお願いがあります。「匿名」という味も素っ気もない名前ではなく、捨てハンでいいのでなにかハンドルネームをつくってほしいと思います。管理人のモチベーションアップのためによろしければご支援お願いします。「【クソゲープロジェクト完成】絶対に逃げられないパックマンをつくる」コメントをどうぞ返信をキャンセルする。2024年9月6日ブログやっています。メインはC#ですが、JavaScriptにも挑戦しています。ときどきPythonとPHPもあるかも。