Windows Terminal Preview版でSixelグラフィックスを実際に表示させてみる
ASCII.jp / 2025年1月5日 10時0分
今回もWindows Terminal上でのSixelグラフィックスを解説
前回は、Sixelグラフィックによる画像ファイルの表示とエスケープシーケンスを簡単に解説した。今回は、Windows TerminalのSixelグラフィックスをさらに細かく見ていくことにしよう。
まず、Sixelのエスケープシーケンスだが、正確には、以下のような書式を持つ。
CSI <アスペクト比> ";" <ゼロ描画> ";" <Xピクセルサイズ> ";" "q" <Sixelグラフィック文字> ST
・アスペクト比:Sixel描画ビットの縦横比 ・ゼロ描画:Sixel描画ビットの0を既定の背景色にするかどうか ・Xピクセルサイズ:Sixel描画ビットのX方向のピクセルサイズ ・Sixelグラフィック文字:前回参照、Sixelカラーレジスタ定義とカラーレジスタ指定、描画文字など
ただし、Xピクセルサイズは無視され、常にSixelピクセルのX方向のサイズは1のままである。
まず「アスペクト比」だが、指定する値とアスペクト値(縦横比)の関係は、以下の表のようになり、1:1から1:5までが指定できる。ここで指定するのは縦横比だが、3つ目のXビットサイズと掛け合わせることでY方向の物理ピクセルサイズに変換できる。ただし、Xピクセルサイズは常に1なので、アスペクト比がそのままYピクセルサイズとなる。
簡単に言えば、アスペクト比を指定することでY方向のピクセルサイズを1/2/3/5ドットと指定したのと同じになる。このとき、1文字に相当するSixelピクセルのサイズが変化する。
次の「ゼロ描画」は、Sixelピクセルのゼロビットで現在の背景色を描画するか(=0または2)、現在の色を保持するか(=1)を指定する。
Sixelグラフィックスでは、同一エスケープシーケンス内であれば、ゼロビットは現在の値を保持するが、異なるエスケープシーケンスによる描画では、この値を使ってゼロビットの描画方法を決定する。
デフォルトは0で、現在の背景色で描画する。このため、異なるエスケープシーケンスでSixelグラフィックスを同一ライン上ですると、「?」文字で右側にある描画を消してしまう。これを防ぐには、「ゼロ描画」に1を指定したエスケープシーケンスを使う。
Sixelのエスケープシーケンスを複数に分離しなければならないのは、その描画開始位置をカーソル位置を制御するエスケープシーケンス(CUP/Cursor Positionエスケープシーケンス:CSI <Y> ; <X> H)を、使って開始位置を変更する必要があるからだ。
もちろん、「$」と「-」を使って、描画の右上から順にSixelを描画していくこともできる。しかし、この場合、描画ピクセルが右上から左下に順に描画するようにSixelピクセルの描画位置を並べ替える必要がある。
Sixelグラフィックスのエスケープシーケンスでは、開始位置より左側、上側に描画できない。「$」はX方向で開始位置に戻るだけで、「-」は1つ下の行に移動することしかできない。つまり、上方、左側に移動する手段がない。
なので、Sixelピクセルの描画座標から、一番近いカーソル位置を算出して、CUPエスケープシーケンスを使って、Sixelグラフィックの開始位置を指定する必要がある。
アスペクト比とSixel描画
さて、具体的にアスペクト比を変えて描画してみよう。Sixelグラフィックスのエスケープシーケンスで、アスペクト比を指定すると、1ピクセルの縦方向が、1/2/3/5ドットとなる。これにともない、ターミナル上の文字との相対サイズが変化する。
アスペクト比が2:1(<アスペクト比>設定値としては0または1)の場合、ピクセルは縦2ドット、横1ドットとなり、1文字は10×10 Sixelピクセルに相当する。これは、フォントサイズに関係がない。つまり、フォントサイズが大きくなると、それに応じてSixelピクセルのサイズが追従して大きくなる。
たとえば、アスペクト比5:1(設定値としては2)の場合、PowerShellで記述した以下のエスケープシーケンスで、縦5ドットのSixelグラフィックスを描画できる。
$aspect=2;write-host "`e[4;10HH`eP${aspect};1;0;q@ACGO_-??????@ACGO_`e\`e[5;10HH`e[6;10HH`e[6;12HH aspect=$aspect`n"
このとき、横方向では1文字はSixelで10ピクセルに相当し、縦方向では4ピクセルに相当する。
同じくアスペクト比3:1(設定値としては3)の場合、
$aspect=3;write-host "`e[4;10HH`eP${aspect};1;0;q@ACGO_-??????@ACGO_-????????????@ACGO_`e\`e[5;10HH`e[6;10HHHH`e[6;15Haspect=$aspect`n"
となる。このとき、1文字の縦方向は、6.666...ドットと整数ではなくなる。このため、写真ではHで上書きされたSixelグラフィックス右下のドットが小さく欠けている。
アスペクト比1:1(設定値としては7)の場合には、1文字は、Sixelグラフィックスでは10×20ピクセルに相当する。エスケープシーケンスとしては、
$aspect=7;write-host "`e[4;10HH`eP${aspect};1;0;q@ACGO_-??????@ACGO_-????????????@ACGO_-??????????????????@ACGO_`e\`e[5;10HHHHH aspect=$aspect`n"
となる。
デフォルトのアスペクト比である2:1(設定値を省略または0を指定)の場合には、1文字は10×10ピクセルに相当する。エスケープシーケンスは、以下になる。
$aspect=0;write-host "`e[4;10HH`eP${aspect};1;0;q@ACGO_-??????@ACGO_-????????????@ACGO_-??????????????????@A`e\`e[5;10HHHHH aspect=$aspect`n"
アスペクト比を変えることで、Sixelの1ビットで描画できる縦方向ドットのサイズを変更できる。ただし、現状、1ピクセルの横方向のサイズを変更する方法はなく、Sixelを横方向に並べる必要がある。
Sixelグラフィックスは、ターミナル内の任意の場所に点を打つグラフィックスとして考えるとちょっと面倒なところがある。とりあえずは、ユーザー定義文字のように1行内でSixelグラフィックスを描画するか、ツールやライブラリ(LibSixel)を使って、画像ファイルを表示させるか、といった使い方になるのではないか。
かつてのBASICのように、線や矩形、円などを描画するには、それぞれプログラムを記述する必要がある。
この記事に関連するニュース
-
Windows Terminal Preview版でSixelグラフィックスを扱う
ASCII.jp / 2024年12月29日 10時0分
-
大画面でゲーム機を遊びたいです。ディスプレイのサイズは同じなのに、1万円の製品と数万円の製品では何が違うのでしょうか?
マグミクス / 2024年12月20日 14時15分
-
窓辺の小石 第194回 Rainbow Sixel
マイナビニュース / 2024年12月13日 23時41分
-
13.3型AI PC「HP EliteBook 635 Aero G11」で2カ月過ごして分かったこと 1kg切りの軽さでも納得のテストスコア
ITmedia PC USER / 2024年12月12日 18時0分
-
マウスコンピューターのG-Tune改め「G TUNE」が20周年! 価格も期待できる記念モデルの仕上がりは? 徹底レビュー
ITmedia PC USER / 2024年12月11日 12時5分
ランキング
-
1Adobe CCフォトプラン値上げ 月額1180円→1780円に
ASCII.jp / 2025年1月6日 17時20分
-
2パナソニックから光学30倍ズームのコンパクトデジタルカメラ ライカレンズと2030万画素のCMOSセンサー搭載
OVO [オーヴォ] / 2025年1月6日 7時41分
-
3ワイヤレスイヤフォン主流の今だからこそ、有線イヤフォンのメリットを語りたい
ITmedia Mobile / 2025年1月6日 17時5分
-
4『ドラクエ』弱すぎてずっこけた! 見かけ倒しにもほどがある、ガッカリボス3選
マグミクス / 2025年1月6日 21時55分
-
5BIGLOBE、「ビッグローブ光 10ギガ」が6ヵ月間0円になる特典と新CMを発表
ASCII.jp / 2025年1月6日 22時35分
記事ミッション中・・・
記事にリアクションする
記事ミッション中・・・
記事にリアクションする
エラーが発生しました
ページを再読み込みして
ください