diff --git a/CHANGELOG.md b/CHANGELOG.md index 6cbd1055..2edb625e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,12 @@ Change Log -- Ray Tracing in One Weekend ==================================================================================================== +---------------------------------------------------------------------------------------------------- +# v3.0.1 (In Progress) + +- Fix: Display rendered images as pixelated instead of smoothed (#179) + + ---------------------------------------------------------------------------------------------------- # v3.0.0 (2020-03-23) diff --git a/books/RayTracingInOneWeekend.html b/books/RayTracingInOneWeekend.html index 687c8e26..5ad5164b 100644 --- a/books/RayTracingInOneWeekend.html +++ b/books/RayTracingInOneWeekend.html @@ -7,7 +7,7 @@ Peter Shirley edited by Steve Hollasch and Trevor David Black
- Version 3.0.0, 2020-Mar-23 + Version 3.0.1-wip, 2020-XXX-XX
Copyright 2018-2020 Peter Shirley. All rights reserved. @@ -130,8 +130,12 @@ Opening the output file (in `ToyViewer` on my Mac, but try it in your favorite viewer and Google “ppm viewer” if your viewer doesn’t support it) shows this result: +
+ ![First PPM image](../images/img.first-ppm-image.png) +
+
@@ -473,8 +477,12 @@ with $t$ going from zero to one. In our case this produces: +
+ ![A blue-to-white gradient depending on ray Y coordinate](../images/img.blue-to-white.png) +
+
@@ -578,8 +586,12 @@
What we get is this: +
+ ![A simple red sphere](../images/img.red-sphere.png) +
+
Now this lacks all sorts of things -- like shading and reflection rays and more than one object -- @@ -651,8 +663,12 @@
And that yields this picture: +
+ ![A sphere colored according to its normal vectors](../images/img.normals-sphere.png) +
+
Let’s revisit the ray-sphere equation: @@ -800,7 +816,7 @@ the sphere, the normal will point outward, but if the ray is inside the sphere, the normal will point inward. - ![Figure [normal-directions]: Possible directions for sphere surface-normal geometry](../images/fig.normal-possibilities.jpg) + ![Figure [normal-directions]: Possible directions for sphere surface-normal geometry](../images/fig.normal-possibilities.jpg) @@ -1145,8 +1161,12 @@ This yields a picture that is really just a visualization of where the spheres are along with their surface normal. This is often a great way to look at your model for flaws and characteristics. +
+ ![Resulting render of normals-colored sphere with ground](../images/img.normals-sphere-ground.png) +
+ @@ -1326,8 +1346,12 @@ Zooming into the image that is produced, the big change is in edge pixels that are part background and part foreground: +
+ ![Close-up of antialiased pixels](../images/img.antialias.png) +
+ @@ -1487,8 +1511,12 @@
This gives us: +
+ ![First render of a diffuse sphere](../images/img.first-diffuse.jpg) +
+
@@ -1525,8 +1553,12 @@
That yields light grey, as we desire: +
+ ![Diffuse sphere, with gamma correction](../images/img.gamma-correct.jpg) +
+
@@ -1601,8 +1633,12 @@
After rendering we get a similar image: +
+ ![Correct rendering of Lambertian spheres](../images/img.correct-lambertian.png) +
+ It's hard to tell the difference between these two diffuse methods, given that our scene of two spheres is so simple, but you should be able to notice two important visual differences: @@ -1677,8 +1713,12 @@ Gives us the following image: +
+ ![Rendering of diffuse spheres with hemispherical scattering](../images/img.rand-hemispherical.png) +
+
@@ -1979,8 +2019,12 @@
Which gives: +
+ ![Shiny metal](../images/img.metal-shiny.png) +
+
@@ -2029,8 +2073,12 @@
We can try that out by adding fuzziness 0.3 and 1.0 to the metals: +
+ ![Fuzzed metal](../images/img.metal-fuzz.png) +
+
@@ -2047,7 +2095,11 @@ there is a refraction ray at all. For this project, I tried to put two glass balls in our scene, and I got this (I have not told you how to do this right or wrong yet, but soon!): - ![Image 10-1](../images/img.glass-first.png) +
+ + ![Glass first](../images/img.glass-first.png) + +
@@ -2144,7 +2196,11 @@ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ [Listing [dielectric]: [material.h] Dielectric material class that always refracts] +
+ ![Glass sphere that always refracts](../images/img.glass-always-refract.png) + +
@@ -2262,7 +2318,11 @@ We get: +
+ ![Glass sphere that sometimes refracts](../images/img.glass-sometimes-refract.png) + +
@@ -2341,8 +2401,12 @@
This gives: +
+ ![A hollow glass sphere](../images/img.glass-hollow.png) +
+
@@ -2414,8 +2478,12 @@ gives: +
+ ![A wide-angle view](../images/img.wide-view.png) +
+
To get an arbitrary viewpoint, let’s first name the points we care about. We’ll call the position @@ -2497,12 +2565,20 @@ to get: +
+ ![A distant view](../images/img.view-distant.png) +
+ And we can change field of view to get: +
+ ![Zooming in](../images/img.view-zoom.png) +
+
@@ -2639,8 +2715,12 @@ We get: +
+ ![Spheres with depth-of-field](../images/img.depth-of-field.png) +
+ @@ -2714,8 +2794,11 @@
This gives: +
+ ![Final scene](../images/img.book1-final.jpg) +
An interesting thing you might note is the glass balls don’t really have shadows which makes them diff --git a/books/RayTracingTheNextWeek.html b/books/RayTracingTheNextWeek.html index 042e9ca7..d0b614da 100644 --- a/books/RayTracingTheNextWeek.html +++ b/books/RayTracingTheNextWeek.html @@ -7,7 +7,7 @@ Peter Shirley edited by Steve Hollasch and Trevor David Black
- Version 3.0.0, 2020-Mar-23 + Version 3.0.1-wip, 2020-XXX-XX
Copyright 2018-2020 Peter Shirley. All rights reserved. @@ -334,8 +334,12 @@ gives the following result: +
+ ![Bouncing spheres](../images/img.bouncing-spheres.jpg) +
+ @@ -988,8 +992,12 @@ We get: +
+ ![Spheres on checkered ground](../images/img.checker-ground.jpg) +
+
@@ -1029,8 +1037,12 @@ We get: +
+ ![Checkered spheres](../images/img.checker-spheres.jpg) +
+
@@ -1042,12 +1054,20 @@ To get cool looking solid textures most people use some form of Perlin noise. These are named after their inventor Ken Perlin. Perlin texture doesn’t return white noise like this: +
+ ![White noise](../images/img.white-noise.jpg) +
+ Instead it returns something similar to blurred white noise: +
+ ![White noise, blurred](../images/img.white-noise-blur.jpg) +
+ A key part of Perlin noise is that it is repeatable: it takes a 3D point as input and always returns @@ -1059,8 +1079,12 @@ We could just tile all of space with a 3D array of random numbers and use them in blocks. You get something blocky where the repeating is clear: +
+ ![Tiled random patterns](../images/img.tile-random.jpg) +
+
@@ -1190,8 +1214,12 @@
Add the hashing does scramble as hoped: +
+ ![Hashed random texture](../images/img.hash-random.jpg) +
+
@@ -1242,8 +1270,12 @@
And we get: +
+ ![Perlin texture with trilinear interpolation](../images/img.perlin-trilerp.jpg) +
+
@@ -1277,8 +1309,12 @@
This gives a smoother looking image: +
+ ![Perlin texture, trilinearly interpolated, smoothed](../images/img.perlin-tlerp-smooth.jpg) +
+
@@ -1305,8 +1341,12 @@ which gives: +
+ ![Perlin texture, higher frequency](../images/img.perlin-hifreq.jpg) +
+
@@ -1442,8 +1482,12 @@
This finally gives something more reasonable looking: +
+ ![Perlin texture, shifted off integer values](../images/img.perlin-shift.jpg) +
+
@@ -1478,8 +1522,12 @@
Used directly, turbulence gives a sort of camouflage netting appearance: +
+ ![Perlin texture with turbulence](../images/img.perlin-turb.jpg) +
+
@@ -1510,8 +1558,12 @@ Which yields: +
+ ![Perlin noise, marbled texture](../images/img.perlin-marble.jpg) +
+
@@ -1651,8 +1703,12 @@
+
+ ![earthmap.jpg](../images/earthmap.jpg) +
+ To read an image from a file earthmap.jpg (I just grabbed a random earth map from the web -- any standard projection will do for our purposes), and then assign it to a diffuse material, the code is: @@ -1679,8 +1735,12 @@ To test this, assign it to a sphere, and then temporarily cripple the `ray_color()` function in main to just return attenuation. You should get something like: +
+ ![Earth-mapped sphere](../images/img.earth-sphere.jpg) +
+
@@ -1879,8 +1939,12 @@
We get: +
+ ![Scene with rectangle light source](../images/img.rect-light.jpg) +
+
Note that the light is brighter than $(1,1,1)$. This allows it to be bright enough to light things. @@ -1888,8 +1952,12 @@
Fool around with making some spheres lights too. +
+ ![Scene with rectangle and sphere light sources](../images/img.rect-sph-light.jpg) +
+
Now let’s add the other two axes and the famous Cornell Box. @@ -2027,8 +2095,12 @@
We get: +
+ ![Empty Cornell box](../images/img.cornell-empty.jpg) +
+
@@ -2098,8 +2170,12 @@
And voila: +
+ ![Empty Cornell box with fixed walls](../images/img.cornell-empty.jpg) +
+
@@ -2166,8 +2242,12 @@
This gives: +
+ ![Cornell box with two blocks](../images/img.cornell-blocks.jpg) +
+
@@ -2388,8 +2468,12 @@
Which yields: +
+ ![Standard Cornell box scene](../images/img.cornell-box.jpg) +
+
@@ -2578,8 +2662,12 @@
We get: +
+ ![Cornell box with blocks of smoke](../images/img.cornell-smoke.jpg) +
+
@@ -2669,8 +2757,12 @@
Running it with 10,000 rays per pixel yields: +
+ ![Final scene](../images/img.book2-final.jpg) +
+
Now go off and make a really cool image of your own! See https://in1weekend.blogspot.com/ for diff --git a/books/RayTracingTheRestOfYourLife.html b/books/RayTracingTheRestOfYourLife.html index afeaa2be..f57ca6b5 100644 --- a/books/RayTracingTheRestOfYourLife.html +++ b/books/RayTracingTheRestOfYourLife.html @@ -7,7 +7,7 @@ Peter Shirley edited by Steve Hollasch and Trevor David Black
- Version 3.0.0, 2020-Mar-23 + Version 3.0.1-wip, 2020-XXX-XX
Copyright 2018-2020 Peter Shirley. All rights reserved. @@ -768,8 +768,12 @@
At 500×500 my code produces this image in 10min on 1 core of my Macbook: +
+ ![Cornell box, refactored](../images/img.cornell-refactor1.jpg) +
+ Reducing that noise is our goal. We’ll do that by constructing a PDF that sends more rays to the light.
@@ -898,8 +902,12 @@
And again I _should_ get the same picture except with different variance, but I don’t! +
+ ![Cornell box, with different sampling strategy](../images/img.cornell-refactor2.jpg) +
+
It’s pretty close to our old picture, but there are differences that are not noise. The front of the @@ -1254,8 +1262,12 @@
Which produces: +
+ ![Cornell box, with orthonormal basis scatter function](../images/img.cornell-ortho.jpg) +
+ Is that right? We still don’t know for sure. Tracking down bugs is hard in the absence of reliable reference solutions. Let’s table that for now and move on to get rid of some of that noise.
@@ -1353,8 +1365,12 @@
With 10 samples per pixel this yields: +
+ ![Cornell box, sampling only the light, 10 samples per pixel](../images/img.cornell-samplight.jpg) +
+
@@ -1379,8 +1395,12 @@
We also need to flip the light so its normals point in the -y direction and we get: +
+ ![Cornell box, light emitted only in the downward direction](../images/img.cornell-lightdown.jpg) +
+
@@ -1525,8 +1545,12 @@ This yields an apparently matching result so all we’ve done so far is refactor where `pdf` is computed: +
+ ![Cornell box with a cosine density _pdf_](../images/img.cornell-cospdf.jpg) +
+
@@ -1668,8 +1692,12 @@
At 10 samples per pixel we get: +
+ ![Cornell box, sampling a hittable light, 10 samples per pixel](../images/img.cornell-samphit.jpg) +
+
@@ -1756,8 +1784,12 @@
1000 samples per pixel yields: +
+ ![Cornell box, mixture density of cosine and light sampling](../images/img.cornell-coslight.jpg) +
+
We’ve basically gotten this same picture (with different levels of noise) with several different @@ -2082,8 +2114,12 @@ The resulting image has a noisy reflection on the ceiling because the directions toward the box are not sampled with more density. +
+ ![Cornell box with arbitrary PDF functions](../images/img.cornell-flexpdf.jpg) +
+
@@ -2221,8 +2257,12 @@ sampling the light did for my code. This is probably because those rays that hit the glass are expensive! +
+ ![Cornell box with glass sphere, using new PDF functions](../images/img.cornell-glass.jpg) +
+
@@ -2264,8 +2304,12 @@
And we get a decent image with 1000 samples as before: +
+ ![Cornell box, using a mixture of glass & light PDFs](../images/img.cornell-glasslight.jpg) +
+
@@ -2317,8 +2361,12 @@
Happily, the black specks are gone: +
+ ![Cornell box with anti-acne color function](../images/img.book3-final.jpg) +
+
diff --git a/style/book.css b/style/book.css index 19022642..12b9646f 100644 --- a/style/book.css +++ b/style/book.css @@ -154,6 +154,10 @@ div.indented { width: 72ex; } +.md div.render img { + image-rendering: pixelated; +} + .md div.image { margin-bottom: 1em; }