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

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

あらまし

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

座標系

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

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

関数一覧

基本的に C, Javaとも関数名は共通です。 ただし、Cで unsigned int型の引数は、Javaではただのint型に、 char*型はString型になります。 逆で Java版の boolean型 は Cではただのint型になります。

初期設定・その他

void setPageSize(double width, double height);
使用する場合は start()の前に呼び出します。 紙のサイズを幅 width, 高さ heightに設定します。 A4サイズの場合は下のvoid a4Portrait(), void a4Landscape()を使ってください。
void a4Portrait()
紙のサイズを A4縦に設定します。
void a4Landscape()
紙のサイズを A4横に設定します。(デフォルト)
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 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 textFont(char* fontName, double size);
文字のフォントとサイズ(単位 mm)を設定します。 (初期値は "MS-Mincho", 12mmです。) Windows上で SVGを閲覧する場合、fontName としては "serif", "sans-serif", "cursive", "MS 明朝", "MS ゴシック", "MS Pゴシック", "MS P明朝", (注: MとSとPは全角、空白は半角) "Arial", "Times New Roman", "Verdana", "Courier New", "Andale Mono", "Comic Sans MS", "Garamond", "Georgia", "Impact", "Tahoma", "Trebuchet MS" などが使えるはずです。
void text(char* str, double x, double y);
文字列 strを座標 (x, y)に表示します。

サンプルプログラム

C版
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* url, double x, double y, double w, double h);
インターネット上の画像を 左上の頂点の座標が (x, y)、幅 w、 高さ h の長方形内に描画します。

色関連のユーティリティ

int hsb1(double h, double s, double v);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), v(明度)から計算します。 h(色相), s(彩度), v(明度)はそれぞれ 0 から 1 の範囲の数で指定します。
int hsb100(double h, double s, double v);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), v(明度)から計算します。 h(色相), s(彩度), v(明度)はそれぞれ 0 から 100 の範囲の数で指定します。
int hsb360(double h, double s, double v);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), v(明度)から計算します。 h(色相)は 0 から 360 の範囲、 s(彩度), v(明度)はそれぞれ 0 から 100 の範囲の数で指定します。
int hsb255(double h, double s, double v);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), v(明度)から計算します。 h(色相), s(彩度), v(明度)はそれぞれ 0 から 255 の範囲の数で指定します。
int hsl1(double h, double s, double l);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), l(輝度)から計算します。 h(色相), s(彩度), l(輝度)はそれぞれ 0 から 1 の範囲の数で指定します。
int hsl100(double h, double s, double l);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), l(輝度)から計算します。 h(色相), s(彩度), l(輝度)はそれぞれ 0 から 100 の範囲の数で指定します。
int hsl360(double h, double s, double l);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), l(輝度)から計算します。 h(色相)は 0 から 360 の範囲、 s(彩度), l(輝度)はそれぞれ 0 から 100 の範囲の数で指定します。
int hsl255(double h, double s, double l);
fill関数やstroke関数の引数として与えるための色の値を h(色相), s(彩度), l(輝度)から計算します。 h(色相), s(彩度), l(輝度)はそれぞれ 0 から 255 の範囲の数で指定します。
int rgb1(double r, double g, double b);
fill関数やstroke関数の引数として与えるための色の値を 光の三原色 r(赤), g(緑), b(青)から計算します。 r(赤), g(緑), b(青)はそれぞれ 0 から 1 の範囲の数で指定します。
int rgb100(double r, double g, double b);
fill関数やstroke関数の引数として与えるための色の値を 光の三原色 r(赤), g(緑), b(青)から計算します。 r(赤), g(緑), b(青)はそれぞれ 0 から 100 の範囲の数で指定します。
int rgb255(double r, double g, double b);
fill関数やstroke関数の引数として与えるための色の値を 光の三原色 r(赤), g(緑), b(青)から計算します。 r(赤), g(緑), b(青)はそれぞれ 0 から 255 の範囲の数で指定します。
int bw1(double v);
fill関数やstroke関数の引数として与えるための無彩色の値を 0(黒)から 1(白)の値で指定します。
int bw100(double v);
fill関数やstroke関数の引数として与えるための無彩色の値を 0(黒)から 100(白)の値で指定します。
int bw255(double v);
fill関数やstroke関数の引数として与えるための無彩色の値を 0(黒)から 255(白)の値で指定します。

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

void randomSeed(unsigned int seed);
乱数の種を明示的に設定します。(デバッグ用に常に同一の乱数列を発生させたいときに 使用します。通常は呼ぶ必要はありません。)
void randomizeByTime(void);
乱数の種を現在時刻により、設定します。 (startからrandomizeByTimeが呼ばれているので、通常は明示的に呼ぶ必要はありません。)
double randomInRange(double min, double 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);
現在の“亀”の現在の向き(単位: 度)を返します。

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

C版
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版
上記のプログラムが生成する図形
フルページで表示
フルページで表示

球面上タートル(Java版のみ)

import static util.SVGUtil.*;の代わりに、 import static util.SphericalTurtle.*;として下さい。

平面上のタートルと命令は同じですが、球面上を動きます。 ただし、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版
上記のプログラムが生成する図形(
フルページで表示

印刷の仕方

最新バージョンの Firefox で印刷します。 「ファイル」−「ページ設定」で「書式」の「印刷方向」を「横」、「余白」をすべて「0」、 「ヘッダとフッタ」をすべて「なし」に設定して下さい。 文庫版は A4(拡大/縮小 100%)で、 印刷します。

プリンタの方の設定でも、印刷の向きを「横」に設定して下さい。

なお、プリンタによってはどうしても左上に余計なマージンが取られ、 印刷位置がずれることがあります。その場合は、 “Adobe PDF”や “Microsoft XPS Document Writer” を使って PDF形式やXPS形式を経由すると、ピッタリの位置に印刷できるようです。


Koji Kagawa