ソースコード全文、タスク管理(Kanban)ボードの実装デモ、およびモバイル対応に関する技術的な詳細は、以下のブログ記事にて公開しています。 【JavaScript】Drag and Drop APIによる直感的な要素移動とデータ操作 近年のWebアプリケーションは、デスクトップ ...
2023年3月の世界のWebブラウザのシェアは、statcounterによれば、Google Chromeが65%、Apple Safariが20%、Microsoft Edgeが5%、Mozilla Firefoxが3%となっています。これら主要なWebブラウザには約10年以上前から「Canvas API」と呼ばれる高度な描画機能が利用できます。 このCanvas ...
HTMLの <canvas> 要素でグラフィックスを扱うには、まず「レンダリングコンテキスト」の取得が必要です。本記事では、Canvas APIの入り口となるコンテキストの初期化から、最も基本的な図形である矩形(長方形)の描画、そして色指定の方法までを解説します。