Showing posts with label 図形描画. Show all posts
Showing posts with label 図形描画. Show all posts

Monday, November 26, 2018

Processing3.4とjsilhouetteを使用して角丸四角を描画する

Processing3.4とjsilhouetteを使用して角丸四角を描画するには、以下のコードを実行します。jsilhouetteはhttp://code.google.com/p/jsilhouette/から jsilhouette-geom-0.3.1.jarをダウンロードしてSketchのフォルダのcodeサブフォルダに配置するか、 Sketch->Add FilesメニューからSketchに追加します。

import processing.awt.*;
import java.awt.*;

// キャンバスサイズ
size(200, 200);
background(#f8f8ff);
// 描画用PGraphics作成
PGraphicsJava2D g2d=(PGraphicsJava2D)createGraphics(200, 200, JAVA2D);
g2d.beginDraw();
Graphics2D gr = g2d.g2;
gr.setColor(new Color(#ffcc00));
// 角丸四角を描画
gr.fill(new MultiRoundRectangle(20, 50, 150, 100, 10, 40, 40, 10));
g2d.endDraw();

image(g2d, 0, 0);
// ファイル保存
save("sample1486a.png");

出力画像(sample1486a.png)
Processingとjsilhouetteを使用して描画した角丸四角


○動作環境
Processing 3.4

〇関連項目
・Processingをインストールした仮想マシンを構築するには、以下のページを参照してください。
https://serverarekore.blogspot.com/search/label/Processing

・Processingに関する他の記事は、こちらを参照してください。

Sunday, July 26, 2009

ImageMagickとPHPでランダムな草の影絵を描画する

Imagickでランダムな草の影絵を描画するには、以下のコードを実行します。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja"
xml:lang="ja" dir="ltr">
<head>
<title>sample1145(ImageMagick6.5.2)</title>
</head>
<body>
<?php
/* 画像サイズ */
$sx=200;
$sy=200;

/* 茎の幅 */
$rw = 20+rand(-2,2);

/* 根の位置 */
$rx = 100;
$ry = 200;

/* 繰り返し回数 */
$rt = 3;

/* 初期角度 */
$ia = 15;

/* 差分角度 */
$da = 26;

/* 描画色 */
$dc = "black";

/* 葉の長さ */
$ll = 90;

/* 葉の長さの差分 */
$dl = 10;




$im = new Imagick();
$im->newImage($sx, $sy, "none");
$im->setImageMatte(true);

$ca = $ia;



for($lc=0;$lc<$rt;$lc++){

$idraw = new ImagickDraw();
$idraw->setFillColor($dc);
$idraw->pathStart();
$idraw->pathMoveToAbsolute($rx-$rw/2, $ry);
$idraw->pathCurveToQuadraticBezierAbsolute(
$rx -$rw/2 + $ll/2*cos(pi()*($ca+40)/180),
$ry + $ll/2*sin(pi()*($ca+40)/180)*-1,
$rx -$rw/2 + $ll*cos(pi()*($ca)/180)+rand(0,10),
$ry + $ll*sin(pi()*($ca)/180)*-1+rand(0,10)
);
$idraw->pathCurveToQuadraticBezierAbsolute(
$rx +$rw/2 + $ll/2*cos(pi()*($ca+30)/180),
$ry + $ll/2*sin(pi()*($ca+30)/180)*-1,
$rx+$rw/2,
$ry
);
$idraw->pathClose();
$im->drawImage($idraw);
$idraw->destroy();


$idraw = new ImagickDraw();
$idraw->setFillColor($dc);
$idraw->pathStart();
$idraw->pathMoveToAbsolute($rx+$rw/2, $ry);
$idraw->pathCurveToQuadraticBezierAbsolute(
$rx +$rw/2 + $ll/2*cos(pi()*($ca+40)/180)*-1,
$ry + $ll/2*sin(pi()*($ca+40)/180)*-1,
$rx +$rw/2 + $ll*cos(pi()*($ca)/180)*-1+rand(0,10),
$ry + $ll*sin(pi()*($ca)/180)*-1+rand(0,10)
);
$idraw->pathCurveToQuadraticBezierAbsolute(
$rx -$rw/2 + $ll/2*cos(pi()*($ca+30)/180)*-1,
$ry + $ll/2*sin(pi()*($ca+30)/180)*-1,
$rx-$rw/2,
$ry
);
$idraw->pathClose();
$im->drawImage($idraw);
$idraw->destroy();



$rw -= 4;
$ca += $da+rand(-4,4);
$ll -= $dl;

}


$im->writeImage('sample1145a.png');
$idraw->destroy();
$im->destroy();
?>
<img src="sample1145a.png" /><br />

</body>
</html>


出力画像(sample1145a.png)
Imagickで描画した草の影絵

Sunday, July 12, 2009

SWFRendererで画像の上に文字列を描画する

SWFRendererで画像の上に文字列を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1058a.swf", 200, 200){
image(file: "sf.jpg")
font(new java.awt.Font('Tahoma', java.awt.Font.BOLD, 26))
text( x:10, y:100,
text: "San Francisco",
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1058a.swf)
SWFRendererで文字列を描画した画像

動作環境
groovy 1.6.0, JDK6 update12

Saturday, July 11, 2009

SWFRendererでサイの形を描画する

SWFRendererでサイの形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1057a.swf", 200, 200){
rhinoShape( x:0, y:10, width:200, height:180,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1057a.swf)
SWFRendererで描画したサイの形

動作環境
groovy 1.6.0, JDK6 update12

Friday, July 10, 2009

SWFRendererで正多角形を描画する

SWFRendererで正多角形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1056a.swf", 200, 200){
regularPolygon( cx:100, cy:100, radius:80, sides:5,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1056a.swf)
SWFRendererで描画した正多角形

動作環境
groovy 1.6.0, JDK6 update12

Thursday, July 09, 2009

SWFRendererで車の形を描画する

SWFRendererで車の形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1055a.swf", 200, 200){
raceCarShape( x:0, y:40, width:200, height:120,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1055a.swf)


動作環境
groovy 1.6.0, JDK6 update12

Wednesday, July 08, 2009

SWFRendererで二次曲線を描画する

SWFRendererで二次曲線を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1054a.swf", 200, 200){
quadCurve( x1:200, y1:0, ctrlx:0, ctrly: 100,
x2:200, y2:200,
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1054a.swf)


動作環境
groovy 1.6.0, JDK6 update12

Tuesday, July 07, 2009

SWFRendererでアイスクリーム形を描画する

SWFRendererでアイスクリーム形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1053a.swf", 200, 200){
iceCreamShape( x:0, y:40, width: 200, height:120,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1053a.swf)
SWFRendererで描画したアイスクリーム形

動作環境
groovy 1.6.0, JDK6 update12

Monday, July 06, 2009

SWFRendererで足形を描画する

SWFRendererで足形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1052a.swf", 200, 200){
footShape( x:0, y:30, width:200, height:140,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1052a.swf)
SWFRendererで描画した足形

動作環境
groovy 1.6.0, JDK6 update12

Sunday, July 05, 2009

SWFRendererで魚型を描画する

SWFRendererで魚型を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1052a.swf", 200, 200){
fishShape( x:0, y:40, width:200, height:120,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力画像(sample1052a.swf)
SWFRendererで描画した魚型

動作環境
groovy 1.6.0, JDK6 update12

Saturday, July 04, 2009

SWFRendererでドーナツ形を描画する

SWFRendererでドーナツ形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1051a.swf", 200, 200){
donut( cx:100, cy:100, ir:50, or:90,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1051a.swf)


動作環境
groovy 1.6.0, JDK6 update12

Friday, July 03, 2009

ImageMagickとPHPでランダムな円を描画する

Imagickでランダムな円を描画するには、以下のコードを実行します。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja"
xml:lang="ja" dir="ltr">
<head>
<title>sample1152(ImageMagick6.5.2)</title>
</head>
<body>
<?php
/* 画像サイズ */
$sw = 200;
$sh = 200;

/* 円の半径 */
$minr = 5;
$maxr = 20;

/* 線の太さ */
$minsw = 3;
$maxsw = 6;

/* 円の数 */
$noc = 30;

/* 円の色 */
$cc = array(
"#7799ff80",
"#ffd02080",
"#ff705080",
"#c0ff9080"
);

$im = new Imagick();
$im->newImage($sw, $sh, "none");
$im->setImageMatte(true);
$idraw = new ImagickDraw();
$idraw->setFillColor("none");
for($lc=0;$lc<$noc;$lc++){
$idraw->setStrokeColor($cc[rand(0,count($cc)-1)]);
$idraw->setStrokeWidth(rand($minsw, $maxsw));
$rad = rand($minr, $maxr);
$idraw->ellipse(rand(0,$sw),rand(0,$sh),
$rad, $rad,0,360);
}
$im->drawImage($idraw);

$im->writeImage('sample1152a.png');

$idraw->destroy();
$im->destroy();
?>
<img src="sample1152a.png" /><br />

</body>
</html>


出力画像(sample1152a.png)
Imagickで描画したランダムな円

SWFRendererでイルカを描画する

SWFRendererでイルカを描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1050a.swf", 200, 200){
dolphinShape( x:0, y:20, width:200, height:160,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1050a.swf)
SWFRendererで描画したイルカ

動作環境
groovy 1.6.0, JDK6 update12

Thursday, July 02, 2009

SWFRendererでCubic curveを描画する

SWFRendererでCubic curveを描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1049a.swf", 200, 200){
cubicCurve( x1: 40, y1:200, ctrlx1:0, ctrly1:50,
ctrlx2:200, ctrly2: 0, x2:160, y2:200,
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1049a.swf)
SWFRendererで描画したcubic curve

動作環境
groovy 1.6.0, JDK6 update12

Wednesday, July 01, 2009

SWFRendererで十字形を描画する

SWFRendererで十字形を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1048a.swf", 200, 200){
cross( cx: 100, cy: 100, width:20, radius:50,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1048a.swf)
SWFRendererで描画した十字形

動作環境
groovy 1.6.0, JDK6 update12

Tuesday, June 30, 2009

SWFRendererで蝶を描画する

SWFRendererで蝶を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1047a.swf", 200, 200){
butterflyShape( x: 0, y: 0, width: 200, height: 200,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1047a.swf)
SWFRendererで描画した蝶

動作環境
groovy 1.6.0, JDK6 update12

Monday, June 29, 2009

SWFRendererで吹き出しを描画する

SWFRendererで吹き出しを描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

// groovy 1.6.0, JDK6 update12
def gr = new SWFRenderer()
gr.renderToFile("sample1046a.swf", 200, 200){
balloon( x: 80, y: 20, width: 100, height: 100,
fill: color("#bbddff"),
tabLocation: "left",
tabDisplacement: 0.8,
tabHeight: 10,
tabWidth: 10,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}



出力SWF(sample1046a.swf)

Sunday, June 28, 2009

SWFRendererで矢印を描画する

SWFRendererで矢印を描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

// groovy 1.6.0, JDK6 update12
def gr = new SWFRenderer()
gr.renderToFile("sample1045a.swf", 200, 200){
arrow( x: 10, y: 10, width: 150, height: 100,
angle:45,
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1045a.swf)
SWFRendererで描画した矢印

動作環境
groovy 1.6.0, JDK6 update12

関連項目
groovyで矢印を描画する

Friday, June 26, 2009

SWFRendererでポリラインを描画する

SWFRendererでポリラインを描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

def gr = new SWFRenderer()
gr.renderToFile("sample1043a.swf", 200, 200){
polyline( points: [198,0, 0,100, 198,198],
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1043a.swf)
SWFRendererで描画したポリライン

動作環境
groovy 1.6.0, JDK6 update12

関連項目
groovyでポリラインを描画する

Thursday, June 25, 2009

SWFRendererでポリゴンを描画する

SWFRendererでポリゴンを描画するには、以下のコードを実行します。


import java.awt.*
import groovy.swing.j2d.swf.*

// groovy 1.6.0, JDK6 update12
def gr = new SWFRenderer()
gr.renderToFile("sample1042a.swf", 200, 200){
polygon( points: [100,0, 0,198, 198,198],
fill: new Color(0xbb, 0xdd, 0xff, 0xff),
borderColor: new Color(0x11, 0x33, 0x77, 0xff) )
}


出力SWF(sample1042a.swf)
SWFRendererで描画したポリゴン

動作環境
Groovy1.6.0, JDK1.6 Update12

関連項目
groovyでポリゴンを描画する