7個の丸を、ある程度ランダムな配置で、円に並べるプログラムを組みたいと思うのですが、どういった記述をすればよいでしょうか?

出来ましたら、PHPでのソースでご返信下さい。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2013/06/01 22:16:21
  • 終了:2013/06/03 17:54:10
id:makocan

間違いました。
PHPではなく、HTML5かjavascriptでした。

ベストアンサー

id:dawakaki No.1

だわかき回答回数797ベストアンサー獲得回数1222013/06/02 07:21:45

ポイント50pt

円の中心からの角度をランダムに発生させて、その上に丸を描くプログラムを作ってみました。PHPにGDが入っていることが前提です。

<?php
define(X0, 250);    //丸を乗せる円の中心座標(X0, Y0)
define(Y0, 250);
define(R0, 200);    //丸を乗せる円の半径
define(R1, 20);     //丸の半径

//ランダムに丸の中心座標を求める
function getCoordinate() {
    $d = deg2rad(rand(0, 359));
    $x = R0 * cos($d) + X0;
    $y = R0 * sin($d) + Y0;

    return array($x, $y);
}

header("Content-Type: image/png");
$img = imagecreatetruecolor(500, 500);
$white = imagecolorallocate($img, 0xFF, 0xFF, 0xFF);
$blue  = imagecolorallocate($img, 0x00, 0x00, 0xFF);
imagefill($img, 0, 0, $white);  //背景を白色

//丸を7個ランダムに描く
for ($i = 1; $i <= 7; $i++) {
    list($x, $y) = getCoordinate();
    imagefilledarc($img, $x, $y, R1, R1, 0, 360, $blue, IMG_ARC_PIE);
}
imagepng($img);
?>

その他の回答(1件)

id:dawakaki No.1

だわかき回答回数797ベストアンサー獲得回数1222013/06/02 07:21:45ここでベストアンサー

ポイント50pt

円の中心からの角度をランダムに発生させて、その上に丸を描くプログラムを作ってみました。PHPにGDが入っていることが前提です。

<?php
define(X0, 250);    //丸を乗せる円の中心座標(X0, Y0)
define(Y0, 250);
define(R0, 200);    //丸を乗せる円の半径
define(R1, 20);     //丸の半径

//ランダムに丸の中心座標を求める
function getCoordinate() {
    $d = deg2rad(rand(0, 359));
    $x = R0 * cos($d) + X0;
    $y = R0 * sin($d) + Y0;

    return array($x, $y);
}

header("Content-Type: image/png");
$img = imagecreatetruecolor(500, 500);
$white = imagecolorallocate($img, 0xFF, 0xFF, 0xFF);
$blue  = imagecolorallocate($img, 0x00, 0x00, 0xFF);
imagefill($img, 0, 0, $white);  //背景を白色

//丸を7個ランダムに描く
for ($i = 1; $i <= 7; $i++) {
    list($x, $y) = getCoordinate();
    imagefilledarc($img, $x, $y, R1, R1, 0, 360, $blue, IMG_ARC_PIE);
}
imagepng($img);
?>
id:a-kuma3 No.2

a-kuma3回答回数4439ベストアンサー獲得回数18232013/06/03 16:57:55

ポイント50pt

こんな感じでしょうか?

<script type='text/javascript'>

CoordSupport = function() {
        this.init = function(cw, ch, x_min, x_max, y_min, y_max) {
            this.width_ = cw;
            this.height_ = ch;
            this.x_min_ = x_min;
            this.x_max_ = x_max;
            this.y_min_ = y_min;
            this.y_max_ = y_max;
            this.dx_ = (x_max - x_min) / cw;
            this.dy_ = (y_max - y_min) / ch;
        };
        this.pixel = function(x, y) {
            var px = (x - this.x_min_) / (this.x_max_ - this.x_min_) * this.width_;
            var py = (this.y_max_ - y) / (this.y_max_ - this.y_min_) * this.height_;
            return {"x": px, "y": py};
        };
    };

function drunk_circle7() {

    var canvas = document.getElementById('canvas-d');
    if (!canvas || !canvas.getContext) {
        alert("not support CANVAS !");
        return false;
    }

    var cs = new CoordSupport();
    cs.init(300, 300, -2, 2, -2, 2);
    canvas.width = cs.width_;
    canvas.height = cs.height_;

    var ctx = canvas.getContext('2d');

    var PI2 = Math.PI * 2.0;
    var dt = PI2 / 7;
    var R = 1.0;
    var R_S = 20;    // 円のずれ具合(ピクセル単位)
    var RAND_D = 10
    for (var i = 0 ; i < 7 ; ++i) {
        t = PI2 / 4 - (PI2 / 7 * i)
        var x = R * Math.cos(t)
        var y = R * Math.sin(t)

        p = cs.pixel(x, y);
        dx = Math.random() * RAND_D - RAND_D / 2
        dy = Math.random() * RAND_D - RAND_D / 2

        // ちょっとずれてる円
        ctx.strokeStyle = "green";
        ctx.beginPath();
        ctx.arc(p.x + dx, p.y + dy, R_S, 0, PI2, false);
        ctx.stroke();
        ctx.closePath();

        // ずれてない円
        ctx.strokeStyle = "pink";
        ctx.beginPath();
        ctx.arc(p.x, p.y, R_S, 0, PI2, false);
        ctx.stroke();
        ctx.closePath();

    }

}

window.onload = function() {
    drunk_circle7();
};
</script>


<canvas id="canvas-d"></canvas>


jsFiddle で試したのが、こちらです。
http://jsfiddle.net/a_kuma3/QTh35/embedded/result/

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません