JavaScriptを使用してBase64形式の画像を回転する方法


  1. HTMLファイルに以下のコードを追加します。
<img id="myImage" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...">
<button onclick="rotateImage()">画像を回転</button>
  1. JavaScriptコードを追加します。
function rotateImage() {
  var img = document.getElementById("myImage");
  // 画像を90度回転させる
  img.style.transform = "rotate(90deg)";
}

上記のコードでは、<img>要素にBase64形式の画像が埋め込まれています。rotateImage()関数は、ボタンがクリックされたときに呼び出され、画像を90度回転させるためのCSSのtransformプロパティを設定します。

この方法を使用すると、JavaScriptを介してBase64形式の画像を簡単に回転させることができます。さらに高度な回転や他の画像処理操作も可能です。この例では、90度の回転を示していますが、必要に応じて回転角度を変更してください。

以上が、JavaScriptを使用してBase64形式の画像を回転する方法についてのシンプルな解説とコード例です。応用してさまざまな画像処理操作を行うことができるので、ぜひ試してみてください。