ブックカバー作成用グラフィックス関数解説

※ このページは SVG 画像を含んでいるので、 Firefox など SVG を表示できるブラウザーで見て下さい。

あらまし

C または Java 言語から（文庫本サイズの）ブックカバー用の SVG ファイルを作成するための特定用途専用の自家製グラフィックスライブラリーです。 Processing (https://processing.org/) という言語と できるだけ同じ名前で描画関数を用意しています。 しかし、いくつかの関数は簡略化されていますし、当然ながら、 アニメーションやインタラクション関係の関数はありません。

座標系

初期状態では、紙の左上が原点で、x 軸は右向き、y 軸は下向きにのびています。 （ふつう数学で使う座標系と y 軸の向きが逆です。） 長さの単位は mm（ミリメートル）です。

サイズは A4 紙横向きがデフォルトになっています。 A4 紙のサイズは 横 297mm × 縦 210mmです。 ブックカバーにしたとき、描いた図形が本の表面に現れるようにするには、 だいたい (43, 31)—(253, 179) の座標の範囲 （横 210mm × 縦 148mm）に図形がおさまるようにして下さい。

#include （C 言語）あるいは import （Java 言語）

import static util.SVGUtil.*;

#include "svg.h"

/* 間違い */  
#include <svg.h>

関数一覧

初期設定・その他

void setPageSize(double width, double height);

使用する場合は start() の前に呼び出します。 紙のサイズを幅 width, 高さ heightに設定します。 A4 サイズの場合は void a4Portrait(), void a4Landscape() を使ってください。

void start(void);

描画の開始のときに必ず呼び出します。

void finish(void);

描画の終了のときに必ず呼び出します。

void rulers(void);

文庫本ブックカバーの折り目の目安となる細い線を描きます。

void trimMark(void);

“トンボ”を描きます。 （CraftROBO のペーパークラフト用）

色・属性設定

初期状態は、線なし・塗潰し黒です。

void stroke(unsigned int color);

線の色を設定します。色は 0xRRGGBB の形式で指定します。

void strokeWeight(double w);

線の太さを設定します。

void strokeOpacity(double opacity);

線の透明度を 0（完全透明）〜 1（完全不透明）の値で指定します。

void noStroke(void);

線を描きません。

void fill(unsigned int color);

塗潰しの色を設定します。色は 0xRRGGBB の形式で指定します。

void fillOpacity(double opacity);

塗潰しの透明度を 0（完全透明）〜 1（完全不透明）の値で指定します。

void noFill(void);

塗潰ししません。

void textFont(char*（Java では String） fontName, double size);

文字のフォントとサイズ（単位 mm）を設定します。 （初期値は "MS-Mincho", 12mm です。） Windows上で SVGを閲覧する場合、fontName としては "serif", "sans-serif", "monospace", "cursive", "fantasy", "ＭＳ 明朝", "ＭＳ ゴシック", "ＭＳ Ｐゴシック", "ＭＳ Ｐ明朝", （注: ＭとＳとＰは全角、空白は半角） "Arial", "Times New Roman", "Verdana", "Courier New", "Andale Mono", "Comic Sans MS", "Garamond", "Georgia", "Impact", "Tahoma", "Trebuchet MS" などが使えるはずです。

基本図形

void line(double x1, double y1, double x2, double y2);

(x1, y1) から (x2, y2) へ線分を描きます。

void rect(double x, double y, double w, double h);

左上の頂点の座標が (x, y)、幅 w、 高さ h の長方形を描きます。

void ellipse(double x, double y, double w, double h);

中心の座標が (x, y)、幅 w、 高さ h の楕円を描きます。

void triangle(double x1, double y1, double x2, double y2, double x3, double y3);

3つの頂点の座標が (x1, y1), (x2, y2), (x3, y3) の 三角形を描きます。

void quad(double x1, double y1, double x2, double y2, double x3, double y3, double x4, double y4);

4つの頂点の座標が (x1, y1), (x2, y2), (x3, y3), (x4, y4) の 四角形を描きます。

void arc(double x, double y, double w, double h, double start, double stop);

円弧を描きます。

(x, y)   円弧の楕円の中心の座標
(w, h)   円弧の楕円の幅と高さ
start    円弧を開始する角（単位はラジアン）
stop     円弧を終了する角（単位はラジアン）

void arc360(double x, double y, double w, double h, double start, double stop);

円弧を描きます。

(x, y)   円弧の楕円の中心の座標
(w, h)   円弧の楕円の幅と高さ
start    円弧を開始する角（単位は度）
stop     円弧を終了する角（単位は度）

void bezier(double ax0, double ay0, double cx0, double cy0, double cx1, double cy1, double ax1, double ay1);

ベジエ曲線を描きます。

(ax0, ay0)  1つめのアンカーポイントの座標
(cx0, cy0)  1つめのコントロールポイントの座標
(cx1, cy1)  2つめのコントロールポイントの座標
(ax1, ay1)  2つめのアンカーポイントの座標

void text(char* str, double x, double y, ...); （C 版）

void text(String str, double x, double y, Object... args); （Java 版）

文字列 str を座標 (x, y) に表示します。

サンプルプログラム

C 版 C/FirstSample.c

Java 版 Java/FirstSample.java

上記のプログラムが生成する図形（フルページで表示）

折れ線・曲線・多角形

void beginShape(void);

図形の定義を開始します。

void vertex(double x, double y);

beginShape で定義を開始した図形に頂点 (x, y) を追加します。

void bezierVertex(double cx0, double cy0, double cx1, double cy1, double ax1, double ay1);

beginShape で定義を開始した図形にベジエ曲線を追加します。

(cx0, cy0)  1つめのコントロールポイントの座標
(cx1, cy1)  2つめのコントロールポイントの座標
(ax1, ay1)  2つめのアンカーポイントの座標

void endShape(int close); （C 版）

beginShape で定義を開始した図形の定義を終了します。 closeが 0 以外のときは、図形を閉じ多角形を描きます。 closeが 0 のときは、閉じずに折れ線になります。

void endShape(boolean close); （Java 版）

beginShape で定義を開始した図形の定義を終了します。 close が true のときは、図形を閉じ多角形を描きます。 close が false のときは、閉じずに折れ線になります。

注意:

beginShape と endShape の間に vertex と bezierVertex 以外の描画関係の関数を呼び出さないようにして下さい。

画像

void image(char*String url, double x, double y, double w, double h);

インターネット上の画像を 左上の頂点の座標が (x, y)、幅 w、 高さ h の長方形内に描画します。

色関連のユーティリティー

unsigned int hsb1(double h, double s, double v);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, v（明度）から計算します。 h（色相）, s（彩度）, v（明度）はそれぞれ 0 から 1 の範囲の数で指定します。

unsigned int hsb100(double h, double s, double v);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, v（明度）から計算します。 h（色相）, s（彩度）, v（明度）はそれぞれ 0 から 100 の範囲の数で指定します。

unsigned int hsb360(double h, double s, double v);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, v（明度）から計算します。 h（色相）は 0 から 360 の範囲、 s（彩度）, v（明度）はそれぞれ 0 から 100 の範囲の数で指定します。

unsigned int hsb255(double h, double s, double v);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, v（明度）から計算します。 h（色相）, s（彩度）, v（明度）はそれぞれ 0 から 255 の範囲の数で指定します。

unsigned int hsl1(double h, double s, double l);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, l（輝度）から計算します。 h（色相）, s（彩度）, l（輝度）はそれぞれ 0 から 1 の範囲の数で指定します。

unsigned int hsl100(double h, double s, double l);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, l（輝度）から計算します。 h（色相）, s（彩度）, l（輝度）はそれぞれ 0 から 100 の範囲の数で指定します。

unsigned int hsl360(double h, double s, double l);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, l（輝度）から計算します。 h（色相）は 0 から 360 の範囲、 s（彩度）, l（輝度）はそれぞれ 0 から 100 の範囲の数で指定します。

unsigned int hsl255(double h, double s, double l);

fill 関数や stroke 関数の引数として与えるための色の値を h（色相）, s（彩度）, l（輝度）から計算します。 h（色相）, s（彩度）, l（輝度）はそれぞれ 0 から 255 の範囲の数で指定します。

unsigned int rgb1(double r, double g, double b);

fill 関数や stroke 関数の引数として与えるための色の値を 光の三原色 r（赤）, g（緑）, b（青）から計算します。 r（赤）, g（緑）, b（青）はそれぞれ 0 から 1 の範囲の数で指定します。

unsigned int rgb100(double r, double g, double b);

fill 関数や stroke 関数の引数として与えるための色の値を 光の三原色 r（赤）, g（緑）, b（青）から計算します。 r（赤）, g（緑）, b（青）はそれぞれ 0 から 100 の範囲の数で指定します。

unsigned int rgb255(double r, double g, double b);

fill 関数や stroke 関数の引数として与えるための色の値を 光の三原色 r（赤）, g（緑）, b（青）から計算します。 r（赤）, g（緑）, b（青）はそれぞれ 0 から 255 の範囲の数で指定します。

unsigned int bw1(double v);

fill 関数や stroke 関数の引数として与えるための無彩色の値を 0（黒）から 1（白）の値で指定します。

unsigned int bw100(double v);

fill 関数や stroke 関数の引数として与えるための無彩色の値を 0（黒）から 100（白）の値で指定します。

unsigned int bw255(double v);

fill 関数や stroke 関数の引数として与えるための無彩色の値を 0（黒）から 255（白）の値で指定します。

unsigned int rotateH360(unsigned int color, double a);

色相を a 度変えた新しい色を計算します。

unsigned int rotateH(unsigned int color);

色相を“適当に”変えた新しい色を計算します。

乱数その他のユーティリティ

void randomSeed(unsigned int seed);

乱数の種を明示的に設定します。 （デバッグ用に常に同一の乱数列を発生させたいときに 使用します。通常は呼ぶ必要はありません。）

void randomizeByTime(void);

乱数の種を現在時刻により、設定します。 （start から randomizeByTime が呼ばれているので、 通常は明示的に呼ぶ必要はありません。）

double randomInRange(double min, double max);

min から max の範囲（ただし、min は含み、max は含まない）の乱数を発生します。

double radians(double deg);

度をラジアンに変換します。

タートルグラフィックス関数

“亀”は最初ページの真ん中 (148.5, 105) に ペンを下げた状態で 0 度の向き（右）を向いています。

void forward(double len);

現在、向いている向きに len だけ移動します。

void backward(double len);

現在の向きと逆向きに線を描画せずに len だけ移動します。

void turn(double angle);

右方向に angle 度回転します。 （左方向に回転する時は負の数を渡します。）

void penUp(void);

ペンを上げます。（この状態で移動しても線を描きません。）

void penDown(void);

ペンを下げます。（この状態で移動すると線を描きます。）

void direction(double dir);

現在の向きに関係なく、direction 度の方向を向きます。

void go(double x, double y);

現在の位置に関係なく、(x, y) に移動します。この間、ペンの状態に関係なく、 線は描きません。

void center(void);

最初の位置（中央）に戻ります。

double getX(void);

現在の“亀”の x 座標を返します。

double getY(void);

現在の“亀”の y 座標を返します。

double getAngle(void);

現在の“亀”の向き（単位: 度）を返します。

void pushTurtle(void);

現在の“亀”の位置と向きをバックアップします。

void popTurtle(void);

“亀”の位置と向きを，以前 pushTurtleでバックアップしたものに戻します。

void say(char* str, ...);（C 版）

void say(String str, Object... args);（Java 版）

現在の“亀”の位置と向きに，文字列 str を描画します。このとき、“亀”は移動しません。

タートルグラフィックスのサンプルプログラム

C 版 C/TurtleSample.c

Java 版 Java/TurtleSample.java

上記のプログラムが生成する図形（フルページで表示）

座標系変換関係

void translate(double x, double y);

以降の描画に使用する座標系を (x, y) だけ平行移動します。

void rotate(double theta);

以降の描画に使用する座標系を原点を中心に theta（単位ラジアン）回転します。

void scale(double sx, double sy);

以降の描画に使用する座標系を縦方向に sx, 横方向に sy だけ拡大します。

void pushMatrix(void);

現在、使用している座標系を保存します。

void popMatrix(void);

最近 pushMatrix で保存した座標系を取り出します。

void resetMatrix(void);

座標系を最初のものに戻します。

展開図関係（Java版のみ）

ペーパークラフトで正多面体を作成するための関数群です。

public static void setRegularPolyhedronNet(int n)

正 n 面体の展開図を設定します。 n は 4, 6, 8, 12, 20 のいずれかです。 展開図の大きさは (10, 10) — (287, 200) （A4 サイズでマージンを 1cm取った大きさ） の範囲にフィットするように調節します。

public static void fitPolyhedronNet(double xmin, double ymin, double xmax, double ymax)

展開図の大きさを (xmin, ymin) — (xmax, ymax) の範囲にフィットするように調節します。

public static void drawBackgroundPolyhedron()

設定されている展開図を描画します。

public static void lineSpherical(double x1, double y1, double z1, double x2, double y2, double z2)

三次元空間内の線分 (x1, y1, z1) — (x2, y2, z2) を単位球に内接する正多面体に射影した線分を展開図中に描きます。

展開図は、以下の関数で利用されます。 通常の二次元描画関数は展開図を無視しますが、 タートルグラフィックス関係は、展開図の“端”で、 “つながっている”辺にジャンプします．

public static void circleSpherical(double x1, double y1, double z1, double r)

三次元空間内の球（中心: (x1, y1, z1)、半径: r） を単位球に内接する正多面体に射影した曲線を展開図中に描きます。

public static void triangleSpherical(double x1, double y1, double z1, double x2, double y2, double z2, double x3, double y3, double z3)

三次元空間内の三角形 (x1, y1, z1) — (x2, y2, z2) — (x3, y3, z3) を単位球に内接する正多面体に射影した三角形を展開図中に描きます。

展開図関係のサンプルプログラム

Java 版 Java.old/RandTest2.java

Java 版 Java.old/PolyhedronTest.java

上記のプログラムが生成する図形

（フルページで表示）

（フルページで表示）

球面上タートル（Java版のみ）

import static util.SVGUtil.*;

の代わりに、

import static util.SphericalUtil.*;

として下さい。

平面上のタートルと命令は同じですが、球面上を動きます。 ただし、forward の単位は角度になります。 また、direction, go, center, getX, getY, getAngle などの関数は次の関数に置き換えられます。

public static void go(double x, double y, double z)

(x, y, z)（を球面上に射影した点）に移動します。

public static double[] getTurtle()

現在のカメの位置（球面上）を要素数 3 の配列として返します。

public static double[] getDirection()

現在のカメの向きを要素数 3 の配列として返します。

球面上タートルのサンプルプログラム

Java 版 Java.old/SphericalTest.java

上記のプログラムが生成する図形（フルページで表示）

ソースのダウンロードとコンパイル

• Java 言語版
• C 言語版