-
Notifications
You must be signed in to change notification settings - Fork 39
/
ULAM.HTM
267 lines (267 loc) · 14 KB
/
ULAM.HTM
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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
<!doctype html>
<html lang="en-us" prefix="og: http://ogp.me/ns# article: http://ogp.me/ns/article#">
<head>
<meta charset="utf-8">
<meta name="Author" content="Dario Alejandro Alpern">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="ulam, spiral, number, prime">
<meta name="description" content="Web application that shows a graphical representation of prime numbers. Written by Dario Alpern.">
<meta name="twitter:card" content="summary_large_image">
<meta property="og:title" content="Ulam Spiral">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Alpertron">
<meta property="og:url" content="https://www.alpertron.com.ar/ULAM.HTM">
<meta property="og:image" content="https://www.alpertron.com.ar/ulam.png">
<meta property="og:image:width" content="817">
<meta property="og:image:height" content="428">
<meta property="og:image:alt" content="Screenshot">
<meta property="og:locale" content="en_US">
<meta property="og:locale:alternate" content="es_ES">
<meta property="og:description" content="This shows a graphical representation of prime numbers.">
<meta property="article:published_time" content="2024-11-04">
<meta property="fb:app_id" content="1495228927625175">
<link rel="alternate" hreflang="es" href="https://www.alpertron.com.ar/EULAM.HTM">
<link rel="alternate" hreflang="en" href="https://www.alpertron.com.ar/ULAM.HTM">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="canonical" href="https://www.alpertron.com.ar/ULAM.HTM">
<script async src="https://www.googletagmanager.com/gtag/js?id=G-Q7PH40GPHC"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-Q7PH40GPHC');
</script>
<title>Ulam Spiral</title>
<style>
@media print {nav {display:none}}
@media screen {
nav {background-color:#000080; width:100%; margin:0px; text-align:center}
nav ul {padding:0; margin:0 auto; list-style:none; display:inline-block}
nav li {float:left; position:relative; display:block; margin-top:0px; margin-bottom:0px; margin-left:5px; margin-right:5px; background-color:#000080; color:#FFFFFF; cursor: pointer; text-align:left}
nav li[aria-expanded="true"] {background-color:#004000; color:#FFFFFF}
nav li ul {display:none; position:absolute}
nav li[aria-expanded="true"] ul.alignleft {display:block; height:auto}
nav li[aria-expanded="true"] ul.alignright {display:block; height:auto; right:0px; background-color:#004000}
nav li ul li {clear:both; white-space: nowrap; border:0px; background-color:#004000; width:100%; padding-top:1em; padding-bottom:0.5em}
nav a:link{color:#FFFFFF; text-decoration:none}
nav a:visited{color:#FFFFFF; text-decoration:none}
nav a:hover{background-color:#004000; color:#FFFFFF; text-decoration:none}
nav a:active{background-color:#004000; color:#FFFFFF; text-decoration:none}
nav li ul li a:link{background-color:#004000; color:#FFFFFF; display:block; width:100%}
nav li ul li a:visited{background-color:#004000;color:#FFFFFF; display:block; width:100%}
nav li ul li a:hover{background-color:#FFFFFF; color:#004000; display:block; width:100%}
nav li ul li a:active{background-color:#FFFFFF; color:#004000; display:block; width:100%}
nav::after {clear:both}
@media (max-width: 400px) {nav {font-size:0.7em}}
@media (min-width: 400px) {nav {font-size:1em}}
}
#skip a {padding:6px; position:absolute; top:-40px; left:0px; color:white; border-right:1px solid white; border-bottom:1px solid white; border-bottom-right-radius:8px; background:#BF1722; transition:top 1s ease-out; z-index:100}
#skip a:focus {position:absolute; left:0px; top:0px; outline-color:transparent; transition: top .1s ease-in}
.bread {padding:0px;list-style:none; display:inline-block}
.bread li {display:inline}
.bread li+li:before {content:"›"}
body {font-family: Arial, sans-serif;margin:0; padding:0}
h1 {text-align:center}
#canvas {margin-left:auto; margin-right:auto; display:block; width:100%;text-align:center;vertical-align:middle; max-width:2000px;touch-action:none}
#applet {border: 0px none;width:100%;border-radius:10px}
#bottom {border: 0px none;width:100%;min-height:4em;padding:5px}
.pad {padding:10px}
input[type=button], button {border-radius:5px}
fieldset {border-radius:10px}
@media (min-height: 200px) {#canvas {height:100px}}
@media (min-height: 300px) {#canvas {height:200px}}
@media (min-height: 400px) {#canvas {height:300px}}
@media (min-height: 500px) {#canvas {height:400px}}
@media (min-height: 600px) {#canvas {height:500px}}
@media (min-height: 700px) {#canvas {height:600px}}
@media (min-height: 800px) {#canvas {height:700px}}
@media (min-height: 900px) {#canvas {height:800px}}
#cannotShow, #stop, #animform {display:none}
@media (min-width: 600px) {
#info {display:inline}
#inputboxes {display:inline; float:right}
#left {float:left}
#right {float:right}
}
@media screen and (prefers-color-scheme: dark) {
body {color: #ddd; background-color: #121212}
.applet {background-color:#606060; color: #fff}
a {color: #a3d4a7}
a:link,a:active {color: #a3d4a7}
a:hover {color: #f5cba7}
a:visited {color: #d7bde2}
input, textarea {color: white; background-color: #3b3b3b}
button:disabled {color: #808080; background-color: #606060}
}
</style>
<noscript>
<style>
.applet {display:none}
</style>
</noscript>
</head>
<body>
<div id="skip"><a href="#main">Skip to main content</a></div>
<nav aria-label="Main navigation">
<a id="left" href="#ulamspiral">Ulam Spiral</a>
<ul role="menubar">
<li role="menuitem" aria-haspopup="true" aria-expanded="false" tabindex="0">Electronics
<ul role="menu" class="alignleft popup">
<li role="menuitem"><a href="INTEL.HTM" hreflang="es" title="All Intel microprocessors from the 4004 up to Pentium (Spanish only)">Intel Microprocessors</a></li>
</ul>
</li>
<li role="menuitem" aria-haspopup="true" aria-expanded="false" tabindex="-1">Mathematics
<ul role="menu" class="alignleft popup">
<li role="menuitem"><a href="CALTORS.HTM" title="Web applications with JavaScript and WebAssembly implementing calculators">Calculators</a></li>
<li role="menuitem"><a href="NUMBERT.HTM" title="Articles and programs about number theory">Number Theory</a></li>
<li role="menuitem"><a href="PROBLEMS.HTM" title="Interesting math problems">Problems</a></li>
</ul>
</li>
<li role="menuitem" aria-haspopup="true" aria-expanded="false" tabindex="-1">Programs
<ul role="menu" class="alignright popup">
<li role="menuitem"><a href="ASSEM386.HTM" title="Programs written in 80386 Assembler">Assembler 80386</a></li>
<li role="menuitem"><a href="JAVAPROG.HTM" title="Web applications with JavaScript and WebAssembly">Web applications</a></li>
<li role="menuitem"><a href="GAMES.HTM" title="Computer games">Games</a></li>
</ul>
</li>
<li class="alignright" role="menuitem" aria-haspopup="true" aria-expanded="false" tabindex="-1">Contact
<ul role="menu" class="alignright popup">
<li role="menuitem"><a href="EPERS.HTM" title="Personal information">Personal</a></li>
<li role="menuitem"><a href="FORM.HTM" title="Form to send comments">Comments</a></li>
<li role="menuitem"><a href="EGBOOK.HTM" title="Old and new guestbook">Guestbook</a></li>
<li role="menuitem"><a href="PRIVACY.HTM" title="Privacy Policy">Privacy</a></li>
<li role="menuitem"><a href="DONATION.HTM" title="Donations to the author of this Web site">Donations</a></li>
</ul>
</li>
</ul>
<a id="right" href="EULAM.HTM" hreflang="es" title="Esta página Web en español">ESP</a>
</nav>
<main id="main"><article>
<noscript><p><strong>The interactive graphics does not work with Javascript disabled. Please check your browser settings.</strong></p></noscript>
<div id="applet">
<canvas id="canvas" aria-label="Ulam spiral" role="img" tabindex="0"></canvas>
<div id="bottom">
<div id="inputboxes">
<input id="animate" type="button" value="Animate">
<input id="stop" type="button" value="Stop">
<input id="zoomin" type="button" value="Zoom In">
<label for="center">Center spiral in number</label>
<input type="text" inputmode="numeric" id="center">
<br>
<input id="zoomout" type="button" value="Zoom Out">
<label for="start">Start spiral in number</label>
<input type="text" inputmode="numeric" id="start">
</div>
<div id="info"></div>
</div>
</div>
<div id="animform">
<fieldset><legend>Animation parameters</legend>
<p><label for="xincr"><var>x</var> increment:</label>
<input id="xincr" type="number" value="0" min="-10" max="10"></p>
<p><label for="yincr"><var>y</var> increment:</label>
<input id="yincr" type="number" value="0" min="-10" max="10"></p>
<p><label for="sincr">Start increment</label>
<input id="sincr" type="number" value="0" min="-10" max="10"></p>
<p><label for="delay">Delay in seconds:</label>
<input id="delay" type="number" value="1" min="0.1" max="10"></p>
<input id="doanimate" type="button" value="Animate">
<input id="cancelanim" type="button" value="Cancel">
</fieldset>
</div>
<div class="pad">
<h1 id="ulamspiral">Ulam Spiral</h1>
<ol class="bread" vocab="https://schema.org/" typeof="BreadcrumbList">
<li property="itemListElement" typeof="ListItem">
<a property="item" typeof="WebPage" href="ENGLISH.HTM"><span property="name">Alpertron</span></a>
<meta property="position" content="1">
</li>
<li property="itemListElement" typeof="ListItem">
<a property="item" typeof="WebPage" href="JAVAPROG.HTM"><span property="name">Web applications</span></a>
<meta property="position" content="2">
</li>
<li property="itemListElement" typeof="ListItem">
<span property="name">Ulam Spiral</span>
<meta property="position" content="3">
</li>
</ol>
<p>
Do you see any pattern in this graph? You will not believe at first glance that it is generated using prime numbers.
</p>
<p>
In order to generate it, the numbers are arranged in a spiral, as follows:
</p>
<pre>
13 —— 12 —— 11 —— 10 25
| | |
14 03 —— 02 09 24
| | | | |
15 04 01 08 23
| | | |
16 05 —— 06 —— 07 22
| |
17 —— 18 —— 19 —— 20 —— 21
</pre>
<p>Then the prime numbers are marked. Note the abundance of diagonals.</p>
<p>In the graphic above you can see the spiral made up to 10<sup>18</sup>. The prime numbers are marked in green.</p>
<p>Move the graph by dragging the spiral. If the spiral has the focus, you can also move the graph by using the keyboard arrows. You can obtain more detail or see a larger area by using the Zoom buttons.</p>
<p>You can also see the position (<var>x</var>, <var>y</var>) in the spiral and the number <var>n</var> of any point of the graph by moving the cursor to that point.</p>
<p>Below the spiral you can see the equations of the diagonal lines that intersect in the point marked by the cursor (see explanation below).</p>
<p>Move the center by typing a new number (up to 18 digits) in the upper input box and press the return key.</p>
<p>Change the starting number in the center of the spiral by typing a new number (up to 18 digits) in the lower input box and press the return key.</p>
<p>The formula that gives the numbers in the diagonal lines can be expressed using quadratic polynomials.
The quadratic polynomials are shown in the screen along with their factorization (if possible).
In this case the diagonal cannot contain primes, except in exceptional cases (when one factor is 1 and the other is prime).</p>
<p>When the quadratic polynomial cannot be factorized, then its diagonal will contain primes. A special property of quadratic polynomials is that about half of the primes cannot divide any of the values of the polynomial.
For instance, when we select the center of the spiral equal to 41 by entering this number in the right input box, we will find a diagonal with a lot of primes in the direction NW-SE.
This is because the values that take the polynomial 4t<sup>2</sup> + 2t + 41 cannot divide 3, 5, 7, 11, 13, 17, 19, 23, 29, 31 or 37 among other prime numbers.
Any number in the diagonal line less than 41<sup>2</sup> = 1681 must be prime, because it is not multiple of any prime less than its square root.</p>
<p>The numbers shown at the right of the polynomial are the primes less than 100 that cannot divide any value of the polynomial.
The diagonals whose numbers cannot be divided by small prime numbers have more prime numbers in them, because most composite numbers are multiples of small prime numbers.</p>
<p>Written by Dario Alpern. Last updated 10 November 2024.</p>
<h2>Source code</h2>
<p>You can download the source of the current program and the old Ulam spiral visualization applet from <a href="https://github.com/alpertron/calculators">GitHub</a>. Notice that the source code is in C language and you need the
<a href="https://emscripten.org/docs/getting_started/downloads.html">Emscripten</a> environment in order to generate JavaScript.</p>
</div>
</article></main>
<div id="cannotShow"><p>Cannot show spiral when center value is less than start value.</p></div>
<script type="text/wasmb64" id="wasmb64">
</script>
<script>
<!--
//-->
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebApplication",
"browserRequirements": "Requires HTML5. Requires Javascript.",
"name": "Ulam Spiral",
"description": "Web application that shows a graphical representation of prime numbers.",
"image": ["https://www.alpertron.com.ar/ulam.png"],
"datePublished": "2024-11-04",
"dateModified": "2024-11-04",
"operatingSystem": "Any",
"applicationCategory": "EducationalApplication",
"author": {
"@type": "Person",
"name": "Dario Alpern"
},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.1",
"ratingCount": "18"
},
"inLanguage": "en",
"license": "https://www.gnu.org/licenses/gpl-3.0.en.html",
"isAccessibleForFree": true,
"offers": {
"@type": "Offer",
"availability": "https://schema.org/OnlineOnly",
"price": "0",
"priceCurrency": "USD"
}
}
</script>
</body>
</html>