Home » コンピュータ » MSX » MSX Graphic Viewer（Web版）

MSX Graphic Viewer（Web版）

Webアプリケーション
2019.12.30

1994年にDOS版、1996年にWindows95版を公開した「MSXCG」、2004年にWindows98版を公開した「MSX VIEWer」バージョン1.10に搭載されたBSAVE形式画像表示機能をWebアプリケーション化しました。

表示例１

別のウィンドウ（またはタブ）で開く

このBSAVE画像表示機能は、2016年に「MSX VIEWer」のBASICプログラム表示機能をWebアプリケーション・iOSアプリ・Androidアプリ化したときに取り残された形になっていましたが、このMSX Graphic ViewerによりWebアプリケーション化が完了しました。

このアプリは、MSX BASICで次のプログラムを実行した時の動作を再現します。

10 SCREEN <screenmode>
20 COLOR ,,<backgroundcolor>:CLS
30 BLOAD "<filename>",S
40 COLOR=RESTORE
50 GOTO 50
10 SCREEN <screenmode>
20 COLOR ,,<backgroundcolor>:CLS
30 COPY "<filename>" TO (0,0)
40 GOTO 40
  • <backgroundcolor>は背景色のカラーコードで、0〜15です。
  • <screenmode>はBASICのスクリーンモード番号で、2〜12（9を除く）です。
  • <filename>はファイル名です。

Windows版バージョン1.10の画像表示機能との主な違い

  • 背景色（MSXの用語では周辺色）に対応
    • カラーコード0の部分を指定された背景色で描画します。
  • COPY命令で保存された画像ファイルの読み込みに対応

表示例２

URLパラメータの指定により、タイトルバーなどを非表示にし、画像のみを表示させることも可能です。

使い方

https://www.minagi.jp/apps/mgv/にアクセスします。

ファイルの読み込み

ローカルファイルシステム上のファイルを読み込む場合は「この端末のファイルを読み込む」（Load from this device）を押すとその環境のファイル選択画面が開くのでファイルを選択してください。

また、ドラッグ＆ドロップが行える環境では、読み込みたいファイルを本アプリにドロップすることでも読み込めます。

Web上のファイルを読み込む場合、またはData URIを指定して読み込む場合は「URLを指定して読み込む」（Load by specify URL）を押すとURL入力ダイアログボックスが表示されるので、画像ファイルのURL（またはData URI）を入力してOKボタンを押してください。

画像が読み込まれると画面に表示されます。

クリップボードへのコピー

読み込み後、「クリップボードにコピーする」（Copy to clipboard）を押すと、読み込まれた画像のPNG形式のData URIがクリップボードにコピーされます。別途ブラウザを起動し、クリップボードにコピーされたData URIをURL欄に貼り付けることで読み込み後の画像を表示できます。スマートフォンなど、本アプリに表示された画像を直接クリップボードにコピーできない環境では、この方法で読み込み後の画像をダウンロードすることができます。

読み込み動作の設定

画面モードや背景色、ファイル形式を指定することができます。読み込み後に変更することもできます。変更はただちに反映されます。

画面モード

画面モードを選択します。スクリーンモードの番号・名称はMSX BASICのものとVDP（TMS9918、V9938、V9958）のものを併記しています。

「自動判別」（Auto detect）を有効にすると、ファイル名の拡張子をもとに、下記の条件でスクリーンモードを自動で判定します。

拡張子スクリーンモード
最後の１文字が「2」SCREEN 2 / GRAPHIC 2
最後の１文字が「3」SCREEN 3 / MULTI COLOR
最後の１文字が「4」SCREEN 4 / GRAPHIC 3
最後の１文字が「5」SCREEN 5 / GRAPHIC 4
最後の１文字が「6」SCREEN 6 / GRAPHIC 5
最後の１文字が「7」SCREEN 7 / GRAPHIC 6
最後の１文字が「8」SCREEN 8 / GRAPHIC 7
最後の１文字が「A」
または最後の２文字が「10」		SCREEN 10 / GRAPHIC 7
最後の１文字が「B」
または最後の２文字が「11」		SCREEN 11 / GRAPHIC 7
最後の１文字が「C」であり、かつ最後の３文字が「PIC」でない
または最後の２文字が「12」

SCREEN 12 / GRAPHIC 7

上記のいずれにも当てはまらない場合は、指定された画面モードで処理します。

背景色（周辺色）

背景色をカラーピッカーから選択します。これはMSX BASICのCOLOR命令の第３パラメータ（周辺色）に当たるもので、読み込んだ画像のうち、カラーコード0のドットはここで選択した色で表示されます。

画面モードがSCREEN 2〜7、10、11の場合、パレット情報を持つファイルを読み込んだ後はカラーピッカーにもそのパレット情報が反映されます。画面モードがSCREEN 8の場合はカラーコード0〜15の固定の色が設定されます。

ファイル形式

ファイル形式を選択します。本アプリではBSAVE形式にくわえ、COPY命令で保存された画像ファイルの読み込みにも対応しています。「BSAVE形式」はMSX BASICのBSAVE命令で、「COPY形式」はCOPY命令で保存されたファイルとして読み込みます。

情報

画面右上の「i」のアイコンを押すと、読み込んだファイルの詳細な情報と、本アプリのバージョン情報などが表示されます。また、「設定を消去」（Erase settings）を押すと、画面モード、背景色、ファイル形式の設定情報が消去されます。

URLパラメータによる設定

MSX Graphic ViewerはURLでパラメータを受け取ることができます。

URLパラメータが指定された場合、保存されている設定よりもURLパラメータが優先されます。

項目説明
platform=ルック・アンド・フィールを指定します。「ios」（iOS風）、「android」（Android風）を指定できます。指定しない場合は自動で判別します。
language=表示言語を指定します。「ja」（日本語）、「en」（英語）を指定できます。指定しない場合は自動で判別します。
graphic_url=開きたい画像のファイルをURLで指定します。
graphic_screenmode=【画面モード】を指定します。2〜8、10〜12を指定できます。
graphic_screenmode_autodetect=【自動判別】を指定します。「yes」（自動判別する）、「no」（自動判別しない）を指定できます。
graphic_fileformat=【ファイル形式】を指定します。「bsave」（BSAVE形式）、「copy」（COPY形式）を指定できます。
backgroundcolor=【背景色】を指定します。MSX標準パレット（カラーコード0～15）から選択できます。
titlebar=タイトルバーを表示するかを指定します。「yes」（表示）、「no」（非表示）を指定できます。
「no」を指定した場合、ユーザーによる操作ができなくなるため、「graphic_url=」パラメータと併用する必要があります。
debug=デバッグモードを指定します。「on」（デバッグモード有効）、「off」（デバッグモード無効）を指定できます。
デバッグモードを有効にした場合、ブラウザのコンソールにデバッグ情報が出力されます。

呼び出しURL作成ツール

上記のパラメータを指定し、呼び出し用URLを生成するツールです。

設定項目設定値
実行
呼び出しURL

結果表示

その他

セキュリティ上の制限事項

URL指定による読み込みは、XMLHttpRequestを使用しているため、サーバー側の設定によっては、正しいURLを指定してもエラーとなる場合があります。例えば、Apache系のサーバーであれば、.htaccessファイルに、

<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin: "*"
</IfModule>

の記述が必要です。

リリース履歴

バージョンリリース日内容
1.0.62021/10/31軽微な修正
1.0.42020/1/17起動時に画面モードの説明テキストが正しく表示されないことがある不具合を修正。
1.0.02020/1/1Web版、Android版初回リリース
改訂履歴
［広告］