3

Mandlebrotのセットのようなものをいじっています。なぜなら、それが生成する写真はきれいだと思うからです。私は、JavaScriptで描画する問題に取り組み、自分に何ができるかを確認しようと思った。私はいくつかのアルゴリズムを見ました、すなわち:

http://library.thinkquest.org/26242/full/progs/a2.html

私はこれに翻訳しました:

drawGraph: function(canvas,resolution,iterations,colors,coefficent){

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

                for(var m = 0; m < resolution.x; m++){
                    for(var n = 0; n < resolution.y; n++){
                        var x = m, 
                            x2 = x*x,
                            y = n, 
                            y2 = y*y;

                        var i;
                        for(i = 1; i < iterations; i++){
                            if(x2 + y2 > 4) break;

                            var new_x = x2 - y2 + coefficent.a;
                            var new_y = 2*x*y + coefficent.b;

                            x = new_x;
                            y = new_y;
                        }

                        var color = i % colors;

                        DrawUtils.drawPoint(context,m,n,color); 
                    }
                }
            }

これは基本的に1色のボックスを描画します。

それから私はこれを試しました:

http://en.wikipedia.org/wiki/Mandelbrot_set#Escape_time_algorithm

私はこれに翻訳しました:

drawGraph: function(canvas,resolution,iterations,colors,coefficent){

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

                for(var m = 0; m < resolution.x; m++){
                    for(var n = 0; n < resolution.y; n++){
                        var x = 0,
                            y = 0,
                            x0 = ((m/resolution.x) * 3.5) - 2.5,
                            y0 = ((n/resolution.y) * 2) - 1;

                        var i = 0;
                        while(x*x + y*y < 4 && i < iterations){
                            var x_temp = x*x - y*y + x0;
                            y = 2*x*y + y0;
                            x  = x_temp;
                            i++;
                        }

                        var color = 0;
                        if(x*x + y*y >= 4){
                            color = i % colors;
                        }

                        DrawUtils.drawPoint(context,m,n,color);
                    }
                }
            }

これはブラックボックスを生成します。x0とy0のスケーリングはピクセルの要素であると言っていたので、アルゴリズムの言い回しは私を混乱させましたが、アルゴリズムの後、係数c = x0+iy0と言います。それで、それは私が関数に所定の係数を渡さないことを意味しますか?

これらのテストのほとんどで、係数0.25 + 0iを使用していましたが、まったく同じ結果が得られる他のテストを試しました。

私はここで何が間違っているのですか?

4

2 に答える 2

4

最初のポイント:ジュリア集合とマンデルブロ集合の違いを明確にする必要があります。どちらも反復中の動作に関する洞察ですf(z) = z^2 + cが、異なる視点からのものです。

ジュリア集合の場合、cさまざまなイニシャルがどのようにz動作するかを修正してプロットします

マンデルブロ集合の場合、同じイニシャルz = 0が異なるcsに対してどのように動作するかをプロットします。

それに対処して...


c最初のコード( inのジュリア集合を描画しようとするcoefficient)の場合、リンク先の最初のページのBASICからの翻訳は完全に正しくありません。それがどこにあるか

‘ run through every point on the screen, setting 
‘ m and n to the coordinates
FOR m = x_minimum TO x_maximum STEP x_resolution
             FOR n = y_minimum TO y_maximum STEP y_resolution
                          ‘ the initial z value is the current pixel,  
                          ‘ so x and y have to be set to m and n
                          x = m: y = n

あなたが持っている

        for(var m = 0; m < resolution.x; m++){
            for(var n = 0; n < resolution.y; n++){

これは、実装するための手順を実行していないという重要な点を除いて、近いですSTEP x_resolution。Yourmは、からまでのステップで実行される整数です。に設定されています。0resolution.x - 11xm

したがって、たとえば-2-2iから2+2i(ジュリア集合を表示するための適切なビューポート)までの複素平面を見る代わりに、から0までの複素平面を見ることresolution.x + resolution.y iになります。これは、左下隅に最大で数ピクセルが設定されます。


2番目のコード(マンデルブロ集合を描画しようとする)に、正しい範囲にスケーリングするコードがあり、何が問題になっているのかすぐにはわかりません- @ user973572が問題である可能性があることを示唆しているように、デバッグしm/resolution.xて常にそうであるかどうかを確認します0

于 2011-10-19T09:07:21.377 に答える
2

最初の例では、x2とy2を更新するのを忘れたので、常に同じ値になると思います。合計が4より大きいかどうかを確認する前に、x2とy2を更新する必要があります。

for(i = 1; i < iterations; i++){
    x2 = x*x,
    y2 = y*y
    if(x2 + y2 > 4) break;

私はjavascriptについて何も知らないので、これはおそらく間違っています。

于 2011-10-18T04:03:28.140 に答える