ulam/prime_conspiracy.html at master · silveira/ulam · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<html>
 <head>
  <script type="application/javascript">
  // I changed the orignal script after reading https://www.quantamagazine.org/20160313-mathematicians-discover-prime-conspiracy/

  // primality test from http://www.javascripter.net/faq/numberisprime.htm
	function isPrime(n) {
		if (isNaN(n) || !isFinite(n) || n%1 || n<2) return false;
		if (n%2==0) return (n==2);
		if (n%3==0) return (n==3);
		var m=Math.sqrt(n);
		for (var i=5;i<=m;i+=6) {
			if (n%i==0)     return false;
			if (n%(i+2)==0) return false;
		}
		return true;
	}

    function draw() {
      var canvas = document.getElementById('canvas');
	  var width = canvas.width;
	  var height = canvas.height;
	  var pos_x = width/2;
	  var pos_y = height/2;
	  var fg_colors = {};
	  var bg_color = "rgb(0,0,0)";
	  var boxsize = 1;					// pixel size

      // one color for each possible prime ending
      fg_colors["1"] = "rgb(0,200,0)";
      fg_colors["2"] = "rgb(200,200,0)";
      fg_colors["3"] = "rgb(200,0,0)";
      fg_colors["5"] = "rgb(200,200,200)";
      fg_colors["7"] = "rgb(0,0,200)";
      fg_colors["9"] = "rgb(0,200,200)";

      if (canvas.getContext) {
        var ctx = canvas.getContext("2d");

		// draw a point in the center


		var n = 1;		// the number to be test if it is prime
		var steps = 1;			// spiral counter while drawing
		var direction = 'right';	// spiral direction while drawing

		while(n<1000000){
			for(var twice=0; twice<2; twice++){
				for(var i=0; i<steps; i++){
					if(isPrime(n)){
                                                ctx.fillStyle = fg_colors[n.toString().slice(-1)];
					} else {
						ctx.fillStyle = bg_color;
					}
					ctx.fillRect (pos_x, pos_y, boxsize, boxsize);

					// update the position
					if (direction=='up')    { pos_y -= boxsize }
					if (direction=='left')  { pos_x -= boxsize }
					if (direction=='down')  { pos_y += boxsize }
					if (direction=='right') { pos_x += boxsize }

					n++;
				}

				// update the direction anticlockwise
				if      (direction=='up')    {direction = 'left'; }
				else if (direction=='left')  {direction = 'down'; }
				else if (direction=='down')  {direction = 'right';}
				else if (direction=='right') {direction = 'up'; }
			}

			steps++;
		}
      }
    }
  </script>
 </head>
 <body onload="draw();">
   <canvas id="canvas" width="800" height="800"></canvas>
 </body>
</html>