terrain-map
ARCHIVED - repo for blog post http://www.vogt.world/writing/procedural-terrain-generation/
git clone https://git.vogt.world/terrain-map.git
Log | Files | README.md
← Commit log
commit
message
working on various map combinations
author
Ben Vogt <[email protected]>
date
2016-05-18 01:01:52
stats
2 file(s) changed, 27 insertions(+), 26 deletions(-)
files
index.html
style.css
  1diff --git a/index.html b/index.html
  2index 0170972..29f414a 100644
  3--- a/index.html
  4+++ b/index.html
  5@@ -19,7 +19,7 @@
  6         <p><strong>NOTE: Some of these map sets take upwards of 45 seconds to generate on a computer with a solid processor. Your milage may vary.</strong></p>
  7       </div>
  8     </div>
  9-    <!-- container-1 -->
 10+    <!-- container -->
 11     <div class="container">
 12       <hr>
 13       <div class="row">
 14@@ -29,10 +29,10 @@
 15           <button class="run button-primary" id="standard">GENERATE</button>
 16         </p>
 17       </div>
 18-      <div class="set-of" id="container-standard"></div>
 19+      <div class="set" id="container-standard"></div>
 20       <hr>
 21     </div>
 22-    <!-- container-sadkajda -->
 23+    <!-- container -->
 24     <div class="container">
 25       <hr>
 26       <div class="row">
 27@@ -42,10 +42,10 @@
 28           <button class="run button-primary" id="smoothed">GENERATE</button>
 29         </p>
 30       </div>
 31-      <div class="set-of" id="container-smoothed"></div>
 32+      <div class="set" id="container-smoothed"></div>
 33       <hr>
 34     </div>
 35-    <!-- container-2 -->
 36+    <!-- container -->
 37     <div class="container">
 38       <div class="row">
 39         <h2>Combining Diamond-Square Maps</h2>
 40@@ -61,10 +61,10 @@
 41           <button class="run button-primary" id="combined">GENERATE</button>
 42         </p>
 43       </div>
 44-      <div class="set-of" id="container-combined"></div>
 45+      <div class="set" id="container-combined"></div>
 46       <hr>
 47     </div>
 48-    <!-- container-3 -->
 49+    <!-- container -->
 50     <div class="container">
 51       <div class="row">
 52         <h2>Greedy Raindrop Erosion Algorithm</h2>
 53@@ -73,10 +73,10 @@
 54           <button class="run button-primary" id="grd">GENERATE</button>
 55         </p>
 56       </div>
 57-      <div class="set-of" id="container-grd"></div>
 58+      <div class="set" id="container-grd"></div>
 59       <hr>
 60     </div>
 61-    <!-- container-4 -->
 62+    <!-- container -->
 63     <div class="container">
 64       <div class="row">
 65         <h2>Simple Erosion Algorithm</h2>
 66@@ -86,10 +86,10 @@
 67           <button class="run button-primary" id="simpleErosion">GENERATE</button>
 68         </p>
 69       </div>
 70-      <div class="set-of" id="container-simpleErosion"></div>
 71+      <div class="set" id="container-simpleErosion"></div>
 72       <hr>
 73     </div>
 74-    <!-- container-5 -->
 75+    <!-- container -->
 76     <div class="container">
 77       <div class="row">
 78         <h2>Complex Erosion Algorithm</h2>
 79@@ -98,32 +98,31 @@
 80           <button class="run button-primary" id="complexErosion">GENERATE</button>
 81         </p>
 82       </div>
 83-      <div class="set-of" id="container-complexErosion"></div>
 84+      <div class="set" id="container-complexErosion"></div>
 85       <hr>
 86     </div>
 87-    <!-- container-6 -->
 88+    <!-- container -->
 89     <div class="container">
 90       <div class="row">
 91-        <h2>Varous Erosion Maps</h2>
 92+        <h2>Varous Maps</h2>
 93+        <br>
 94+        <h4>Smoothing, Greedy Raindrop, and Complex Erosion</h4>
 95         <p>
 96           Smoothing, Greedy Raindrop, and Complex Erosion algorithms applied to the same DS map.
 97           <button class="run button-primary" id="sample">GENERATE</button>
 98         </p>
 99       </div>
100-      <div class="set-of" id="container-sample"></div>
101-      <hr>
102-    </div>
103-    <!-- container-7 -->
104-    <div class="container">
105+      <div class="set" id="container-sample"></div>
106+      <br>
107       <div class="row">
108-        <h2>Combining Smooth, and Complex Erosion Maps</h2>
109+        <h4>Combining Smooth, and Complex Erosion Maps</h4>
110         <p>
111           Combining smoothed map <code>p2</code> with an eroded map <code>p3</code>, by a third, unrelated smooth map <code>m2</code> to result in <code>c1 from (p3,p2,m2)</code>.
112           Also generating <code>c2 from (p2,p3,m2)</code> by swapping first two maps.
113           <button class="run button-primary" id="many">GENERATE</button>
114         </p>
115       </div>
116-      <div class="set-of" id="container-many"></div>
117+      <div class="set" id="container-many"></div>
118       <hr>
119     </div>
120     <!-- hidden canvas for rendering-->
121diff --git a/style.css b/style.css
122index 5066293..5b8783b 100644
123--- a/style.css
124+++ b/style.css
125@@ -7,18 +7,18 @@ img.map {
126 }
127 
128 div.box {
129-  padding-bottom: 20px;
130+  padding-bottom: 14px;
131 }
132 
133-div.set-of {
134+div.set {
135   min-height: 256px;
136 }
137 
138-div.set-of:empty {
139+div.set:empty {
140   background: #F5F5F5;
141 }
142 
143-div.set-of:empty:before {
144+div.set:empty:before {
145   text-align: center;
146   width: 100%;
147   display: block;
148@@ -27,7 +27,7 @@ div.set-of:empty:before {
149   content: 'Press GENERATE to create maps.';
150 }
151 
152-div.set-of .spinner {
153+div.set .spinner {
154   margin-left: 50%;
155   padding-top: 100px;
156 }
157@@ -237,7 +237,7 @@ body {
158   /* currently ems cause chrome bug misinterpreting rems on body element */
159   line-height: 1.6;
160   font-weight: 400;
161-  font-family: Helvetica, Arial, sans-serif;
162+  font-family: Georgia, Times, serif;
163   color: #222;
164 }
165