-
Notifications
You must be signed in to change notification settings - Fork 19
/
index.html
484 lines (476 loc) · 44.7 KB
/
index.html
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
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
<!DOCTYPE html>
<html>
<head>
<title>Callum's Sandbox</title>
<meta content="Callum's Sandbox - WebGL experiments, tests, code and sample applications." name="description">
<meta content="callum,chrome,collada,earth,example,experiments,globe,google,hurricane tracker,linden,opengl,planet,sample,shader,spline,three.js,webgl,terrain,street cloud" name="keywords">
<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css' />
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="wrapper">
<div class="container">
<h1>About</h1>
<h2>◀ British bloke, in the Los Angeles South Bay area via San Francisco, Singapore, Barcelona, Zurich, London, Brighton and Hong Kong ● <a target="_blank" href="http://secondlife.com">Second Life</a> developer during the day since 2004 ● Enthusiastic WebGL/VR/XR and Chromium/CEF hacker in the evenings ● Founder of Industrial Might and Logic Combat Robots ● Dipping a creaky old toe in the Concept II Rowing and CrossFit waters ● Eager traveler ● Insanely happy husband to Yumi and papa to Siena ● <a href="https://github.com/callumprentice" target="_blank">My GitHub</a> ● <a href="#updates">Recent updates</a> ● <a href="#contact">Contact me</a> ▶</h2>
<hr>
<div id="four-columns" class="grid-container" style="display:block;">
<h1>WebGL, WebVR and C++ apps, experiments and code</h1>
<ul class="rig columns-4">
<li>
<a href="apps/global_temperature_change_spiral/index.html" target="_blank">
<img class="img_border" src="thumbs/global_temperature_change_spiral.jpeg" />
</a>
<h3>Global Temperature Change Spiral</h3>
<p>
An updated version of an previous (2018) <a href="https://callumprentice.github.io/apps/climate_temperature_change/index.html" target="_blank">global temperature change experiment</a>. My 12 year old daughter and I created this much simpler, cleaner version. We had a blast working on it together - as well as some deep, thought provoking learning about the awful direction our climate is heading. Let us <a href="#contact">know</a> what you think.
</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/global_temperature_change_spiral" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/street_view_points/index.html" target="_blank">
<img class="img_border" src="thumbs/street_view_points.jpg" />
</a>
<h3>Street View Points</h3>
<p>
Another incarnation of the Street Cloud experiments (see below) that combines pixels from the Street View panoramas with 3D depth information and displays the result as a 3D point cloud. I had given up playing with this after constant, breaking changes to the relevant APIs. However, the supremely talented <a href="https://www.clicktorelease.com/" target="_blank">Spite</a> wrote some <a href="https://github.com/spite/PanomNom.js/" target="_blank">code</a> to grab pano textures and depth maps so this time, I am using that instead of rolling my own - maybe this will be more stable/resilient.
</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/street_view_points" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="https://equinaut.surge.sh" target="_blank">
<img class="img_border" src="thumbs/equinaut.gif" />
</a>
<h3>Equinaut</h3>
<p>
A web based equirectangular image viewer for desktop, mobile and VR HMD browsers - a tool that started life as something I made in my spare time to help me with my day job. I am hoping I can find time to evolve it into an authoring system for viewing and navigating between collections of 360 panorama images. Click the <a href="https://equinaut.surge.sh" target="_blank">animated image</a> to visit the published version of the site, <a href="https://equinaut.surge.sh/menu.html" target="_blank">here</a> for a simple menu of sample images or on the <a href="https://github.com/callumprentice/equinaut" target="_blank">GitHub</a> icon below for the source code.
</p>
<a href="https://github.com/callumprentice/equinaut" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/iss_photo_explorer_flat/index.html" target="_blank">
<img class="img_border" src="thumbs/iss_photo_explorer_flat.jpeg" />
</a>
<h3>ISS Photo Explorer (Flat)</h3>
<p>
A very simple application my daughter and I wrote that lets you explore the approximately 3.5 million photographs from the International Space Station. It was a huge amount of fun for us both and I hope we can expland on it later. See the <a href="https://callumprentice.github.io/apps/iss_photo_explorer_flat/about.html" target="_new">Help/About</a> page for details and links to other versions. Update: Added link to NASA page for each photo (wolfgang42). Added lat/lng input (oferze). Added contributor list. Thank you!
</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/iss_photo_explorer_flat" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/street_cloud_simple/index.html" target="_blank">
<img class="img_border" src="thumbs/street_cloud_simple.jpeg" />
</a>
<h3>Street Cloud Simple</h3>
<p>
This experiment is an update to earlier ones (Street Cloud Interactive and Street Cloud Flow) after they stopped working because of extensive changes to the Google Maps Street View API. It renders Google Street View ® panos as point clouds using the 3D LiDAR data captured along with the regular panorama images. I pulled fragments of code from various old experiments and combined them into what I hope is an easy to understand, single source file.
</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/street_cloud_simple" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/climate_temperature_change/index.html" target="_blank">
<img class="img_border" src="thumbs/climate_temperature_change.gif" />
</a>
<h3>Climate Temperature Change</h3>
<p>
This is an experiment that investigates ways of visualizing the average worldwide monthly temperature anomalies from 1850 to 2017 via data from the <a href="https://www.metoffice.gov.uk/" target="_new">UK Met Office</a>. You may have seen the renowned <a href="https://www.climate-lab-book.ac.uk/spirals/" target="_new">Climate Spiral</a> images created by UK scientist <a href="https://www.climate-lab-book.ac.uk/about/" target="_new">Ed Hawkings</a> - this is a modest attempt to explore other ways of visualizing that same sobering data using modern web technologies such as WebGL.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/climate_temperature_change" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/voronoi_airports/index.html" target="_blank">
<img class="img_border" src="thumbs/voronoi_airports.jpeg" />
</a>
<h3>Voronoi Airports WebGL</h3>
<p>I got inspired (again) by a <a href="https://www.jasondavies.com/maps/voronoi/airports/" target="_new">neat visualization</a> that mapped ~14,000 of the world's airports onto a <a href="https://en.wikipedia.org/wiki/Voronoi_diagram" target="_new">Voronoi Diagram</a>. I wanted to try something similar with all (~54,000) of them in WebGL and put this experiment together quickly. Still very much a work in progress and after a <A href="https://news.ycombinator.com/item?id=17345935" target="_new">post on Hacker News</a>, I've got lots of great suggestions too.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/voronoi_airports" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/soul_of_the_world/index.html" target="_blank">
<img class="img_border" src="thumbs/soul_of_the_world.jpeg" />
</a>
<h3>Soul of the World</h3>
<p>Some interesting <a href="https://news.ycombinator.com/item?id=16966291" target="_new">comments</a> in this <a href="https://news.ycombinator.com/item?id=16965650" target="_new">article</a> that pointed to this <a href="http://www.souloftheworld.com/work.html" target="_new">page</a> led me to wonder if there really was a cube that fits inside the earth whose 8 vertices touch land. Looks like it's true!</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/soul_of_the_world" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/storm_tracks_webgl_too/index.html" target="_blank">
<img class="img_border" src="thumbs/storm_tracks_webgl_too.jpeg" />
</a>
<h3>Storm Tracks WebGL Too</h3>
<p>A re-updated version of a <a target="_new" href="http://callumprentice.github.io/apps/storm_tracks_webgl/index.html">previous experiment</a> I made years ago to plot the tracks of storms. It now uses much more efficient technology to render everything and currently displays all 9,300+ storms and around 250,000 track points for storms from 1851 up to the present day. <br><i>2017-09-05: Updated with latest storms and now you can pass filter parameters in the URL. One use for this is to display <a href="http://callumprentice.github.io/apps/storm_tracks_webgl_too/index.html?windspeed=0&startyear=1851&startdistance=1.4&latlng=1.392100,122.298629" target="_blank">everything</a> or specific storms.. E.G. <a href="http://callumprentice.github.io/apps/storm_tracks_webgl_too/index.html?windspeed=140&stormname=katrina&startyear=2005&startdistance=0.8" target="_blank">Hurricane Katrina</a>, <a href="http://callumprentice.github.io/apps/storm_tracks_webgl_too/index.html?windspeed=140&stormname=irma&startyear=2017&startdistance=0.95" target="_blank">Hurricane Irma</a> and <a href="http://callumprentice.github.io/apps/storm_tracks_webgl_too/index.html?windspeed=140&stormname=tip&startyear=1979&startdistance=1" target="_blank">Typhoon Tip</a></i></p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/storm_tracks_webgl_too" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/celestial_bodies/index.html?v=2&1=trappist-1&2=trappist-1b&3=trappist-1c&4=trappist-1d&5=trappist-1e&6=trappist-1f&7=trappist-1g&8=trappist-1h&9=earth" target="_blank">
<img class="img_border" src="thumbs/celestial_bodies.jpeg" />
</a>
<h3>Celestial Bodies (Updated again!)</h3>
<p>This WebGL experiment allows you to interactively compare the sizes of our sun, the planets and moons as well as (from February 2017) the sun and planets in the <a href="http://www.trappist.one/" target="_new">Trappist One</a> system (albeit with a good measure of artistic license for the appearance). This new version now lets you compare multiple bodies with each other.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/celestial_bodies" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/stack_overflowing/index.html" target="_blank">
<img class="img_border" src="thumbs/stack_overflowing.jpeg" />
</a>
<h3>Stack Overflowing</h3>
<p>An interesting <a href="http://stackoverflow.blog/2017/01/Developers-without-Borders-The-Global-Stack-Overflow-Network/"target="_blank">blog post</a> from David Robinson (a data scientist at Stack Overflow) inspired me to revisit an old experiment I made called <a href="http://callumprentice.github.io/apps/flight_stream/index.html" target="_blank">Flight Stream</a>. I wanted to make it more generally useful for illustrating flow between sets of points on the earth and also make it support lots more points. David was kind enough to share the source data from his post with me and I used it to make the changes. As per the blog post, this visualization represents a days worth of global information exchange on Stack Overflow (data is anonymized).<br>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/stack_overflowing" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a></p>
</li>
<li>
<a href="apps/360_snapshot_viewer/index.html" target="_blank">
<img class="img_border" src="thumbs/360_snapshot_viewer.gif" />
</a>
<h3>360 Snapshot Viewer</h3>
<p>An early iteration of something I have been working on for the Second Life viewer - support for exporting a 360 snapshot of any region and viewing it on the web. This version also supports exporting an equirectangular image with the right meta-data headers so it can be uploaded to sites like Facebook or Flickr and viewed correctly. More examples from the ever amazing <a href="https://www.flickr.com/photos/torley/" target="_blank">Torley Linden</a> can be found <a href="apps/360_snapshot_viewer/index.html?shot=shots/baybridge.zip" target="_blank">here</a> and <a href="apps/360_snapshot_viewer/index.html?shot=shots/hr.zip" target="_blank">here</a>.<br>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/360_snapshot_viewer" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a></p>
</li>
<li>
<a href="https://bitbucket.org/lindenlab/dullahan/" target="_blank">
<img class="img_border" src="thumbs/dullahan.gif" />
</a>
<h3>Dullahan</h3>
<p>A headless browser SDK that is designed to make it easier to write applications that render modern web content (including WebGL) directly to a memory buffer, inject synthesized mouse and keyboard events and interact with web based features like JavaScript or cookies. Source code, pre-built Win32 binaries and some simple tests included.<br>
<a href="https://bitbucket.org/lindenlab/dullahan/" target="_blank"><img class="bbsrcicon" src="img/bitbucketsrc.png"></a></p>
</li>
<li>
<a href="apps/global_temperature_change_webgl/index.html" target="_blank">
<img class="img_border" src="thumbs/global_temperature_change_webgl.jpeg" />
</a>
<h3>Global Temperature Change WebGL</h3>
<p>An experiment that tries to illustrate how global temperatures on earth have changed between 1850 and 2016. Data via <a href="http://www.metoffice.gov.uk/climate-guide/science/science-behind-climate-change/hadley" target="_new">UK Met Office Hadley Centre for Climate Change</a>. Inspired by the great <a href="http://www.climate-lab-book.ac.uk/2016/mapping-global-temperature-change" target="_new">work</a> of <a href="http://www.met.reading.ac.uk/~ed/home/index.php" target="_new">Ed Hawkings</a>, a climate scientist in the <a href="https://www.ncas.ac.uk/index.php/en/" target="_new">National Centre for Atmospheric Science (NCAS)</a> at the University of Reading.
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/global_temperature_change_webgl" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a></p>
</li>
<li>
<a href="apps/pano_getter/index.html" target="_blank">
<img class="img_border" src="thumbs/pano_getter.jpeg" />
</a>
<h3>Pano Getter</h3>
<p>After playing with <a href="apps/street_cloud/index.html" target="_blank">Street Cloud</a>, French film maker <a href="https://williamlaboury.myportfolio.com/" target="_blank">William Laboury</a> contacted me and asked if I could help with an app to extract the depth panos from Google Street View for a video he was working on. I was happy to help and leaning on some earlier work along with some code from others (see credits), I put together <a href="apps/pano_getter/index.html" target="_blank">Pano Getter</a>. Let me <a href="#contact">know</a> what you think.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/pano_getter" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<img class="img_border" src="thumbs/vr_browser_test.jpeg" />
<h3>VR Web and Media Browser</h3>
<p>I've been quiet for a while because I've been working on a C++ based VR web and media browser experiment in my spare time. It renders any web content using the latest version of Chrome (v51) via <a href="https://bitbucket.org/chromiumembedded/cef" target="_blank">CEF</a> and any video using the latest version of <a href="https://wiki.videolan.org/LibVLC/" target="_blank">VLC</a>. Shaping up nicely but I don't have an Oculus CV1 headset so if anyone out there has a spare one or wants to help fund the project, please <a href="#contact">get in touch</a> :) Nothing to show publicly yet but details soon.
</li>
<li>
<a href="apps/geometree/index.html" target="_blank">
<img class="img_border" src="thumbs/geometree.jpeg" />
</a>
<h3>GeomeTree</h3>
<p>Something I entered for the Christmas Experiment 2015 site but evidently, it wasn't high enough quality. I still like it though - Happy Holidays to everyone.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/geometree" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/buffer_geometry_selective_draw/index.html" target="_blank">
<img class="img_border" src="thumbs/buffer_geometry_selective_draw.jpeg" />
</a>
<h3>Buffer Geometry Selective Draw</h3>
<p>Three.js <a href="http://threejs.org/docs/#Reference/Core/BufferGeometry" target="_new">BufferGeometry</a> is very fast but only one draw call so it's not possible to hide or show parts of it easily. This example illustrates a way to do that by setting an attribute on each vertex and culling them out as necessary in a shader. Feedback appreciated</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/buffer_geometry_selective_draw" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/planet_compare/index.html" target="_blank">
<img class="img_border" src="thumbs/planet_compare.jpeg" />
</a>
<h3>Planet Compare</h3>
<p>Experiment to compare the relative sizes of planets in our solar system, including of course the new darling, Pluto. <i>Updated to support the Sun and the Moon.</i></p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/planet_compare" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/geometry_to_buffergeometry/index.html" target="_blank">
<img class="img_border" src="thumbs/geometry_to_buffergeometry.jpeg" />
</a>
<h3>Geometry to BufferGeometry</h3>
<p>The <a target="_new"
href="http://threejs.org/docs/#Reference/Core/Geometry">THREE.Geometry</a> classes are easy to use but slow and the <a target="_new"
href="http://threejs.org/docs/#Reference/Core/BufferGeometry">THREE.BufferGeometry</a> class is fast but hard to use. This experiment tries to get the best of both worlds by creating geometry the easy way and transforming it into the fast way. Works well on mobile too. <i>Updated to support multiple geometry types</i></p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/geometry_to_buffergeometry" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/iss_photo_explorer/index.html" target="_blank">
<img class="img_border" src="thumbs/iss_photo_explorer.jpeg" />
</a>
<h3>ISS Photo Explorer</h3>
<p>My entry for the <a target="_new"
href="http://2015.spaceappschallenge.org">2015 NASA Space Apps Challenge</a>. Provides a way to view and explore the almost 1.8 million photos taken from the International Space Station over 15 years and 44 missions. <i>Updated to include all of Mission 43's 173,544 photos and the 9,388 current ones from Mission 44</i></p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/iss_photo_explorer" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/flight_stream/index.html" target="_blank">
<img class="img_border" src="thumbs/flight_stream.jpeg" />
</a>
<h3>Flight Stream</h3>
<p>Experiment to visualize all of the worlds flights. Not displayed in real time or on a correct schedule although that might be nice for version 2.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/flight_stream" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/country_selector/index.html" target="_blank">
<img class="img_border" src="thumbs/country_selector.jpeg" />
</a>
<h3>Country Selector</h3>
<p>Second attempt at extruded earth visualization I'm working on for a bigger project.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/country_selector" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/amui/index.html" target="_blank">
<img class="img_border" src="thumbs/amui.jpeg" />
</a>
<h3>amui - Add Manipulator UI</h3>
<p>Experiment to let you add manipulator UI (via dat.GUI) to modify objects in a three.js scene on any page via a bookmarklet.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/amui" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/street_cloud_flow/index.html" target="_blank">
<img class="img_border" src="thumbs/street_cloud_flow.jpeg" />
</a>
<h3>Street Cloud Flow</h3>
<p>The next iteration of <a href="http://callum.com/apps/street_cloud/index.html" target="_blank">Street Cloud</a>. This version generates multiple views based on a starting location. Lots left to do but makes quite beautiful images. See Help dialog for more details.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/street_cloud_flow" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/double_pendulum/index.html" target="_blank">
<img class="img_border" src="thumbs/double_pendulum.jpeg" />
</a>
<h3>Double Pendulum</h3>
<p>Inspired by <a href="http://www.physicsandbox.com/projects/double-pendulum.html" target="_blank">fascinating illustration</a> of double pendulum physics in ~100 lines of JavaScript, I made a WebGL version using one of the three.js <a href="http://threejs.org/examples/webgl_materials_cubemap_balls_reflection.html" target="_blank">examples</a> as a starting point.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/double_pendulum" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/threejs_app_template_interactive/index.html" target="_blank">
<img class="img_border" src="thumbs/threejs_app_template_interactive.jpeg" />
</a>
<h3>Three.js Interactive App Template Generator</h3>
<p>Generate a template three.js application using interactive controls and use it as the starting point for your next masterpiece. Select options, features and code then save it off as a zip file. <i>Updated (2014-06-27)</i>: Now you can send it to a JS Fiddle and include helper geometry objects.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/threejs_app_template_interactive" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/street_cloud/index.html" target="_blank">
<img class="img_border" src="thumbs/street_cloud.jpeg" />
</a>
<h3>Street Cloud Interactive</h3>
<p>An experiment to render Google Street View ® scenes as 3D point clouds using the LiDAR data captured along with the regular panorama images. A rudimentary navigation system allows you to move between connected locations. <i>Updated (2014-07-09) Change in internals of StreetView API broke it for a while :(</i>:</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/street_cloud" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/webgl_terrain/index.html" target="_blank">
<img class="img_border" src="thumbs/webgl_terrain.jpeg" />
</a>
<h3>WebGL Terrain</h3>
<p>Noticed a really <a href="http://www.playfuljs.com/realistic-terrain-in-130-lines/" target="_blank">neat page</a> that describes how to make a terrain generator in 130 lines of JavaScript. Thought it would be interesting to make an interactive WebGL version.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/webgl_terrain" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/storm_tracks_webgl/index.html" target="_blank">
<img class="img_border" src="thumbs/storm_tracks_webgl.jpeg" />
</a>
<h3>Storm Tracks WebGL</h3>
<p>Interactive map of hurricanes, typhoons, cyclones and tropical storm tracks from 1848 to 2013 including Super Typhoon Haiyan/Yolanda.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/storm_tracks_webgl" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="https://github.com/callumprentice/ThreeJsAppTemplate" target="_blank">
<img class="img_border" src="thumbs/threejs_app_template.jpeg" />
</a>
<h3>Three.JS App Template</h3>
<p>Simple Python script to generate a template Three.js app that you can use as a starting point for your next masterpiece.</p>
<a href="https://github.com/callumprentice/ThreeJsAppTemplate" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/extruded_earth/index.html" target="_blank">
<img class="img_border" src="thumbs/extruded_earth.jpeg" />
</a>
<h3>Extruded Earth</h3>
<p>Experimenting with data visualization by extruding world countries based on a metric.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/extruded_earth" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/connected_planet/index.html" target="_blank">
<img class="img_border" src="thumbs/connected_planet.jpeg" />
</a>
<h3>Connected Planet</h3>
<p>Lat/long connected spline based arcs over planet Earth with logo, tweening and UI.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/connected_planet" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/pixijs_test/index.html" target="_blank">
<img class="img_border" src="thumbs/pixijs_test.jpeg" />
</a>
<h3>Pixi.js Test</h3>
<p>Experimenting by mixing up bits of <a href="http://www.pixijs.com" target="_blank">Pixi.js</a> demos. Click to jump.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/pixijs_test" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/globe_manipulator/index.html" target="_blank">
<img class="img_border" src="thumbs/globe_manipulator.jpeg" />
</a>
<h3>Globe Manipulator</h3>
<p>Manipulate a globe and go to or pick, lat/long coordinates.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/globe_manipulator" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/fur_ball/index.html" target="_blank">
<img class="img_border" src="thumbs/fur_ball.jpeg" />
</a>
<h3>Fur Ball</h3>
<p>Testing buffer geometry with 100,000 lines - next, make it move with a shader.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/fur_ball" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/sphere_ray_intersection/index.html" target="_blank">
<img class="img_border" src="thumbs/sphere_ray_intersection.jpeg" />
</a>
<h3>Sphere/Ray Intersection</h3>
<p>Testing sphere and ray intersection code.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/sphere_ray_intersection" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/model_pick/index.html" target="_blank">
<img class="img_border" src="thumbs/model_pick.jpeg" />
</a>
<h3>Pick Point From Model</h3>
<p>More complex intersection test against a 3D model</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/model_pick" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/shader_spline/index.html" target="_blank">
<img class="img_border" src="thumbs/shader_spline.jpeg" />
</a>
<h3>Shader Spline</h3>
<p>Animated shader on spline.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/shader_spline" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/spline_planet/index.html" target="_blank">
<img class="img_border" src="thumbs/spline_planet.jpeg" />
</a>
<h3>Spline Planet</h3>
<p>Red planet with extruded circle splines plus animated shader and collinear icons.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/spline_planet" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/delaunay/index.html" target="_blank">
<img class="img_border" src="thumbs/delaunay.jpeg" />
</a>
<h3>Delaunay Triangulation</h3>
<p>I wanted to subdivide country outlines into triangles and thought Delaunay triangulation was the right answer but it's not.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/delaunay" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/concept_widget/index.html" target="_blank">
<img class="img_border" src="thumbs/concept_widget.jpeg" />
</a>
<h3>Concept Widget</h3>
<p>Experimental canvas based UI widget with lovely people at <a href="http://www.conceptarts.com/" target="_blank">Concept Arts</a>.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/concept_widget" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/squares_on_sphere/index.html" target="_blank">
<img class="img_border" src="thumbs/squares_on_sphere.jpeg" />
</a>
<h3>Squares On A Sphere</h3>
<p>Testing how to render collinear squares on a sphere.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/squares_on_sphere" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/ctm_loader/index.html" target="_blank">
<img class="img_border" src="thumbs/ctm_loader.jpeg" />
</a>
<h3>CTM Loader Test</h3>
<p>Test loading model from CTM file and apply environment map.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/ctm_loader" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
<li>
<a href="apps/collada_duck/index.html" target="_blank">
<img class="img_border" src="thumbs/collada_duck.jpeg" />
</a>
<h3>Collada Duck</h3>
<p>Load a model of a duck from a Collada file.</p>
<a href="https://github.com/callumprentice/callumprentice.github.io/tree/master/apps/collada_duck" target="_blank"><img class="srcicon" src="img/githubsrc.png"></a>
</li>
</ul>
<hr>
<a id="updates"></a>
<hr>
<h1>Recent updates</h1>
<h2>
<ul>
<p>● 2023-10-07: New (updated) experiment - <a href="apps/global_temperature_change_spiral/" target="_blank">Global Temperature Change Spiral</a></p>
<p>● 2022-09-11: New (updated) experiment - <a href="apps/street_view_points/" target="_blank">Street View Points</a></p>
<p>● 2020-09-12: New app - <a href="https://equinaut.surge.sh" target="_blank">Equinaut - A web based equirectangular image viewer for desktop, mobile and VR HMD browsers</a></p>
<p>● 2020-06-13: New app - <a href="apps/ISS Photo Explorer (Flat)/index.html" target="_blank">ISS Photo Explorer (Flat)</a></p>
<p>● 2020-06-01: New app - <a href="apps/street_cloud_simple/index.html" target="_blank">Street Cloud Simple</a></p>
<p>● 2018-09-15: New app - <a href="apps/climate_temperature_change/index.html" target="_blank">Climate Temperature Change</a></p>
<p>● 2018-06-24: New app - <a href="apps/voronoi_airports/index.html" target="_blank">Voronoi Airports WebGL</a></p>
<p>● 2018-04-30: New app - <a href="apps/soul_of_the_world/index.html" target="_blank">Soul of the World</a></p>
<p>● 2018-03-18: Handed ubrowser.com off <a href="http://ubrowser.com" target="_blank"> to a friend who promises to do more with it than I did and removed a bunch of pointless links from front page
<p>● 2017-08-28: Updated <a href="apps/storm_tracks_webgl_too/index.html" target="_blank">Storm Tracks WebGL Too</a> to include Hurricane Harvey in the Atlantic
<p>● 2017-02-23: Updated Celestial Bodies - now allows for multiple bodies - <a href="apps/celestial_bodies/index.html" target="_blank">Celestial Bodies</a></p>
<p>● 2017-02-21: Updated Celestial Bodies to include Trappist One system - <a href="apps/celestial_bodies/index.html" target="_blank">Celestial Bodies</a></p>
<p>● 2017-01-30: Added new experiment - <a href="apps/stack_overflowing/index.html" target="_blank">Stack Overflowing</a></p>
<p>● 2016-12-06: Added new experiment - <a href="apps/360_snapshot_viewer/index.html" target="_blank">360 Snapshot Viewer</a></p>
<p>● 2016-11-26: Added C++ off screen browser rendering library <a href="https://bitbucket.org/lindenlab/dullahan/" target="_blank">Dullahan</a></p>
<p>● 2016-09-10: Added new experiment - <a href="apps/global_temperature_change_webgl/index.html" target="_blank">Global Temperature Change WebGL</a></p>
<p>● 2016-07-14: Added new experiment - Pano Getter</p>
<p>● 2016-07-12: Added cryptic details of experimental VR browser</p>
<p>● 2015-12-11: Added new experiment - GeomeTree</p>
<p>● 2015-10-22: Added new experiment - Celestial Bodies</p>
<p>● 2015-10-22: Updated Storm Tracks WebGL Too to include Hurricane Patricia.</p>
<p>● 2015-10-11: Added new experiment - Storm Tracks WebGL Too</p>
<p>● 2015-10-10: Added new example - Buffer Geometry Selective Draw</p>
<p>● 2015-07-25: Added new experiment - Planet Compare</p>
<p>● 2015-07-11: Updates ISS Photo Explorer with Missions 43 & 44</p>
<p>● 2015-05-17: Added Geometry to BufferGeometry experiment</p>
<p>● 2015-04-12: Added ISS Photo Explorer</p>
<p>● 2015-03-14: Added Country Selector</p>
<p>● 2015-02-16: Added Flight Stream app</p>
<p>● 2015-01-28: Updated ISS Photo Viewer app to more generic mouse wheel code</p>
<p>● 2015-01-10: Moved to GitHub and added links to source</p>
<p>● 2014-11-20: Added ISS Photo Viewer app</p>
</ul>
</h2>
<hr>
<a id="contact"></a>
<h1>Contact</h1>
<ul class="rig columns-8">
<li>
<a href="mailto:[email protected]?subject=hello!" target="_blank">
<img src="img/gmail.png" />
</a>
<h4>Email</h4>
</li>
<li>
<a href="mailto:[email protected]?subject=hello!" target="_blank">
<img src="img/lindenlab.png" />
</a>
<h4>Work</h4>
</li>
<li>
<a href="https://my.secondlife.com/callum.linden" target="_blank">
<img src="img/secondlife.png" />
</a>
<h4>Second Life</h4>
</li>
<li>
<a href="http://www.linkedin.com/in/callumprentice" target="_blank">
<img src="img/linkedin.png" />
</a>
<h4>LinkedIn</h4>
</li>
<li>
<a href="https://github.com/callumprentice" target="_blank">
<img src="img/github.png" />
</a>
<h4>GitHub</h4>
</li>
<li>
<a href="https://twitter.com/@callumprentice" target="_blank">
<img src="img/twitter.png" />
</a>
<h4>Twitter</h4>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>