thm0003

テーマ#0003: グラデーション画像の表示

• (by K, 2016.04.20)

基本情報

• テーマ提示日： 2016.04.20(水)
• プログラム例示日：
• 発表会予定日： 調整中（おそらく6月の平日の夕刻）
  • 会場はサイボウズ日本橋オフィス27Fを予定

背景

• さてかねてより計画していたレイトレーシングのテーマを設定しようと思っていたところ、それより前にグラフィックスが使える環境がどのくらいあるのか調査すべきだと思い立ち、それならばまずはレイトレーシングなどの複雑な課題ではなく、極端にシンプルな課題にすべきだと考えました。
  • ということでレイトレーシングは次回に！

テーマ説明

• 画面の256x256の正方形領域に、それぞれ異なる色の点を描画してください。
• プログラムを単純化しようとすると、結果的に画像がグラデーション・パターンになると思われます。それで構いません。
  • 例:
• 標準的なC言語では、グラフィックス描画手段を持たないので、代わりにメジャーなフォーマットの画像ファイルを生成してください。それでも課題をクリアしているとみなします。画像ファイルとしてメジャーかどうかは、たとえば一般的なブラウザで表示できるか、などを基準とします。

C言語による例示（ファイル生成版）

#include <stdio.h>

char b[3], a[54] = {
    0x42, 0x4d, 0x36, 0x00, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x36, 0x00, 0x00, 0x00, // BITMAPFILEHEADER
    0x28, 0x00, 0x00, 0x00, 0x00, 0x01, 0x00, 0x00, 0x00, 0x01, 0x00, 0x00, 0x01, 0x00, 0x18 // BITMAPINFOHEADER
    // 残りはすべて0
};

int main()
{
    int i;
    FILE *fp = fopen("a.bmp", "wb");
    fwrite(a, 1, 54, fp);
    for (i = 0; i < 256 * 256; i++) {
        b[2] = i & 255; // red
        b[1] = 255 - ((i >> 8) & 255); // green
        fwrite(b, 1, 3, fp);
    }
    fclose(fp);
    return 0;	
}

• BMPファイルのフォーマットについては、こちらを参考にしました（どうもありがとうございます）。
  • http://www.setsuki.com/hsp/ext/bmp.htm

C言語による例示（blikeライブラリ利用版）

#include "blike.h"

blMain()
{
    int x, y;
    openWin(256, 256);
    for (y = 0; y < 256; y++) {
        for (x = 0; x < 256; x++)
            setPix(x, y, rgb(x, y, 0));
    }
    wait(-1);
}

• [註] c_blike_01fだと、rbg → bl_rgb の#defineを書き間違えているので、上記のままではビルドができない。
  • バグを修正した c_blike_01g を準備予定です。

そのほかの特記事項

• OSECPU-VMでは8バイトで上記画像を表示できます。また色が違ってもよければ課題を満たす表示をするプログラムを6バイトで書くこともできます。

エントリ状況

• この欄はKが随時編集しますので、勝手に編集しないでください。エントリーしたい、自己記録を更新した、Kの書き間違いを見つけたので直して、などは、下記のこめんと欄にお願いします。
  • 何バイトを達成したか、使ったツールは何か、可能であれば発表会に出たいか、などを明記してください。

こめんと欄

