画面90度回転

by cutfloss 4 hours ago [2026/05/07 21:37:28]

ゲーム画面を90度回転させるぞ　配信とかでも見えやすくなるはずだっ

• /*
   * @title 画面90度回転
   * @description ゲーム画面を90度回転させるぞ　配信とかでも見えやすくなるはずだっ
   * @private
   */
  javascript:(function(){
      const canvas = document.getElementById('gameCanvas');
      if(!canvas) return alert('ゲーム画面が見つかりません');
  
      /* 1. 見た目だけを90度回転（比率を維持） */
      /* rotate(90deg) だけだと画面からはみ出す場合があるため、
         現在の親要素に収まるように自動スケール調整します */
      const parent = canvas.parentElement;
      const scale = Math.min(parent.clientWidth / canvas.height, parent.clientHeight / canvas.width);
      
      canvas.style.transformOrigin = 'center center';
      canvas.style.transform = `rotate(90deg) scale(${scale})`;
      canvas.style.transition = 'transform 0.3s ease'; /* 滑らかに回転 */
  
      /* 2. 操作方向の補正（脳内変換不要モード） */
      /* 画面が右に90度倒れているので、
         見た目上の「右（実際は下）」を「データ上の右」に変換します */
      if (typeof sendInput === 'function' && !window._inputHooked) {
          window._inputHooked = true;
          const _origSendInput = window.sendInput;
          window.sendInput = function() {
              const dx = inputState.dx;
              const dy = inputState.dy;
  
              /* 90度回転時のベクトル変換式 */
              /* 見た目の右(X+) -> データの下(Y+)
                 見た目の上(Y-) -> データの右(X+) */
              inputState.dx = -dy; 
              inputState.dy = dx;
  
              _origSendInput.apply(this, arguments);
  
              /* 他の描画ロジックに影響を与えないよう戻す */
              inputState.dx = dx;
              inputState.dy = dy;
          };
      }
  
      /* 3. 名前と絵文字の水平維持（首折れ防止） */
      if (!window._originalFillText) {
          window._originalFillText = CanvasRenderingContext2D.prototype.fillText;
          CanvasRenderingContext2D.prototype.fillText = function(text, x, y, maxWidth) {
              /* プレイヤー周辺のテキスト(translate後)のみ回転を打ち消す */
              if (Math.abs(x) < 40 && Math.abs(y) < 40 && !text.includes('%') && !text.includes(':')) {
                  this.save();
                  this.rotate(-Math.PI / 2);
                  window._originalFillText.call(this, text, -y, x, maxWidth);
                  this.restore();
              } else {
                  window._originalFillText.apply(this, arguments);
              }
          };
      }
  
      alert('【比率維持・横画面】適用しました！\n操作方向も画面に合わせて補正済みです。');
  })();

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

  このページへの個別リンクです。

  RAW

  書かれたコードへの直接のリンクです。

  Packed

  文字列が圧縮された書かれたコードへのリンクです。

  Userscript

  Greasemonkey 等で利用する場合の .user.js へのリンクです。

  Loader

  @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。

  Metadata

  コード中にコメントで @xxx と書かれたメタデータの JSON です。