bill
/
Graphics
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added interaction, more descriptions.

Browse Source 
But fixes.
master
bill 4 years ago
parent 603603993a
commit dffef6657c
6 changed files with 389 additions and 38 deletions
Show Stats Download Patch File Download Diff File

2
.gitignore vendored
Unescape View File

@ -1 +1,3 @@
.DS_Store .DS_Store
old/
new/

103
RTXoff.svg
Unescape View File

@ -0,0 +1,103 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 906 215" style="enable-background:new 0 0 906 215;" xml:space="preserve">
<style type="text/css">
.st0{fill:#666666;}
.st1{fill:#606060;}
.st2{fill:#1D1E1D;}
.st3{fill:#FFFFFF;}
.st4{fill:#FFFFFF;stroke:#FFFFFF;stroke-miterlimit:10;}
</style>
<rect x="601.61" y="-0.13" class="st0" width="306" height="215"/>
<path class="st1" d="M604.9,214.84H-2.43V0.18h662L604.9,214.84z"/>
<path class="st2" d="M307.9,0.18l-57.16,214.67h341.99L646.9,0.18H307.9z"/>
<path class="st3" d="M323.71,65.38V39.35c0-1.81,0.64-3.35,1.9-4.62c1.27-1.27,2.8-1.91,4.61-1.91h24.72v6.93h-21.79
c-0.54,0-1,0.2-1.38,0.59s-0.57,0.85-0.57,1.37v21.29c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.38,0.55h13.51
c0.54,0,1-0.18,1.39-0.55c0.38-0.38,0.57-0.83,0.57-1.37v-7.29h-9.33v-6.93h16.93v16.61c0,1.77-0.64,3.29-1.91,4.56
c-1.28,1.27-2.82,1.9-4.62,1.9h-19.48c-1.8,0-3.34-0.63-4.61-1.9C324.35,68.67,323.71,67.15,323.71,65.38"/>
<path class="st3" d="M363.69,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v9.08h19.75v6.93"/>
<path class="st3" d="M396.45,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v16.01"/>
<path class="st3" d="M436.14,62.98c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.38,0.55h13.52c0.54,0,1-0.18,1.39-0.55
c0.38-0.38,0.57-0.83,0.57-1.37V41.75c0-0.54-0.19-1.01-0.57-1.41c-0.38-0.4-0.84-0.6-1.39-0.6H438.1c-0.54,0-1,0.2-1.38,0.6
c-0.38,0.4-0.57,0.87-0.57,1.41V62.98z M428.65,65.38V39.35c0-1.81,0.63-3.35,1.89-4.62c1.27-1.27,2.78-1.91,4.54-1.91h19.5
c1.76,0,3.29,0.64,4.55,1.91c1.27,1.28,1.91,2.82,1.91,4.62v26.03c0,1.79-0.63,3.31-1.89,4.57c-1.27,1.26-2.79,1.89-4.57,1.89h-19.5
c-1.79,0-3.3-0.63-4.55-1.89C429.28,68.69,428.65,67.17,428.65,65.38"/>
<path class="st3" d="M475.47,49.02h12.73c0.54,0,1-0.19,1.38-0.57c0.39-0.38,0.57-0.84,0.57-1.38v-5.3c0-0.54-0.19-1.01-0.57-1.41
c-0.38-0.4-0.84-0.6-1.38-0.6h-12.73V49.02z M467.98,71.84V32.82h23.39c1.8,0,3.34,0.64,4.6,1.91c1.27,1.28,1.9,2.82,1.9,4.62v10.05
c0,1.8-0.63,3.35-1.9,4.62c-1.27,1.28-2.8,1.91-4.61,1.91h-0.48l9.55,15.89h-8.16l-9.65-15.89h-7.16v15.89"/>
<path class="st3" d="M504.77,65.38V39.35c0-1.81,0.63-3.35,1.9-4.62c1.27-1.27,2.8-1.91,4.61-1.91h19.5v6.93h-16.56
c-0.54,0-1.01,0.2-1.39,0.59c-0.38,0.39-0.57,0.85-0.57,1.37v21.29c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.39,0.55h16.56
v6.93h-19.5c-1.8,0-3.34-0.63-4.61-1.9C505.4,68.67,504.77,67.15,504.77,65.38"/>
<path class="st3" d="M537.34,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v9.08h19.75v6.93"/>
<path class="st3" d="M573.1,36.84h-0.82V35.3h0.82c1,0,1,0.57,1,0.76C574.1,36.25,574.1,36.84,573.1,36.84 M575.19,36.06
c0-1.14-0.8-1.86-2.09-1.86h-1.91v5.18h1.09v-1.44h0.82c0.05,0,0.1,0,0.15,0l1.05,1.45h1.36l-1.29-1.76
C574.9,37.29,575.19,36.74,575.19,36.06 M573.21,40.68c-2,0-3.63-1.63-3.63-3.64s1.63-3.63,3.63-3.63s3.63,1.63,3.63,3.63
S575.21,40.68,573.21,40.68 M573.21,32.82c-2.33,0-4.23,1.89-4.23,4.23s1.9,4.23,4.23,4.23s4.23-1.9,4.23-4.23
S575.54,32.82,573.21,32.82"/>
<path class="st3" d="M341.65,118.07h30.51c1.3,0,2.41-0.46,3.32-1.37c0.92-0.91,1.38-2.02,1.38-3.31v-12.72
c0-1.29-0.46-2.42-1.38-3.38c-0.91-0.96-2.03-1.44-3.32-1.44h-30.51V118.07z M323.72,172.75v-93.5h56.03
c4.33,0,8.01,1.53,11.04,4.59c3.03,3.05,4.55,6.75,4.55,11.08v24.09c0,4.33-1.52,8.02-4.55,11.08c-3.04,3.05-6.72,4.59-11.05,4.59
h-1.14l22.89,38.08h-19.54l-23.12-38.08h-17.17v38.08"/>
<path class="st3" d="M408.39,95.58V79.25h71.75v16.33h-26.77v77.17h-18.21V95.58"/>
<path class="st3" d="M484.82,172.75l30.99-47.19l-29.18-46.45h21.95l18.47,29.52l18.81-29.52h20.15l-29.52,44.44l31.12,49.2h-21.89
l-20.35-31.93l-20.55,31.93"/>
<path class="st3" d="M221.13,167.89v-1.14h0.73c0.4,0,0.95,0.03,0.95,0.52c0,0.53-0.28,0.62-0.75,0.62H221.13 M221.13,168.7h0.49
l1.14,2h1.25l-1.26-2.09c0.65-0.05,1.19-0.36,1.19-1.23c0-1.09-0.75-1.45-2.03-1.45h-1.84v4.77h1.06V168.7 M226.49,168.33
c0-2.8-2.17-4.42-4.59-4.42c-2.44,0-4.61,1.62-4.61,4.42c0,2.8,2.18,4.43,4.61,4.43C224.32,172.75,226.49,171.12,226.49,168.33
M225.16,168.33c0,2.04-1.5,3.41-3.27,3.41v-0.01c-1.82,0.01-3.29-1.36-3.29-3.39c0-2.04,1.47-3.4,3.29-3.4
C223.67,164.93,225.16,166.29,225.16,168.33"/>
<path class="st3" d="M110.83,137.83l0,33.49h9.46v-33.49H110.83z M36.43,137.78v33.54h9.54v-25.46l7.39,0c2.45,0,4.2,0.61,5.37,1.87
c1.5,1.59,2.11,4.17,2.11,8.87v14.73h9.25v-18.53c0-13.22-8.43-15.01-16.68-15.01H36.43z M126.06,137.83v33.49h15.34
c8.17,0,10.84-1.36,13.73-4.41c2.04-2.14,3.36-6.84,3.36-11.97c0-4.71-1.11-8.91-3.06-11.52c-3.5-4.68-8.55-5.59-16.09-5.59H126.06z
M135.44,145.12h4.06c5.9,0,9.71,2.65,9.71,9.52c0,6.88-3.81,9.53-9.71,9.53h-4.06V145.12z M97.2,137.83l-7.89,26.54l-7.56-26.54
l-10.21,0l10.8,33.49h13.63l10.89-33.49H97.2z M162.88,171.32h9.46v-33.48l-9.46,0V171.32z M189.4,137.84l-13.21,33.46h9.33
l2.09-5.91h15.63l1.97,5.91h10.12l-13.3-33.47L189.4,137.84z M195.54,143.95l5.73,15.68h-11.64"/>
<path class="st3" d="M61.86,71.16c0,0,12.17-17.96,36.47-19.81v-6.52c-26.91,2.16-50.22,24.96-50.22,24.96s13.2,38.16,50.22,41.65
v-6.93C71.16,101.09,61.86,71.16,61.86,71.16"/>
<path class="st3" d="M98.33,90.74v6.34c-20.53-3.66-26.23-25-26.23-25s9.86-10.92,26.23-12.69v6.96c-0.01,0-0.02,0-0.03,0
c-8.59-1.03-15.3,7-15.3,7S86.75,86.86,98.33,90.74"/>
<path class="st3" d="M98.33,32.81v12.02c0.79-0.06,1.58-0.11,2.38-0.14c30.6-1.03,50.54,25.1,50.54,25.1s-22.9,27.84-46.75,27.84
c-2.19,0-4.23-0.21-6.16-0.54v7.43c1.64,0.21,3.35,0.33,5.13,0.33c22.2,0,38.25-11.34,53.8-24.75c2.58,2.07,13.13,7.09,15.3,9.28
c-14.78,12.38-49.23,22.35-68.75,22.35c-1.88,0-3.69-0.11-5.47-0.29v10.44h84.38V32.81"/>
<path class="st3" d="M98.33,59.39v-8.05c0.78-0.05,1.57-0.1,2.38-0.12c22-0.69,36.44,18.91,36.44,18.91s-15.59,21.65-32.31,21.65
c-2.41,0-4.56-0.38-6.5-1.04V66.35c8.57,1.04,10.29,4.82,15.44,13.4l11.46-9.66c0,0-8.36-10.96-22.46-10.96
C101.23,59.12,99.76,59.23,98.33,59.39"/>
<g>
<path class="st4" d="M748.65,113.4c0,32.02-19.46,48.99-43.19,48.99c-24.56,0-41.81-19.04-41.81-47.2
c0-29.53,18.35-48.85,43.19-48.85C732.22,66.34,748.65,85.8,748.65,113.4z M676.47,114.92c0,19.87,10.76,37.67,29.67,37.67
c19.04,0,29.81-17.53,29.81-38.64c0-18.49-9.66-37.81-29.67-37.81C686.41,76.14,676.47,94.49,676.47,114.92z"/>
<path class="st4" d="M764.24,67.86h50.09v10.07h-38.09v30.91h35.19v9.94h-35.19v42.09h-12.01V67.86z"/>
<path class="st4" d="M831.45,67.86h50.09v10.07h-38.09v30.91h35.19v9.94h-35.19v42.09h-12.01V67.86z"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.5 KiB

105
RTXon.svg
Unescape View File

@ -0,0 +1,105 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 25.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 906 215" style="enable-background:new 0 0 906 215;" xml:space="preserve">
<style type="text/css">
.st0{fill:#75B943;}
.st1{fill:#1D1E1D;}
.st2{fill:#FFFFFF;}
.st3{fill:#FFFFFF;stroke:#FFFFFF;stroke-miterlimit:10;}
</style>
<rect x="601.61" y="-0.13" class="st0" width="306" height="215"/>
<g id="surface1">
<path class="st0" d="M604.9,214.84H-2.43V0.18h662L604.9,214.84z"/>
<path class="st1" d="M307.9,0.18l-57.16,214.67h341.99L646.9,0.18H307.9z"/>
<path class="st2" d="M323.71,65.38V39.35c0-1.81,0.64-3.35,1.9-4.62c1.27-1.27,2.8-1.91,4.61-1.91h24.72v6.93h-21.79
c-0.54,0-1,0.2-1.38,0.59s-0.57,0.85-0.57,1.37v21.29c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.38,0.55h13.51
c0.54,0,1-0.18,1.39-0.55c0.38-0.38,0.57-0.83,0.57-1.37v-7.29h-9.33v-6.93h16.93v16.61c0,1.77-0.64,3.29-1.91,4.56
c-1.28,1.27-2.82,1.9-4.62,1.9h-19.48c-1.8,0-3.34-0.63-4.61-1.9C324.35,68.67,323.71,67.15,323.71,65.38"/>
<path class="st2" d="M363.69,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v9.08h19.75v6.93"/>
<path class="st2" d="M396.45,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v16.01"/>
<path class="st2" d="M436.14,62.98c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.38,0.55h13.52c0.54,0,1-0.18,1.39-0.55
c0.38-0.38,0.57-0.83,0.57-1.37V41.75c0-0.54-0.19-1.01-0.57-1.41c-0.38-0.4-0.84-0.6-1.39-0.6H438.1c-0.54,0-1,0.2-1.38,0.6
c-0.38,0.4-0.57,0.87-0.57,1.41V62.98z M428.65,65.38V39.35c0-1.81,0.63-3.35,1.89-4.62c1.27-1.27,2.78-1.91,4.54-1.91h19.5
c1.76,0,3.29,0.64,4.55,1.91c1.27,1.28,1.91,2.82,1.91,4.62v26.03c0,1.79-0.63,3.31-1.89,4.57c-1.27,1.26-2.79,1.89-4.57,1.89
h-19.5c-1.79,0-3.3-0.63-4.55-1.89C429.28,68.69,428.65,67.17,428.65,65.38"/>
<path class="st2" d="M475.47,49.02h12.73c0.54,0,1-0.19,1.38-0.57c0.39-0.38,0.57-0.84,0.57-1.38v-5.3c0-0.54-0.19-1.01-0.57-1.41
c-0.38-0.4-0.84-0.6-1.38-0.6h-12.73V49.02z M467.98,71.84V32.82h23.39c1.8,0,3.34,0.64,4.6,1.91c1.27,1.28,1.9,2.82,1.9,4.62
v10.05c0,1.8-0.63,3.35-1.9,4.62c-1.27,1.28-2.8,1.91-4.61,1.91h-0.48l9.55,15.89h-8.16l-9.65-15.89h-7.16v15.89"/>
<path class="st2" d="M504.77,65.38V39.35c0-1.81,0.63-3.35,1.9-4.62c1.27-1.27,2.8-1.91,4.61-1.91h19.5v6.93h-16.56
c-0.54,0-1.01,0.2-1.39,0.59c-0.38,0.39-0.57,0.85-0.57,1.37v21.29c0,0.54,0.19,1,0.57,1.37c0.38,0.37,0.84,0.55,1.39,0.55h16.56
v6.93h-19.5c-1.8,0-3.34-0.63-4.61-1.9C505.4,68.67,504.77,67.15,504.77,65.38"/>
<path class="st2" d="M537.34,71.84V32.81h27.34v6.93h-19.75v9.16h15.86v6.93h-15.86v9.08h19.75v6.93"/>
<path class="st2" d="M573.1,36.84h-0.82V35.3h0.82c1,0,1,0.57,1,0.76C574.1,36.25,574.1,36.84,573.1,36.84 M575.19,36.06
c0-1.14-0.8-1.86-2.09-1.86h-1.91v5.18h1.09v-1.44h0.82c0.05,0,0.1,0,0.15,0l1.05,1.45h1.36l-1.29-1.76
C574.9,37.29,575.19,36.74,575.19,36.06 M573.21,40.68c-2,0-3.63-1.63-3.63-3.64s1.63-3.63,3.63-3.63s3.63,1.63,3.63,3.63
S575.21,40.68,573.21,40.68 M573.21,32.82c-2.33,0-4.23,1.89-4.23,4.23s1.9,4.23,4.23,4.23s4.23-1.9,4.23-4.23
S575.54,32.82,573.21,32.82"/>
<path class="st2" d="M341.65,118.07h30.51c1.3,0,2.41-0.46,3.32-1.37c0.92-0.91,1.38-2.02,1.38-3.31v-12.72
c0-1.29-0.46-2.42-1.38-3.38c-0.91-0.96-2.03-1.44-3.32-1.44h-30.51V118.07z M323.72,172.75v-93.5h56.03
c4.33,0,8.01,1.53,11.04,4.59c3.03,3.05,4.55,6.75,4.55,11.08v24.09c0,4.33-1.52,8.02-4.55,11.08c-3.04,3.05-6.72,4.59-11.05,4.59
h-1.14l22.89,38.08h-19.54l-23.12-38.08h-17.17v38.08"/>
<path class="st2" d="M408.39,95.58V79.25h71.75v16.33h-26.77v77.17h-18.21V95.58"/>
<path class="st2" d="M484.82,172.75l30.99-47.19l-29.18-46.45h21.95l18.47,29.52l18.81-29.52h20.15l-29.52,44.44l31.12,49.2h-21.89
l-20.35-31.93l-20.55,31.93"/>
<path class="st2" d="M221.13,167.89v-1.14h0.73c0.4,0,0.95,0.03,0.95,0.52c0,0.53-0.28,0.62-0.75,0.62H221.13 M221.13,168.7h0.49
l1.14,2h1.25l-1.26-2.09c0.65-0.05,1.19-0.36,1.19-1.23c0-1.09-0.75-1.45-2.03-1.45h-1.84v4.77h1.06V168.7 M226.49,168.33
c0-2.8-2.17-4.42-4.59-4.42c-2.44,0-4.61,1.62-4.61,4.42c0,2.8,2.18,4.43,4.61,4.43C224.32,172.75,226.49,171.12,226.49,168.33
M225.16,168.33c0,2.04-1.5,3.41-3.27,3.41v-0.01c-1.82,0.01-3.29-1.36-3.29-3.39c0-2.04,1.47-3.4,3.29-3.4
C223.67,164.93,225.16,166.29,225.16,168.33"/>
<path class="st2" d="M110.83,137.83l0,33.49h9.46v-33.49H110.83z M36.43,137.78v33.54h9.54v-25.46l7.39,0
c2.45,0,4.2,0.61,5.37,1.87c1.5,1.59,2.11,4.17,2.11,8.87v14.73h9.25v-18.53c0-13.22-8.43-15.01-16.68-15.01H36.43z M126.06,137.83
v33.49h15.34c8.17,0,10.84-1.36,13.73-4.41c2.04-2.14,3.36-6.84,3.36-11.97c0-4.71-1.11-8.91-3.06-11.52
c-3.5-4.68-8.55-5.59-16.09-5.59H126.06z M135.44,145.12h4.06c5.9,0,9.71,2.65,9.71,9.52c0,6.88-3.81,9.53-9.71,9.53h-4.06V145.12z
M97.2,137.83l-7.89,26.54l-7.56-26.54l-10.21,0l10.8,33.49h13.63l10.89-33.49H97.2z M162.88,171.32h9.46v-33.48l-9.46,0V171.32z
M189.4,137.84l-13.21,33.46h9.33l2.09-5.91h15.63l1.97,5.91h10.12l-13.3-33.47L189.4,137.84z M195.54,143.95l5.73,15.68h-11.64"/>
<path class="st2" d="M61.86,71.16c0,0,12.17-17.96,36.47-19.81v-6.52c-26.91,2.16-50.22,24.96-50.22,24.96s13.2,38.16,50.22,41.65
v-6.93C71.16,101.09,61.86,71.16,61.86,71.16"/>
<path class="st2" d="M98.33,90.74v6.34c-20.53-3.66-26.23-25-26.23-25s9.86-10.92,26.23-12.69v6.96c-0.01,0-0.02,0-0.03,0
c-8.59-1.03-15.3,7-15.3,7S86.75,86.86,98.33,90.74"/>
<path class="st2" d="M98.33,32.81v12.02c0.79-0.06,1.58-0.11,2.38-0.14c30.6-1.03,50.54,25.1,50.54,25.1s-22.9,27.84-46.75,27.84
c-2.19,0-4.23-0.21-6.16-0.54v7.43c1.64,0.21,3.35,0.33,5.13,0.33c22.2,0,38.25-11.34,53.8-24.75c2.58,2.07,13.13,7.09,15.3,9.28
c-14.78,12.38-49.23,22.35-68.75,22.35c-1.88,0-3.69-0.11-5.47-0.29v10.44h84.38V32.81"/>
<path class="st2" d="M98.33,59.39v-8.05c0.78-0.05,1.57-0.1,2.38-0.12c22-0.69,36.44,18.91,36.44,18.91s-15.59,21.65-32.31,21.65
c-2.41,0-4.56-0.38-6.5-1.04V66.35c8.57,1.04,10.29,4.82,15.44,13.4l11.46-9.66c0,0-8.36-10.96-22.46-10.96
C101.23,59.12,99.76,59.23,98.33,59.39"/>
</g>
<g>
<path class="st3" d="M768.65,113.4c0,32.02-19.46,48.99-43.19,48.99c-24.56,0-41.81-19.04-41.81-47.2
c0-29.53,18.35-48.85,43.19-48.85C752.22,66.34,768.65,85.8,768.65,113.4z M696.47,114.92c0,19.87,10.76,37.67,29.67,37.67
c19.04,0,29.81-17.53,29.81-38.64c0-18.49-9.66-37.81-29.67-37.81C706.41,76.14,696.47,94.49,696.47,114.92z"/>
<path class="st3" d="M784.24,160.87V67.86h13.11l29.81,47.06c6.9,10.9,12.28,20.7,16.7,30.22l0.28-0.14
c-1.1-12.42-1.38-23.74-1.38-38.23V67.86h11.32v93.01h-12.14l-29.53-47.2c-6.49-10.35-12.7-20.98-17.39-31.05l-0.41,0.14
c0.69,11.73,0.97,22.91,0.97,38.36v39.74H784.24z"/>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

162
index.html
Unescape View File

@ -21,6 +21,7 @@
</style> </style>
<body bgcolor=white text=black link=black alink=blue vlink=blue> <body bgcolor=white text=black link=black alink=blue vlink=blue>
<center> <center>
<!!--- SUPER SAMPLING THE W/H PARAMS FOR CANVAS ARE RENDER SIZE, IN THE CSS IS ACTUAL(DISPLAY) SIZE.--->
<canvas id='canvas1' style="width: 600px; height:600px;" width=1200 height=1200></canvas> <canvas id='canvas1' style="width: 600px; height:600px;" width=1200 height=1200></canvas>
</center> </center>
</body> </body>
@ -56,7 +57,19 @@ Solar RTX
<p style="font-size:30px; ">In this homework, I implemented Global illumination w/ <p style="font-size:30px; ">In this homework, I implemented Global illumination w/
Realtime Recursive Ray Tracing! Realtime Recursive Ray Tracing!
<p> <p>
<i style="font-size:25px;">Here is how it works:</i> <i style="font-size:25px;">Usage: </i>
<ul>
<li>Ctrl+Alt/Option+T: Toggle Texture.</li>
<li>Ctrl+S: Download fragment shader.</li>
<li>Ctrl+Alt/Option+R: Toggle Recursive Ray Tracing.</li>
<li>Ctrl+Alt/Option+N: Reset ViewPoint.</li>
<li>Ctrl+Alt/Option+P: Toggle Pause/Resume.</li>
<li style="color:red;">Please unfocus the Editing area (click somewhere else on the page) to use hotkeys.</li>
<li>Click on canvas (WITHOUT key modifiers): Toggle Pause/Resume.</li>
<li>SHIFT+Alt/Option+MOUSE DRAG/WHEEL ZOOM: Changing Viewing point.</li>
</ul>
<i style="font-size:25px;">How it works:</i>
<ul> <ul>
<li>First, I started with what I've already done in homework 1. Which already included complete Phong shading with <li>First, I started with what I've already done in homework 1. Which already included complete Phong shading with
Specular light and much more (spherical texture mapping, simple interactions, improved UI/shader editor). Specular light and much more (spherical texture mapping, simple interactions, improved UI/shader editor).
@ -65,10 +78,19 @@ Solar RTX
<li> I modified the ray tracing algorithm so that when hitting an object, instead of returning color calculated from <li> I modified the ray tracing algorithm so that when hitting an object, instead of returning color calculated from
Phong model:<br> Phong model:<br>
<ul> <ul>
<li>I recursively traced the light reflected and refract from the object.</li> <li>It recursively bounces and/or refract(NOT IMPLEMENTED YET) itself spawning new rays.</li>
<li></li> <li>The color of this pixel equals to Ambient + Diffuse + ks*color[Reflected] + kt*color[Refracted].
(<a href="https://www.cs.drexel.edu/~david/Classes/Papers/p343-whitted.pdf">Turner Whitted Model</a>)</li>
<li>The tracing will stop when a ray was reflected/refracted n_ref times. </li>
<li>The color of the final light is computed via specular component from the Phong model.</li>
<li>You may increase n_ref for more iterations, but please proceed with caution, because it may halt the computer.
</li>
</ul> </ul>
<li></li> <li>I added more interactions, you can now change the viewpoint by
holding shift and alt key while dragging on canvas to rotate,
or holding shift and alt while scrolling on canvas to change focal length.
This is implemented by applying a transformation matrix to the viewpoint and projection surface.
</li>
<li>Finally, I used super sampling via doubling the render dimensions of the canvas to reduce aliasing.</li> <li>Finally, I used super sampling via doubling the render dimensions of the canvas to reduce aliasing.</li>
<li>Repo on <a href="https://github.com/sunyinqi0508/graphics_hw1">Github</a>.</li> <li>Repo on <a href="https://github.com/sunyinqi0508/graphics_hw1">Github</a>.</li>
</li> </li>
@ -104,6 +126,9 @@ let vs = my_vertex_shader.innerHTML;
client.send(); client.send();
document.body.innerHTML = ['' document.body.innerHTML = [''
,'<font size=7 color=#909090>' + my_title.innerHTML ,'<font size=7 color=#909090>' + my_title.innerHTML
,'<img id="rtx" style="float:right;" src="./RTXon.svg" type="image/svg+xml"'
,' alt="Turn Ray Tracing On/OFF" title="Turn Ray Tracing On/OFF" height=60px /img>'
,'<div id="fps" style="font-size:25;float:right;margin-right:18px;"></div>'
,'<TABLE cellspacing=0 cellpadding=0><TR>' ,'<TABLE cellspacing=0 cellpadding=0><TR>'
,'<td><font color=red size=5><div id=errorMessage></div></font></td>' ,'<td><font color=red size=5><div id=errorMessage></div></font></td>'
,'</TR><TR>' ,'</TR><TR>'
@ -111,7 +136,8 @@ document.body.innerHTML = [''
,'<tr>' ,'<tr>'
,'<td valign=top>' ,'<td valign=top>'
,'<div id="ace" style="width:800px;height:1780px;"></div>' ,'<div id="ace" style="width:800px;height:1780px;"></div>'
,'</td><td valign=top>' + document.body.innerHTML + '<div style=\'font-size:25px\'>' + my_instructions.innerHTML + '</div>' + '</td>' ,'</td><td valign=top>' + document.body.innerHTML
,'<div style=\'font-size:25px\'>' + my_instructions.innerHTML + '</div>' + '</td>'
,'</tr></table>' ,'</tr></table>'
,'</TR></TABLE>' ,'</TR></TABLE>'
].join(''); ].join('');
@ -137,52 +163,148 @@ editor.setAutoScrollEditorIntoView(true);
delete editor.KeyBinding; delete editor.KeyBinding;
let lastTime = Date.now(); let lastTime = Date.now();
let animating = true; let animating = true;
let ctrl = false; let ctrl = false, alt = false, shift = false, fpson = true, moving = false;
canvas1.addEventListener('click',function(ev){ let mousedx = 0, mousedy = 0, mousedz = 0;
let mouselastX, mouselastY;
let pause_resume = function(){
if(animating) if(animating)
lastTime = Date.now(); lastTime = Date.now();
else else
startTime += Date.now() - lastTime; startTime += Date.now() - lastTime;
animating = !animating; animating = !animating;
};
canvas1.addEventListener('click',function(ev){
if(!(shift && alt))
pause_resume();
//moving = false;
});
canvas1.addEventListener('mousedown', function(e){
if(shift && alt){
moving = true
mouselastX = mouselastY = undefined;
}
else
moving = false;
});
canvas1.addEventListener('mousemove', function(e){
if(shift && alt && moving){
if(!(mouselastX==undefined || mouselastY == undefined)){
mousedx += (mouselastX - e.offsetX)/60;
mousedy += (mouselastY - e.offsetY)/60;
setUniform('4f', 'rot', Math.cos(mousedx), Math.sin(mousedx), Math.cos(mousedy), Math.sin(mousedy));
}
mouselastX = e.offsetX;
mouselastY = e.offsetY;
}
else
moving = false;
});
canvas1.addEventListener('mouseup', function(e){
// if(ctrl && alt && moving){
// }
moving = false;
});
canvas1.addEventListener('mouseout', function(e){
// if(ctrl && alt && moving){
// }
moving = false;
}); });
canvas1.addEventListener('wheel', function(e){
if(shift && alt){
mousedz += e.wheelDelta/600;
setUniform('1f', 'dFL', mousedz);
}
});
rtx.style.cursor="pointer";
let rtswitch = function(){
const mask = 0x2;
let rtstatus = !(flags&mask);
if (rtstatus)
rtx.src='./RTXoff.svg';
else
rtx.src='./RTXon.svg';
flags = flags&!mask | (rtstatus?mask:0);
setUniform('1i', 'flags', flags);
}
rtx.addEventListener('click', rtswitch);
var requestAnimationFrame = window.requestAnimationFrame ||
window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
let fpscounter = function(time){
if (start === undefined)
start = time;
else
fps.innerHTML = Math.round(10000/(time-start))/10 + ' fps';
start = time;
if(fpson)
requestAnimationFrame(fpscounter);
else{
start = undefined;
fps.innerHTML = '';
}
};
document.addEventListener('keydown',(e)=>{ document.addEventListener('keydown',(e)=>{
if(e.code.startsWith('Shift'))
shift = true;
if(e.code.startsWith('Control')) if(e.code.startsWith('Control'))
{
ctrl = true; ctrl = true;
} if(e.code.startsWith('Alt'))
else if(ctrl && e.code == 'KeyT') alt = true;
{ else if(ctrl && alt && e.code == 'KeyT'){
mask = 0x1; const mask = 0x1;
flags = flags&!mask | (!(flags&mask)?mask:0); flags = flags&!mask | (!(flags&mask)?mask:0);
setUniform('1i', 'flags', flags); setUniform('1i', 'flags', flags);
} }
else if (ctrl && e.code == 'KeyS') else if (ctrl &&e.code == 'KeyS'){
{
let a = document.createElement('a'); let a = document.createElement('a');
a.href = "data:text/plain,"+encodeURIComponent(editor.getSession().getValue()); a.href = "data:text/plain,"+encodeURIComponent(editor.getSession().getValue());
a.download = 'shader.frag'; a.download = 'shader.frag';
a.click(); a.click();
} }
else if(ctrl && alt&&e.code == 'KeyR')
rtswitch();
else if(ctrl && alt&&e.code == 'KeyN')
{
flags = 0;
moving = false;
mousedx = mousedy = mousedz = 0;
setUniform('4f', 'rot', Math.cos(mousedx), Math.sin(mousedx), Math.cos(mousedy), Math.sin(mousedy));
setUniform('1f', 'dFL', mousedz);
setUniform('1i', 'flags', flags);
}
else if(ctrl && alt&&e.code == 'KeyP')
pause_resume();
else if(ctrl && alt&&e.code == 'KeyF')
if(!fpson)
{
fpson = true;
requestAnimationFrame(fpscounter);
}
else
fpson = false;
// else if(e.code =='KeyV')
// alert(' '+ mousedx+ ' ' + mousedy + ' '+mousedz)
}); });
document.addEventListener('keyup',(e)=>{ document.addEventListener('keyup',(e)=>{
if(e.code.startsWith('Control')) if(e.code.startsWith('Control'))
{
ctrl = false; ctrl = false;
} if(e.code.startsWith('Alt'))
alt = false;
if(e.code.startsWith('Shift'))
shift = false;
}); });
// SET THE CURRENT TIME IN SECONDS BEFORE RENDERING EACH FRAME. // SET THE CURRENT TIME IN SECONDS BEFORE RENDERING EACH FRAME.
let startTime = Date.now(); let startTime = Date.now();
let lastFrameTime = 0;
function animate(gl) { function animate(gl) {
if(animating) if(animating)
setUniform('1f', 'uTime', (Date.now() - startTime) / 1000); setUniform('1f', 'uTime', (Date.now() - startTime) / 1000);
else else
setUniform('1f', 'uTime', (lastTime - startTime) / 1000); setUniform('1f', 'uTime', (lastTime - startTime) / 1000);
} }
let start;
requestAnimationFrame(fpscounter);
</script> </script>

4
lib2.js
Unescape View File

@ -90,7 +90,7 @@ function gl_start(canvas, vertexShader, fragmentShader) { // START WEB
setTimeout(function () { setTimeout(function () {
try { try {
canvas.gl = canvas.getContext('webgl2'); // Make sure WebGl is supported. IT WOULD BE GREAT TO USE WEBGL2 INSTEAD. canvas.gl = canvas.getContext('experimental-webgl'); // Make sure WebGl is supported. IT WOULD BE GREAT TO USE WEBGL2 INSTEAD.
} catch (e) { throw 'Sorry, your browser does not support WebGL.'; } } catch (e) { throw 'Sorry, your browser does not support WebGL.'; }
canvas.setShaders = function (vertexShader, fragmentShader) { // Add the vertex and fragment shaders: canvas.setShaders = function (vertexShader, fragmentShader) { // Add the vertex and fragment shaders:
@ -151,7 +151,7 @@ function gl_start(canvas, vertexShader, fragmentShader) { // START WEB
textures[i] = i; textures[i] = i;
} }
gl.uniform1iv(gl.getUniformLocation(program, 'uSampler'), textures); gl.uniform1iv(gl.getUniformLocation(program, 'uSampler'), textures);
setUniform('4f', 'rot', Math.cos(mousedx), Math.sin(mousedx), Math.cos(mousedy), Math.sin(mousedz));
gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer()); // Create a square as a triangle strip gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer()); // Create a square as a triangle strip
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array( // consisting of two triangles. gl.bufferData(gl.ARRAY_BUFFER, new Float32Array( // consisting of two triangles.
[-1, 1, 0, 1, 1, 0, -1, -1, 0, 1, -1, 0]), gl.STATIC_DRAW); [-1, 1, 0, 1, 1, 0, -1, -1, 0, 1, -1, 0]), gl.STATIC_DRAW);

45
shader.frag
Unescape View File

@ -4,23 +4,35 @@ vec3 groundColor = vec3(.2, .3, .5);
vec4 groundSpecular = vec4(.71, .71, .71, 10.); vec4 groundSpecular = vec4(.71, .71, .71, 10.);
uniform float uTime;// TIME, IN SECONDS uniform float uTime;// TIME, IN SECONDS
uniform int flags; uniform int flags;
//FLAGS 0-RT, 1-TEX, 2- uniform vec4 rot;
uniform float dFL;
//FLAGS 0-TEX, 1-RT, 2-CLOUD, 3-TEX_ROT
varying vec3 vPos;// -1 < vPos.x < +1 varying vec3 vPos;// -1 < vPos.x < +1
// -1 < vPos.y < +1 // -1 < vPos.y < +1
// vPos.z == 0 // vPos.z == 0
float fl=3.; float fl=3.;
const float pi=3.14159265359; const float pi=3.14159265359;
const int n_ref=2; const int n_ref=6;
const int ns=2; const int ns=2;
vec4 Sph[ns]; vec4 Sph[ns];
uniform sampler2D uSampler[ns]; uniform sampler2D uSampler[ns];
vec3 Ambient[ns]; vec3 Ambient[ns];
vec3 Diffuse[ns]; vec3 Diffuse[ns];
vec4 Specular[ns]; vec4 Specular[ns];
struct Sphere{
vec4 Pos;
vec3 Ambient;
vec3 Diffuse;
vec4 Specular;
int textureid;
float ks, kt;
};
struct RT{ struct RT{
vec3 color; vec3 color;
float ks; float ks;
// vec3 colorr;
// float kt;
// vec3 ptr; // vec3 ptr;
// vec3 normal; // vec3 normal;
} stack[n_ref]; } stack[n_ref];
@ -62,13 +74,20 @@ void main(){
// INITIALIZE TO A BACKGROUND COLOR // INITIALIZE TO A BACKGROUND COLOR
vec3 color=vec3(.2, .3, .5); vec3 color=vec3(.2, .3, .5);
float ca=rot.x, sa = rot.y, cb=rot.z, sb=rot.w;
// COMPUTE THE RAY ORIGIN AND DIRECTION // COMPUTE THE RAY ORIGIN AND DIRECTION
float x=vPos.x; mat3 transformation, invTr;
float y=vPos.y; transformation[0] = vec3(ca, sb*sa, sa*cb);
transformation[1] = vec3(0, cb, -sb);
vec3 V=vec3(0.,0.,fl); transformation[2] = vec3(-sa,ca*sb,ca*cb);
vec3 W=normalize(vec3(x,y,-fl)); invTr[0] = vec3(ca, 0, -sa);
invTr[1] = vec3(sa*sb, cb, ca*sb);
invTr[2] = vec3(cb*sa, -sb, ca*cb);
vec3 trPos = transformation*vec3(vPos.xy, -2);
vec3 V=transformation*vec3(0.,0.,fl+dFL);
vec3 W=normalize(trPos-V);
// RAY TRACE TO ALL OBJECTS IN THE SCENE // RAY TRACE TO ALL OBJECTS IN THE SCENE
bool rtxoff = getflag(flags, 1); bool rtxoff = getflag(flags, 1);
int cnt_ref = n_ref; int cnt_ref = n_ref;
@ -99,7 +118,7 @@ void main(){
if(i == iMin) if(i == iMin)
{ {
//*TEXTURE MAPPING //*TEXTURE MAPPING
vec3 tex_sph=S-Sph[i].xyz; vec3 tex_sph=invTr*(S-Sph[i].xyz);
float R=Sph[i].w; float R=Sph[i].w;
float tex_x=acos(abs(tex_sph.x)/sqrt(R*R-tex_sph.y*tex_sph.y)); float tex_x=acos(abs(tex_sph.x)/sqrt(R*R-tex_sph.y*tex_sph.y));
if(tex_sph.x>0.) if(tex_sph.x>0.)
@ -124,7 +143,7 @@ void main(){
; ;
// + SPECULAR COMPONENT GOES HERE // + SPECULAR COMPONENT GOES HERE
if(rtxoff || j == n_ref - 1) if(rtxoff || j == n_ref - 1)
color += float(j) * Specular[i].xyz*pow(max(0.,dot(2.*dot(N,realLDir)*N-realLDir,-W)),Specular[i].w); color += sqrt(float(j+1)) * Specular[i].xyz*pow(max(0.,dot(2.*dot(N,realLDir)*N-realLDir,-W)),Specular[i].w);
stack[j] = RT(color, 0.15); stack[j] = RT(color, 0.15);
V = S; V = S;
W = -normalize(2. * dot(N, W) * N - W); W = -normalize(2. * dot(N, W) * N - W);
@ -134,7 +153,7 @@ void main(){
else { else {
// TO SIMIPIFY THINGS UP, I'LL ASSUME THAT EVERYTHING // TO SIMIPIFY THINGS UP, I'LL ASSUME THAT EVERYTHING
// IS INSIDE THE BOUNDING BOX [(-1,-1,-1), (1,1,1)] // IS INSIDE THE BOUNDING BOX [(-1,-1,-1), (1,1,1)]
// AND THERE'S A INFINITE FLOOR [y = -1] // AND THERE'S A FLOOR at [y = -1]
float t = -(.2+V.y)/W.y; float t = -(.2+V.y)/W.y;
float sx = V.x + t* W.x, sz = V.z + t * W.z; float sx = V.x + t* W.x, sz = V.z + t * W.z;
@ -150,7 +169,7 @@ void main(){
; ;
// + SPECULAR COMPONENT GOES HERE // + SPECULAR COMPONENT GOES HERE
if(rtxoff || j == n_ref - 1) if(rtxoff || j == n_ref - 1)
color += float(j)*groundSpecular.xyz* color += sqrt(float(j+1))*groundSpecular.xyz*
pow(max(0., dot(vec3(-realLDir.x, realLDir.y,-realLDir.z),-W)),groundSpecular.w); pow(max(0., dot(vec3(-realLDir.x, realLDir.y,-realLDir.z),-W)),groundSpecular.w);
stack[j] = RT(color, 0.1); stack[j] = RT(color, 0.1);
V = S; V = S;
@ -159,7 +178,7 @@ void main(){
else{ else{
if(j > 0) if(j > 0)
{ {
stack[j] = RT(vec3(12.,12.,12.)*pow(max(0.,dot(W, normalize(LDir - V))), 10.), 0.); stack[j] = RT(sqrt(float(j+1))*vec3(4.,4.,4)*pow(max(0.,dot(W, normalize(LDir - V))), 10.), 0.);
cnt_ref = j + 1; cnt_ref = j + 1;
} }
else else

Write Preview
Loading…
Cancel
Save