• ひとまずJavaScript, 246文字でお願いします！ -- hikalium 2016-04-29 (金) 17:44:53
• J言語, 138文字, ファイル生成でお願いします！ -- hikalium 2016-04-30 (土) 00:45:14
• J言語, 128文字に更新します！ -- hikalium 2016-04-30 (土) 01:11:12
• PostScriptとかでやったら面白いかな？ ブラウザでは見えないかもしれないけど・・・。いやこれは画像ファイルフォーマットではなく、プログラミング言語なのだ、という主張をすれば行けそう。 -- K 2016-04-30 (土) 10:36:37
• PostScript, 121バイトできました！（描画かつファイル）Macのプレビューでは一応表示できます！ -- hikalium 2016-05-02 (月) 13:45:18
• PostScriptありがとうござます！ もはやhikaliumさんの独壇場！！ 他の人はまだエントリーしないのかな？ -- K 2016-05-09 (月) 11:42:49
• C言語 91Byteです(標準出力に書き出す形式。) -- ttwilb 2016-05-13 (金) 15:55:03
• Rubyにて、PPMを標準出力に書き出すのが54バイト、PPMをファイル(a.ppm)に書き出すのが78バイトです。 -- ryna 2016-05-19 (木) 17:44:42
• 連投になりますが、C言語ではPPM形式を標準出力に書き出すのが78バイト、BMP形式で標準出力に書き出すのが103バイト、BMP形式でファイル(a.bmp)に書き出すのが119バイトです。Cで書いたのは思いっきりMacに依存してます（） -- ryna 2016-05-19 (木) 17:47:46
• ttwilbさんのがすごいと思っていたら、さらに上が来たー！ -- K 2016-05-20 (金) 00:34:32
• C言語 PPM形式標準出力で 81Byteです... rynaさんに及ばず。(ちなみに再起は使ってません) -- ttwilb 2016-05-20 (金) 16:01:02
• C言語 PPM形式で67Byteです -- ttwilb 2016-05-20 (金) 18:54:14
• C言語 PPM形式で63Byteです -- ttwilb 2016-05-20 (金) 20:51:18
• C言語　PPM形式ファイル作成(a.ppm) 81Byteです -- ttwilb 2016-05-20 (金) 21:09:53
• ttwilbさんの逆襲（？）がすごい！ -- K 2016-05-23 (月) 13:39:21
• J言語もPPM標準出力にすれば、まだまだ戦える？ -- K 2016-05-23 (月) 13:40:44
• 描画形式が盛り上がっていないのですが、HSPとかJavaとかやってみる人はいませんか？ -- K 2016-05-23 (月) 13:42:20
• RubyのPPM標準出力版を、47バイトに更新しました！ -- ryna 2016-05-25 (水) 16:42:24
• すごい…J言語でも勝てそうにない… -- hikalium 2016-05-25 (水) 18:31:48
• っていうか、Rubyが強すぎ？ thm001ではJ言語に次いで2位だったし、thm002でも1位だったし・・・。まあRubyが強いだけではなくて、rynaさんの技術力もすさまじそうだけど・・・。 -- K 2016-05-26 (木) 14:36:35
• ちなみにJ言語, a.ppm生成で現在74文字です -- hikalium 2016-05-27 (金) 22:42:17
• ちなみに、指定された言語ではないですが、PPMのstdoutへの書き出しはOCamlで152Byteです。またJavaScript版は185バイトです。ただしCSSのグラデーションを使っているのであまり正確ではないです。Canvasを使って正確に描画する版は208バイトです。 -- ttwilb 2016-05-29 (日) 00:24:48
• 指定された言語ではないですが、Processingで描画120バイトでした。 -- ttwilb 2016-05-29 (日) 00:46:44
• この回は、ひとまず許されていない言語でもOKということにします。特に描画のやつがほしいです！ -- K 2016-05-30 (月) 12:55:10
• C#で描画、217バイトです。あと Processingを119バイトに、JavaScriptを206バイトに更新しました。 -- ttwilb 2016-06-02 (木) 00:59:50
• Java言語で描画283Byteです。PostScriptで100Byteです(Acrobat Proで動作確認) -- ttwilb 2016-06-02 (木) 01:02:48
• OCamlで描画 (X11経由) が143バイトできました。 -- ryna 2016-06-02 (木) 16:14:45
• Javaで描画（スタンドアロンのクラスファイル）が268バイトです。 -- ryna 2016-06-02 (木) 17:26:12
• Processing 81Byteに更新します。Javaを262Byteに更新します。C言語を62Byteに更新します。 -- ttwilb 2016-06-03 (金) 16:06:47
• シェルスクリプトでPPM標準出力96Byteです -- ttwilb 2016-06-05 (日) 12:59:43
• ttwilbさんとrynaさんの競争が激しい！ -- K 2016-06-06 (月) 14:36:25
• Javascript(canvas利用型・描画)を192文字に更新します -- hikalium 2016-06-07 (火) 17:28:21
• CやJavaで勝てなくなってしまったので、Processingに挑戦しました。Processingにて75バイトです。 -- ryna 2016-06-07 (火) 19:16:43
• 投稿後すぐに気づいてしまったのですが、Processingを73バイトに更新しました。 -- ryna 2016-06-07 (火) 19:23:21
• Processing, 69バイトに更新しました! -- ttwilb 2016-06-07 (火) 22:44:10
• JavaScript(canvas), 176Byteに更新します。 -- ttwilb 2016-06-07 (火) 23:43:06
• Processingを53バイト(63バイトではないです！)に更新します。 -- ryna 2016-06-08 (水) 16:59:18
• シェルスクリプト、86バイトに更新しました! -- ttwilb 2016-06-08 (水) 17:28:48
• 本当にこんなサイズで表示できるの？？>Processing -- K 2016-06-10 (金) 18:41:06
• 私のコードに若干当てはまるのですが、「領域外への描画命令の発行」や、「画像ファイルへの余計なバイトの書き込み」などの正否はどうなりますでしょうか？ -- ryna 2016-06-10 (金) 22:42:36
• それと、シェルスクリプト(MacのBash)、PPMテキスト標準出力で61バイトでお願いします。 -- ryna 2016-06-10 (金) 22:46:10
• 私も色々ためしているのですが、Processingの53バイトは全く見当がつきません! -- ttwilb 2016-06-10 (金) 22:53:07
• 領域外への描画命令の発行は許可します（それでも変な表示が出ない処理系なら）。余計なバイトの書き込みも、まあいいとします。 -- K 2016-06-10 (金) 23:45:56
• いや、まあ、変な表示が出てもいいかな・・・。そういうことをするなとは書いていないわけだし・・・。 -- K 2016-06-11 (土) 06:00:40
• お久しぶりです、シェルスクリプトを59バイトに更新しました！ -- ryna 2016-09-01 (木) 10:39:31