<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:georss='http://www.georss.org/georss' xmlns:gd='http://schemas.google.com/g/2005' xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-29414335</id><updated>2012-01-31T06:18:45.653-08:00</updated><category term='42'/><category term='perlin noise'/><category term='image'/><category term='procedural'/><category term='cosmos'/><category term='universe'/><category term='mysql'/><category term='seamless'/><category term='php'/><category term='tiles'/><category term='hex map'/><category term='hex'/><title type='text'>The Random Universe</title><subtitle type='html'>Methods and methodologies for constructing fictional worlds.</subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default?max-results=100'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>5</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>100</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-29414335.post-5320385538235160279</id><published>2011-08-09T21:35:00.000-07:00</published><updated>2011-08-10T19:13:18.346-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='tiles'/><category scheme='http://www.blogger.com/atom/ns#' term='hex map'/><category scheme='http://www.blogger.com/atom/ns#' term='seamless'/><category scheme='http://www.blogger.com/atom/ns#' term='hex'/><title type='text'>Making Seamless Hex Tiles</title><content type='html'>&lt;a href="http://4.bp.blogspot.com/-B8_8bqb9iUI/TkIWY_wAsvI/AAAAAAAAAk0/wxvQ-CuqKiQ/s1600/HexMapFinishedWithGuides.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 221px;" src="http://4.bp.blogspot.com/-B8_8bqb9iUI/TkIWY_wAsvI/AAAAAAAAAk0/wxvQ-CuqKiQ/s320/HexMapFinishedWithGuides.png" alt="" id="BLOGGER_PHOTO_ID_5639094302106759922" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;I know I haven't posted on this blog in ages, but recently I came across a world-building problem for which I could not find a suitable answer on the Internet: &lt;span style="font-weight: bold;"&gt;How to make seamless hex map tiles.&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;Where it seems like a very difficult task (matching up 3 pairs of borders) it actually has a very simple and elegant solution.&lt;br /&gt;&lt;br /&gt;First, most major image manipulation programs have a "make seamless" feature that tiles and blurs over an image to make it seamless on four sides.&lt;br /&gt;&lt;br /&gt;For example: The GIMP's function can take any rectangular image and make it tileable by using the &lt;a style="font-weight: bold;" href="http://docs.gimp.org/en/plug-in-make-seamless.html"&gt;"Make Seamless" command&lt;/a&gt;. Unfortunately, it doesn't directly work with other shapes (like our hex) or some arbitrary outline.&lt;br /&gt;&lt;br /&gt;However, this filter will work perfectly to give us exactly what we want, as we can "simplify" a hex map into a rectangular map which it *can* make seamless for us.&lt;br /&gt;&lt;br /&gt;Imagine a map of tiled hexes and take a close look at the pattern:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://2.bp.blogspot.com/-piUIBP_CGeY/TkIM-DeFGDI/AAAAAAAAAkE/35FZYiUlaCM/s1600/TiledHexes.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 290px;" src="http://2.bp.blogspot.com/-piUIBP_CGeY/TkIM-DeFGDI/AAAAAAAAAkE/35FZYiUlaCM/s320/TiledHexes.png" alt="" id="BLOGGER_PHOTO_ID_5639083943644174386" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;It's regular. It repeats.&lt;br /&gt;&lt;br /&gt;Since the GIMP can tile rectangles, can we express this sort of repetition as a set of rectangles?&lt;br /&gt;&lt;br /&gt;You bet we can:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://2.bp.blogspot.com/-owUiAWfoPwE/TkINwZbsu3I/AAAAAAAAAkM/dfYzZMLRt9o/s1600/TiledHexesRectangled.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 290px;" src="http://2.bp.blogspot.com/-owUiAWfoPwE/TkINwZbsu3I/AAAAAAAAAkM/dfYzZMLRt9o/s320/TiledHexesRectangled.png" alt="" id="BLOGGER_PHOTO_ID_5639084808533228402" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;So now we're dealing with the following rectangular unit to tile:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://2.bp.blogspot.com/-rMvURh6jUmY/TkIOWmw7D1I/AAAAAAAAAkU/85GLYVEw97s/s1600/TiledHexesRectangleUnit.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 215px; height: 320px;" src="http://2.bp.blogspot.com/-rMvURh6jUmY/TkIOWmw7D1I/AAAAAAAAAkU/85GLYVEw97s/s320/TiledHexesRectangleUnit.png" alt="" id="BLOGGER_PHOTO_ID_5639085464946937682" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;Assuming your hex occupies a square image, the rectangle is 1 unit long by 1.5 units tall.&lt;br /&gt;&lt;br /&gt;So all we need to do is go into the GIMP and make a rectangle that fits those dimensions and make it seamless. In my case, since my hex tiles were 256x256 pixels, this made the rectangle 256x384 pixels:&lt;br /&gt;&lt;br /&gt;&lt;div style="text-align: center;"&gt;&lt;a href="http://2.bp.blogspot.com/-tjIzY-Bu8LE/TkIPd48Sm1I/AAAAAAAAAkc/NwmDK38gsYo/s1600/TiledHexesRawTexture.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 320px;" src="http://2.bp.blogspot.com/-tjIzY-Bu8LE/TkIPd48Sm1I/AAAAAAAAAkc/NwmDK38gsYo/s320/TiledHexesRawTexture.png" alt="" id="BLOGGER_PHOTO_ID_5639086689597168466" border="0" /&gt;&lt;/a&gt;&lt;span style="font-size:78%;"&gt;(Here's the seamless texture. A small plot of grass hit with the Filters-&amp;gt;Map-&amp;gt;Make Seamless command.)&lt;/span&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;Next, you'll need to plop the texture down onto a hex outline so that it is flush with both vertical sides. Even though the texture is a full half taller than your hex, it doesn't matter. Provided that the edges are flush and the entire hex is full of the texture, all you need to do is clip it to the hex's outline.&lt;br /&gt;&lt;br /&gt;I've done this in Inkscape, where I've made my hex outline using the Polygon tool, and then used the Clip-&amp;gt;Set command to trim the duplicated textures to the hex.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://4.bp.blogspot.com/-qyr5jDgj-wY/TkIRmJ03LII/AAAAAAAAAks/XSqZKHTLgKE/s1600/HexMapDoubleTexturesClipped.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 124px;" src="http://4.bp.blogspot.com/-qyr5jDgj-wY/TkIRmJ03LII/AAAAAAAAAks/XSqZKHTLgKE/s320/HexMapDoubleTexturesClipped.png" alt="" id="BLOGGER_PHOTO_ID_5639089030591622274" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;Voilà! You now have a seamless, tileable hex!&lt;br /&gt;&lt;br /&gt;&lt;a href="http://4.bp.blogspot.com/-B8_8bqb9iUI/TkIWY_wAsvI/AAAAAAAAAk0/wxvQ-CuqKiQ/s1600/HexMapFinishedWithGuides.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 221px;" src="http://4.bp.blogspot.com/-B8_8bqb9iUI/TkIWY_wAsvI/AAAAAAAAAk0/wxvQ-CuqKiQ/s320/HexMapFinishedWithGuides.png" alt="" id="BLOGGER_PHOTO_ID_5639094302106759922" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;div style="text-align: center;"&gt;&lt;a href="http://3.bp.blogspot.com/-2YnyAV4s3B4/TkIWfOQ-snI/AAAAAAAAAk8/T7o79GfGNVQ/s1600/HexMapFinished.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 214px;" src="http://3.bp.blogspot.com/-2YnyAV4s3B4/TkIWfOQ-snI/AAAAAAAAAk8/T7o79GfGNVQ/s320/HexMapFinished.png" alt="" id="BLOGGER_PHOTO_ID_5639094409082352242" border="0" /&gt;&lt;/a&gt;&lt;/div&gt;&lt;br /&gt;Peace,&lt;br /&gt;-Steve&lt;br /&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/29414335-5320385538235160279?l=therandomuniverse.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/5320385538235160279/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=29414335&amp;postID=5320385538235160279' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/5320385538235160279'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/5320385538235160279'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/2011/08/making-seamless-hex-tiles.html' title='Making Seamless Hex Tiles'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/-B8_8bqb9iUI/TkIWY_wAsvI/AAAAAAAAAk0/wxvQ-CuqKiQ/s72-c/HexMapFinishedWithGuides.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-29414335.post-6506060992772580244</id><published>2007-01-05T19:23:00.000-08:00</published><updated>2008-12-11T06:47:38.868-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='cosmos'/><category scheme='http://www.blogger.com/atom/ns#' term='image'/><category scheme='http://www.blogger.com/atom/ns#' term='universe'/><category scheme='http://www.blogger.com/atom/ns#' term='42'/><category scheme='http://www.blogger.com/atom/ns#' term='php'/><category scheme='http://www.blogger.com/atom/ns#' term='perlin noise'/><title type='text'>Simulating the Large-Scale Structure of the Cosmos</title><content type='html'>In my previous article, we discussed Perlin Noise and how it can generate textures that seem very natural. In this article, we're going to see how we can use Perlin Noise to generate a convincing image of the &lt;a href="http://en.wikipedia.org/wiki/Large_scale_structure_of_the_cosmos"&gt;large-scale structure of the cosmos&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;What is this large scale structure? Wikipedia states:&lt;br /&gt;&lt;blockquote&gt;"In &lt;a href="http://en.wikipedia.org/wiki/Physical_cosmology" title=""&gt;physical cosmology&lt;/a&gt;, the term &lt;b&gt;large-scale structure&lt;/b&gt; refers to the characterization of &lt;a href="http://en.wikipedia.org/wiki/Observation" title=""&gt;observable&lt;/a&gt; &lt;a href="http://en.wikipedia.org/wiki/Distribution" title=""&gt;distributions&lt;/a&gt; of &lt;a href="http://en.wikipedia.org/wiki/Matter" title=""&gt;matter&lt;/a&gt; and &lt;a href="http://en.wikipedia.org/wiki/Light" title=""&gt;light&lt;/a&gt; on the largest scales (typically on the order of &lt;a href="http://en.wikipedia.org/wiki/1000000000_%28number%29" title=""&gt;billions&lt;/a&gt; of &lt;a href="http://en.wikipedia.org/wiki/Light-year" title=""&gt;light-years&lt;/a&gt;). &lt;a href="http://en.wikipedia.org/wiki/Redshift_survey" title=""&gt;Sky surveys&lt;/a&gt; and &lt;a href="http://en.wikipedia.org/wiki/Mapping" title=""&gt;mappings&lt;/a&gt; of the various &lt;a href="http://en.wikipedia.org/wiki/Wavelength" title=""&gt;wavelength&lt;/a&gt; bands of &lt;a href="http://en.wikipedia.org/wiki/Electromagnetic_radiation" title=""&gt;electromagnetic radiation&lt;/a&gt; (in particular &lt;a href="http://en.wikipedia.org/wiki/Hydrogen_line" title=""&gt;21-cm emission&lt;/a&gt;) have yielded much information on the content and character of the &lt;a href="http://en.wikipedia.org/wiki/Universe" title=""&gt;universe&lt;/a&gt;'s structure. The organization of structure appears to follow as a &lt;a href="http://en.wikipedia.org/wiki/Hierarchy" title=""&gt;hierarchical&lt;/a&gt; model with organization up to the &lt;a href="http://en.wikipedia.org/wiki/Scale_%28spatial%29" title=""&gt;scale&lt;/a&gt; of &lt;a href="http://en.wikipedia.org/wiki/Supercluster" title=""&gt;superclusters&lt;/a&gt; and &lt;a href="http://en.wikipedia.org/wiki/Galaxy_filament" title=""&gt;filaments&lt;/a&gt;. Larger than this, there seems to be no continued structure, a phenomenon which has been referred to as the &lt;a href="http://en.wikipedia.org/wiki/End_of_Greatness" title=""&gt;End of Greatness&lt;/a&gt;." &lt;span style="font-weight: bold;"&gt;- &lt;/span&gt;&lt;a style="font-weight: bold;" href="http://en.wikipedia.org/wiki/Large-scale_structure_of_the_cosmos"&gt;http://en.wikipedia.org/wiki/Large-scale_structure_of_the_cosmos&lt;/a&gt;&lt;span style="font-weight: bold;"&gt; - Jan 5th 2007&lt;/span&gt;&lt;br /&gt;&lt;/blockquote&gt;These "superclusters" and "filaments" together create a structure that looks like a piece of open-cell foam or nerve cells. For example:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://magnum.anu.edu.au/%7ETDFgg/Public/Pics/2dFzcone_big.jpg"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 320px;" src="http://magnum.anu.edu.au/%7ETDFgg/Public/Pics/2dFzcone_big.jpg" alt="" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;div style="text-align: center;"&gt;(&lt;a href="http://www.mso.anu.edu.au/2dFGRS/"&gt;http://www.mso.anu.edu.au/2dFGRS/&lt;/a&gt;)&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;Now if you can remember back to what we discussed about Perlin Noise, when we output a representation of a 2 dimensional slice of it, it looks like a fractal terrain map.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://lh5.google.com/_RrFTRNcWhxk/RZ8AP4fWzfI/AAAAAAAAAAM/8IwP5acw2Vg/s1600/PerlinNoise_div2plus1.gif"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 200px;" src="http://lh5.google.com/_RrFTRNcWhxk/RZ8AP4fWzfI/AAAAAAAAAAM/8IwP5acw2Vg/s1600/PerlinNoise_div2plus1.gif" alt="" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;This above image is taken with a $size factor of 42. It isn't very helpful in creating something that has nodes, filaments and voids inbetween. However, your standard Perlin Noise algorithm, like the one we use in this project, returns a value between 1 and -1. This means that there's a 0 in the middle somewhere that occurs regularly, so if we take the absolute value of the noise we get the following:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://lh6.google.com/_RrFTRNcWhxk/RZ8AQIfWzgI/AAAAAAAAAAU/YVhc4rDwZj4/s1600/PerlinNoise_abs.gif"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 200px;" src="http://lh6.google.com/_RrFTRNcWhxk/RZ8AQIfWzgI/AAAAAAAAAAU/YVhc4rDwZj4/s1600/PerlinNoise_abs.gif" alt="" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;Which, if you look at the picture of the redshift survey, this looks closer to a negative image. If we flip the noise &lt;span style="font-family:courier new;"&gt;(1-|noise|)&lt;/span&gt; we get the following:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9UVofWziI/AAAAAAAAAAs/WDl7X-olHYU/s1600-h/PerlinNoise_1minusabs.gif"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9UVofWziI/AAAAAAAAAAs/WDl7X-olHYU/s320/PerlinNoise_1minusabs.gif" alt="" id="BLOGGER_PHOTO_ID_5016821240536944162" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;Much closer to what we're after, but still not quite it. Fiddling around with adding in some contrast, we can eventually arrive at a very nice model:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9VxofWzjI/AAAAAAAAAA0/ZVN9ufyOKPg/s1600-h/PerlinNoise_1minusabstothe8th.gif"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9VxofWzjI/AAAAAAAAAA0/ZVN9ufyOKPg/s320/PerlinNoise_1minusabstothe8th.gif" alt="" id="BLOGGER_PHOTO_ID_5016822821084909106" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;The above image is based off of the quantity of one minus the absolute value of noise to the 8th power &lt;span style="font-family:courier new;"&gt;(1-|noise|)&lt;sup&gt;8&lt;/sup&gt;&lt;/span&gt;. If we zoom out a bit (bringing the $size down to 16) we can see how it mimics the distribution of clusters, filaments, and voids rather well:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9W5ofWzkI/AAAAAAAAAA8/gBjocCcV0sk/s1600-h/PerlinNoise_good_zoomout.gif"&gt;&lt;img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9W5ofWzkI/AAAAAAAAAA8/gBjocCcV0sk/s400/PerlinNoise_good_zoomout.gif" alt="" id="BLOGGER_PHOTO_ID_5016824058035490370" border="0" /&gt;&lt;/a&gt;&lt;br /&gt;Using this noise technique as our base, we can make a very nice looking large-scale structure. Keeping the $size to around 40-ish (I'm rather partial to 42) leaves each [x,y,z] coordinate to the scale of approximately 1 megaparsec.&lt;br /&gt;&lt;br /&gt;In the next article, I'll show how we can use this distribution to mimic the appropriate number of galaxies in each megaparsec along with their distribution and a way to display them on the fly through a simple point-and-click web interface. Furthermore, I'll show you how to do it in such a way that it won't cause the PHP script to slow to a grinding halt.&lt;br /&gt;&lt;br /&gt;Peace,&lt;br /&gt;-Steve&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/29414335-6506060992772580244?l=therandomuniverse.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/6506060992772580244/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=29414335&amp;postID=6506060992772580244' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/6506060992772580244'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/6506060992772580244'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/2007/01/simulating-large-scale-structure-of.html' title='Simulating the Large-Scale Structure of the Cosmos'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://2.bp.blogspot.com/_RrFTRNcWhxk/RZ9UVofWziI/AAAAAAAAAAs/WDl7X-olHYU/s72-c/PerlinNoise_1minusabs.gif' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-29414335.post-2852463840667256516</id><published>2007-01-05T16:17:00.000-08:00</published><updated>2008-12-11T06:47:39.496-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='procedural'/><category scheme='http://www.blogger.com/atom/ns#' term='php'/><category scheme='http://www.blogger.com/atom/ns#' term='perlin noise'/><title type='text'>Perlin Noise - Your New Best Friend</title><content type='html'>Perlin Noise is a technique to create natural looking textures and movements by using pseudorandom numbers that was designed by a rather clever computer scientist, Ken Perlin, who is a Professor at New York University.&lt;br /&gt;&lt;br /&gt;Instead of trying to explain what it is and how it works (aka "reinvent the wheel"), I'll instead point you in the direction of Professor Perlin's own words. Read this; absorb this:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.noisemachine.com/talk1/"&gt;http://www.noisemachine.com/talk1/&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;So now that you're familiar with the basics and how things work, here are two more articles about how Perlin Noise can be used and the basic math behind it:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://student.kuleuven.be/%7Em0216922/CG/perlinnoise.html"&gt;http://student.kuleuven.be/~m0216922/CG/perlinnoise.html&lt;/a&gt;&lt;br /&gt;&lt;a href="http://freespace.virgin.net/hugo.elias/models/m_perlin.htm"&gt;http://freespace.virgin.net/hugo.elias/models/m_perlin.htm&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;(If these articles are ever taken down, I'll write up something even better here when I have the time.)&lt;br /&gt;&lt;br /&gt;Perlin Noise is a &lt;span style="font-style: italic;"&gt;marvelous&lt;/span&gt; tool for modeling natural structures, as the field it generates is inherently procedural (so we can calculate things at any point simply knowing the seed) and fractal (like many natural structures). Once you're able to master Noise, you'll be able to master some very good-looking visualizations.&lt;br /&gt;&lt;br /&gt;Now for my purposes, I took the &lt;a href="http://mrl.nyu.edu/%7Eperlin/noise/"&gt;Improved Noise function that Perlin wrote, himself&lt;/a&gt;, and ported it to PHP:&lt;br /&gt;&lt;br /&gt;&lt;a href="http://research.thenerdtank.com/therandomuniverse"&gt;http://research.thenerdtank.com/therandomuniverse&lt;/a&gt; - Click on Perlin.class.txt&lt;br /&gt;&lt;br /&gt;You'll also note that I put together two additional functions which come in handy when you quickly need less than 3 degrees of noise.&lt;br /&gt;&lt;br /&gt;Using the code above, I was able to get the following results when creating an image:&lt;br /&gt;&lt;br /&gt;&lt;div style="text-align: center;"&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_RrFTRNcWhxk/RZ8AQIfWzgI/AAAAAAAAAAU/YVhc4rDwZj4/s1600-h/PerlinNoise_abs.gif"&gt;&lt;img style="margin: 0px auto 10px; cursor: pointer;" src="http://4.bp.blogspot.com/_RrFTRNcWhxk/RZ8AQIfWzgI/AAAAAAAAAAU/YVhc4rDwZj4/s400/PerlinNoise_abs.gif" alt="" id="BLOGGER_PHOTO_ID_5016728787070930434" border="0" /&gt;&lt;/a&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_RrFTRNcWhxk/RZ8AP4fWzfI/AAAAAAAAAAM/8IwP5acw2Vg/s1600-h/PerlinNoise_div2plus1.gif"&gt;&lt;img style="margin: 0px auto 10px; cursor: pointer;" src="http://3.bp.blogspot.com/_RrFTRNcWhxk/RZ8AP4fWzfI/AAAAAAAAAAM/8IwP5acw2Vg/s400/PerlinNoise_div2plus1.gif" alt="" id="BLOGGER_PHOTO_ID_5016728782775963122" border="0" /&gt;&lt;/a&gt;&lt;/div&gt;Since the Perlin Noise function gives a number between -1 and 1, inclusive, the picture on the right is divided by two plus one &lt;span style="font-family:courier new;"&gt;(noise/2+1)&lt;/span&gt;, where the picture on the left is its absolute value &lt;span style="font-family:courier new;"&gt;(|noise|)&lt;/span&gt;.&lt;br /&gt;&lt;br /&gt;Now, using this noise function, in our next article we're going to investigate how to &lt;span style="font-style: italic;"&gt;decently&lt;/span&gt; simulate (for the sake of an RPG) the &lt;a href="http://en.wikipedia.org/wiki/Large_scale_structure_of_the_cosmos"&gt;large-scale structure of the cosmos&lt;/a&gt; by modeling the layout of galaxy clusters.&lt;br /&gt;&lt;br /&gt;Peace,&lt;br /&gt;-Steve&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/29414335-2852463840667256516?l=therandomuniverse.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/2852463840667256516/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=29414335&amp;postID=2852463840667256516' title='8 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/2852463840667256516'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/2852463840667256516'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/2007/01/perlin-noise-your-new-best-friend.html' title='Perlin Noise - Your New Best Friend'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_RrFTRNcWhxk/RZ8AQIfWzgI/AAAAAAAAAAU/YVhc4rDwZj4/s72-c/PerlinNoise_abs.gif' height='72' width='72'/><thr:total>8</thr:total></entry><entry><id>tag:blogger.com,1999:blog-29414335.post-9010201519816130479</id><published>2007-01-05T15:56:00.000-08:00</published><updated>2007-01-05T16:16:24.307-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='procedural'/><category scheme='http://www.blogger.com/atom/ns#' term='mysql'/><category scheme='http://www.blogger.com/atom/ns#' term='php'/><title type='text'>The Scope of This Project</title><content type='html'>Alright, before I actually get to the two articles I promised I'd start out with, I feel the need to discuss a bit more about the scope of this project.&lt;br /&gt;&lt;br /&gt;The vast majority of widgets that I've put together for my tabletop roleplaying endeavors have been designed for access through a web browser. In the past, I've had character sheets online so that players can update them at home, battle maps with virtual figs projected onto a screen or wall where players can log into a local server and move them across the board, and mapping software that allowed for the players to put their own labels on the map and sort them in real time through &lt;a href="http://www.getfirefox.com/"&gt;Firefox&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;All of my widgets I've coded using a combination of &lt;a href="http://www.php.net/"&gt;PHP&lt;/a&gt; (4.x or 5.x) and &lt;a href="http://www.mysql.org/"&gt;MySQL&lt;/a&gt;, running off of an &lt;a href="http://www.apache.org/"&gt;Apache&lt;/a&gt; server, and for this particular project, I intend to do the same.&lt;br /&gt;&lt;br /&gt;All diehard programmers now will immediately say, "This certainly imposes some significant restrictions on what you can do," to which I must agree. PHP, being an interpreted language is certainly slower than C++, Visual Basic, or Java, which will cause very complex simulations to slow down to a crawl. Secondly, PHP is only good at exporting to webpages where some people may want to use the techniques in 3D.&lt;br /&gt;&lt;br /&gt;I choose to use this combination for two main reasons:&lt;br /&gt;&lt;ol&gt;&lt;li&gt;Anyone and everyone can view a webpage and click links. &lt;/li&gt;&lt;li&gt;It forces me to keep my simulations simple and concise, so others who expound upon my work will have something easily portable to whatever platform they wish.&lt;/li&gt;&lt;/ol&gt;With the code that I'll share here, you can use it with minimal jiggery-pokery to export to a program such as &lt;a href="http://www.povray.org"&gt;POVRay&lt;/a&gt; to render a high-quality model, and it will be simple enough for you to port it to Java and integrate it with Java3D for visualization. I'll also have a version of all examples I show here up and running over on &lt;a href="http://www.TheNerdTank.com"&gt;The Nerd Tank&lt;/a&gt; for tinkering.&lt;br /&gt;&lt;br /&gt;So, now off onto the next topic: Perlin Noise!&lt;br /&gt;&lt;br /&gt;Peace,&lt;br /&gt;-Steve Caruso&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/29414335-9010201519816130479?l=therandomuniverse.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/9010201519816130479/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=29414335&amp;postID=9010201519816130479' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/9010201519816130479'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/9010201519816130479'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/2007/01/scope-of-this-project.html' title='The Scope of This Project'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-29414335.post-999360222981194550</id><published>2007-01-05T14:51:00.000-08:00</published><updated>2007-01-05T15:17:33.400-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='procedural'/><category scheme='http://www.blogger.com/atom/ns#' term='universe'/><title type='text'>Procedural Universe</title><content type='html'>Finally, I've decided to get back to the purpose that this blog was originally constructed for and that is generating a procedural universe.&lt;br /&gt;&lt;br /&gt;What is a "procedural universe" you may ask? In short, it is a convincing enough representation of a fictional universe that is mathematically defined. This would allow for a computer program to generate an entire universe on the fly, only calculating the pieces you're currently looking at rather than having to construct everything at once and then sift through the data.&lt;br /&gt;&lt;br /&gt;Imagine: You're viewing an image of the large scale structure of the cosmos. You click on a cluster of galaxies and you zoom in. You then click on a single galaxy and zoom in to where you can see individual stars. Click on a star, and if there are planets around it, they'll display on the screen. Click on a planet, and you'll be able to walk across its terrain. From there, you could, say, click on a city on the planet's map and zoom in to where you can see individual buildings, and from there, click on individual inhabitants of each building.... Or do it in reverse... Whew. :-)&lt;br /&gt;&lt;br /&gt;Many people may say, "Well, isn't that something similar to what Maxis is doing with their new game Spore?" ... Similar, I admit. My work on procedural universes started many years before Spore was announced, and its scope was more confined to how it would help out with traditional "pen and paper" roleplaying games (you know, the kind that actually have a storyteller rather than a computer who tells you what happens). As such, the level and attention to detail that I've been going for is much higher than one would find in your average video game.&lt;br /&gt;&lt;br /&gt;In the next two articles I post here, I'll be going over the most important tool towards procedural universe generation known to man: Perlin Noise. I'll then follow it up with how to &lt;span style="font-style: italic;"&gt;decently&lt;/span&gt; simulate the large-scale structure of the cosmos.&lt;br /&gt;&lt;br /&gt;From there, my path is still a bit fuzzy, but I promise I'll incorporate random galaxy generation (from elliptical to spiral to irregular), star generation, planet generation using dole's accretion algorithm and other methods, fractal terrain generation with a section on how to calculate map projections and color schemes, city generation, building generation, and many more.&lt;br /&gt;&lt;br /&gt;Peace,&lt;br /&gt;-Steve Caruso&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/29414335-999360222981194550?l=therandomuniverse.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='http://therandomuniverse.blogspot.com/feeds/999360222981194550/comments/default' title='Post Comments'/><link rel='replies' type='text/html' href='http://www.blogger.com/comment.g?blogID=29414335&amp;postID=999360222981194550' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/999360222981194550'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/29414335/posts/default/999360222981194550'/><link rel='alternate' type='text/html' href='http://therandomuniverse.blogspot.com/2007/01/procedural-universe.html' title='Procedural Universe'/><author><name>Steve Caruso</name><uri>http://www.blogger.com/profile/06591903364783438095</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='24' src='http://2.bp.blogspot.com/-OSH6xXjl3a4/TckiDB-C20I/AAAAAAAAAgc/uGA5uaENUtk/s220/The-Librarian.png'/></author><thr:total>0</thr:total></entry></feed>
