index.html 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604
  1. <!DOCTYPE html>
  2. <html lang="en-us">
  3. <head>
  4. <title>jMonkeyEngine | Grizeldi&#39;s PBR Tutorial #2 - What are Light Probes?</title>
  5. <meta name="viewport" content="width=device-width,minimum-scale=1">
  6. <meta name="description"
  7. content="jMonkeyEngine is a modern developer friendly game engine written primarily in Java. ">
  8. <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
  9. <link rel="stylesheet" href="/css/style.css">
  10. <meta name="twitter:card" content="summary"/>
  11. <meta name="twitter:title" content="Grizeldi&#39;s PBR Tutorial #2 - What are Light Probes?"/>
  12. <meta name="twitter:description" content="Second part of my tutorial series in which I explain how to use jmonkeyengine&rsquo;s Physically Based Rendering pipeline. In this part we answer the question what are the light probes and why do we need them. "/>
  13. <meta property="og:title" content="Grizeldi&#39;s PBR Tutorial #2 - What are Light Probes?" />
  14. <meta property="og:description" content="Second part of my tutorial series in which I explain how to use jmonkeyengine&rsquo;s Physically Based Rendering pipeline. In this part we answer the question what are the light probes and why do we need them. " />
  15. <meta property="og:type" content="article" />
  16. <meta property="og:url" content="https://jmonkeyengine.org/tutorials/grizeldi-pbr-tutorials/pbr_tutorial2/" /><meta property="article:section" content="tutorials" />
  17. <meta property="article:published_time" content="2019-10-16T08:00:00+00:00" />
  18. <meta property="article:modified_time" content="2019-10-16T08:00:00+00:00" />
  19. <meta itemprop="name" content="Grizeldi&#39;s PBR Tutorial #2 - What are Light Probes?">
  20. <meta itemprop="description" content="Second part of my tutorial series in which I explain how to use jmonkeyengine&rsquo;s Physically Based Rendering pipeline. In this part we answer the question what are the light probes and why do we need them. "><meta itemprop="datePublished" content="2019-10-16T08:00:00+00:00" />
  21. <meta itemprop="dateModified" content="2019-10-16T08:00:00+00:00" />
  22. <meta itemprop="wordCount" content="36">
  23. <meta itemprop="keywords" content="pbr,graphics,tutorials,blog," />
  24. <script src="/js/old-browser.js"></script>
  25. <link rel="stylesheet" href="/css/old-browser.css">
  26. <script src="/highlight/highlight.pack.js"></script>
  27. <script
  28. src="//cdnjs.cloudflare.com/ajax/libs/highlightjs-line-numbers.js/2.8.0/highlightjs-line-numbers.min.js"></script>
  29. <link rel="stylesheet" href="/highlight/styles/railscasts.css">
  30. <script type="text/javascript">
  31. hljs.initHighlightingOnLoad();
  32. hljs.initLineNumbersOnLoad();
  33. </script>
  34. <script src="/js/utils.js"></script>
  35. <script src="/js/showcase.js"></script>
  36. <script type="module" src="/js/Main.js"></script>
  37. <script src="https://cdnjs.cloudflare.com/ajax/libs/later/1.2.0/later.min.js" integrity="sha512-4OyNDMl5KLKjS8F1ImVwUvmthM8HkXbR6vMafCmT5zBTd9I/sA3z3zM0JLBosHW6/3K2jq2RoBo/eTUNS2hOGA==" crossorigin="anonymous"></script>
  38. <script src="/js/maintenance/maintenance.js"></script>
  39. <link rel="stylesheet" href="/js/maintenance/maintenance.css">
  40. <script src="/js/christmas/Christmas.js"></script>
  41. <script>
  42. Christmas.init(
  43. "https://jmonkeyengine.org/js/christmas/",
  44. ["figure.githubUser img", 'img.avatar', "#showcase button"],
  45. [
  46. {
  47. type: "attribute",
  48. value: "src",
  49. transform:function(src){
  50. if(src.startsWith("/user_avatar/hub.jmonkeyengine.org/")) {
  51. return src.substring("/user_avatar/hub.jmonkeyengine.org/".length).split("/")[0];
  52. }
  53. return src;
  54. }
  55. },
  56. {
  57. type: "attribute",
  58. value: "title"
  59. },
  60. {
  61. type: "text"
  62. }
  63. ],
  64. ["header img.avatar"]
  65. );
  66. </script>
  67. </head>
  68. <body>
  69. <header> <nav class="responsiveWidth " id="topmenu">
  70. <div class="expandable">
  71. <a href="https://jmonkeyengine.org/" alt-href="https://jmonkeyengine.org/tags,https://jmonkeyengine.org/authors,https://jmonkeyengine.org/devlog,https://jmonkeyengine.org/blog,,https://jmonkeyengine.org/communitylog">
  72. <button class="genericCl responsiveIcon expandable ">
  73. <i class="fas fa-home"></i> <span>Home</span>
  74. </button>
  75. </a>
  76. <a href="https://jmonkeyengine.org/tags/showcase" alt-href="https://jmonkeyengine.org/showcase">
  77. <button class="genericCl responsiveIcon expandable ">
  78. <i class="fas fa-images"></i> <span>Showcase</span>
  79. </button>
  80. </a>
  81. <a href="https://hub.jmonkeyengine.org">
  82. <button class="genericCl responsiveIcon expandable ">
  83. <i class="fab fa-discourse"></i> <span>Discussions</span>
  84. </button>
  85. </a>
  86. <a href="https://library.jmonkeyengine.org" >
  87. <button class="genericCl responsiveIcon expandable ">
  88. <i class="fas fa-puzzle-piece"></i> <span>Library</span>
  89. </button>
  90. </a>
  91. <a href="https://jmonkeyengine.org/docs">
  92. <button class="genericCl responsiveIcon expandable ">
  93. <i class="fas fa-book"></i> <span>Docs</span>
  94. </button>
  95. </a>
  96. <a href="https://jmonkeyengine.org/license">
  97. <button class="genericCl responsiveIcon expandable toggleable toggledOffPortrait">
  98. <i class="fas fa-balance-scale-right"></i> <span>License</span>
  99. </button>
  100. </a>
  101. </div>
  102. <div class="toggleable toggledOffPortrait expandable">
  103. <a href="https://github.com/jMonkeyEngine/jmonkeyengine" rel='noopener noreferrer' target="_blank">
  104. <button class="icon toggleable toggledOffPortrait codeCl expandable " title="Github">
  105. <i class="fab fa-github-square"></i> <span>Github</span>
  106. </button>
  107. </a>
  108. <a href="https://twitter.com/jmonkeyengine" rel='noopener noreferrer' target="_blank">
  109. <button class="icon twitterCl toggleable toggledOffPortrait expandable " title="Follow on Twitter">
  110. <i class="fab fa-twitter"></i> <span>Twitter</span>
  111. </button>
  112. </a>
  113. <a href="https://www.youtube.com/channel/UC-Fs3R5Q6wW_XYspOXGZgPw" rel='noopener noreferrer'
  114. target="_blank">
  115. <button class="icon youtubeCl toggleable toggledOffPortrait expandable " title="Follow on Youtube">
  116. <i class="fab fa-youtube"></i> <span>Youtube</span>
  117. </button>
  118. </a>
  119. <a href="https://discord.gg/Rv8sfVu" rel='noopener noreferrer' target="_blank">
  120. <button class="icon discordCl toggleable toggledOffPortrait expandable " title="Discord">
  121. <i class="fab fa-discord"></i> <span>Discord</span>
  122. </button>
  123. </a>
  124. <a href="https://jmonkeyengine.org/donate" >
  125. <button class="icon donateCl toggleable toggledOffPortrait expandable " title="Donate">
  126. <i class="fas fa-donate"></i> <span>Donate!</span>
  127. </button>
  128. </a>
  129. </div>
  130. </nav>
  131. <script>
  132. !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.stringSimilarity=e():t.stringSimilarity=e()}(self,(function(){return t={138:t=>{function e(t,e){if((t=t.replace(/\s+/g,""))===(e=e.replace(/\s+/g,"")))return 1;if(t.length<2||e.length<2)return 0;let r=new Map;for(let e=0;e<t.length-1;e++){const n=t.substring(e,e+2),o=r.has(n)?r.get(n)+1:1;r.set(n,o)}let n=0;for(let t=0;t<e.length-1;t++){const o=e.substring(t,t+2),s=r.has(o)?r.get(o):0;s>0&&(r.set(o,s-1),n++)}return 2*n/(t.length+e.length-2)}t.exports={compareTwoStrings:e,findBestMatch:function(t,r){if(!function(t,e){return"string"==typeof t&&!!Array.isArray(e)&&!!e.length&&!e.find((function(t){return"string"!=typeof t}))}(t,r))throw new Error("Bad arguments: First argument should be a string, second should be an array of strings");const n=[];let o=0;for(let s=0;s<r.length;s++){const i=r[s],f=e(t,i);n.push({target:i,rating:f}),f>n[o].rating&&(o=s)}return{ratings:n,bestMatch:n[o],bestMatchIndex:o}}}}},e={},function r(n){if(e[n])return e[n].exports;var o=e[n]={exports:{}};return t[n](o,o.exports,r),o.exports}(138);var t,e}));
  133. window.initJmeMenu=function () {
  134. const selectionClass= window.selectedTopMenuClass || "highlightedCl";
  135. const topmenu = document.querySelector('#topmenu');
  136. if (window.location.href.startsWith("http://localhost:1313")) {
  137. for (const a of topmenu.querySelectorAll("a")) {
  138. a.href = a.href.replace("https://jmonkeyengine.org", "http://localhost:1313");
  139. }
  140. }
  141. const likelyScore=[];
  142. for (const a of topmenu.querySelectorAll("a")) {
  143. const pageUrl=window.location.href.endsWith("/")?window.location.href.substring(0,window.location.href.length-1):window.location.href;
  144. const process = (linkUrls) => {
  145. if(!linkUrls)return;
  146. for(let linkUrl of linkUrls){
  147. if (linkUrl != null) {
  148. if (window.location.href.startsWith("http://localhost:1313")) {
  149. linkUrl = linkUrl.replace("https://jmonkeyengine.org", "http://localhost:1313");
  150. }
  151. if (linkUrl.endsWith("/")) {
  152. linkUrl = linkUrl.substring(0, linkUrl.length - 1);
  153. }
  154. const score = stringSimilarity.compareTwoStrings(linkUrl, pageUrl);
  155. likelyScore.push(
  156. {
  157. score: score,
  158. el: a.querySelector("button")
  159. }
  160. );
  161. }
  162. }
  163. }
  164. process([a.href]);
  165. process(a.getAttribute("alt-href")?a.getAttribute("alt-href").split(","):undefined);
  166. }
  167. likelyScore.sort((a, b) => b.score - a.score);
  168. likelyScore.forEach(el=>el.el.classList.remove(selectionClass));
  169. likelyScore[0].el.classList.add(selectionClass);
  170. };
  171. document.addEventListener('DOMContentLoaded', function(){
  172. window.initJmeMenu();
  173. });
  174. </script>
  175. <div id="siteTitle" class="list hlist responsiveWidth">
  176. <div id="logo">
  177. <a href="/">
  178. <img src="/images/jme-logo.png" />
  179. </a>
  180. <i class="toggleNavOnPortraitButton fas fa-bars" toggle="topmenu"></i>
  181. </div>
  182. <div id="contributionsBanner">
  183. <div> <i class="fas fa-donate"></i>
  184. Backed by:
  185. <a rel='noopener nofollow noreferrer' target="_blank" id="backerName">The Community</a>
  186. <a rel='noopener nofollow noreferrer' target="_blank"
  187. href="https://opencollective.com/jmonkeyengine#section-contributors"> and more...</a>
  188. </div>
  189. <div>
  190. <i class="fab fa-github-alt"></i>
  191. Contributed by:
  192. <a rel='noopener nofollow noreferrer' target="_blank" id="contributorName">The Community</a>
  193. <a rel='noopener nofollow noreferrer' target="_blank"
  194. href="https://github.com/jMonkeyEngine/jmonkeyengine/graphs/contributors">and more...</a>
  195. </div>
  196. </div>
  197. </div>
  198. </header>
  199. <main>
  200. <section id="showcase" mode="banner">
  201. <i id="playButton" class=" fas fa-play"></i>
  202. <video class="showcaseElement cover" style='display: block ' preload="none"
  203. class="cover">
  204. <source src="https://steamcdn-a.akamaihd.net/steam/apps/256746524/movie480.webm" type="video/webm">
  205. </video>
  206. </div>
  207. <div class="showcaseElement" style='display: none '>
  208. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/3.jpg'); " ></div>
  209. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/3.jpg'); " ></div>
  210. </div>
  211. <div class="showcaseElement" style='display: none '>
  212. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/5.jpg'); " ></div>
  213. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/5.jpg'); " ></div>
  214. </div>
  215. <div class="showcaseElement" style='display: none '>
  216. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/8.jpg'); " ></div>
  217. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/8.jpg'); " ></div>
  218. </div>
  219. <div class="showcaseElement" style='display: none '>
  220. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/1.jpg'); " ></div>
  221. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/1.jpg'); " ></div>
  222. </div>
  223. <div class="showcaseElement" style='display: none '>
  224. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/2.jpg'); " ></div>
  225. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/2.jpg'); " ></div>
  226. </div>
  227. <video class="showcaseElement cover" style='display: none ' preload="none"
  228. class="cover">
  229. <source src="https://steamcdn-a.akamaihd.net/steam/apps/256746530/movie480.webm" type="video/webm">
  230. </video>
  231. </div>
  232. <div class="showcaseElement" style='display: none '>
  233. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/7.jpg'); " ></div>
  234. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/7.jpg'); " ></div>
  235. </div>
  236. <div class="showcaseElement" style='display: none '>
  237. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/4.jpg'); " ></div>
  238. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/4.jpg'); " ></div>
  239. </div>
  240. <div class="showcaseElement" style='display: none '>
  241. <div class="cover blur" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/6.jpg'); " ></div>
  242. <div class="cover" lazy="true" lazy-style ="background-image: url('/images/showcase/spoxel/6.jpg'); " ></div>
  243. </div>
  244. <div class="responsiveWidth" id="engineDescription">
  245. jMonkeyEngine is a modern developer friendly game engine written primarily in Java.
  246. <br />
  247. Its minimalistic and code first approach makes it perfect for developers who want the support of a game engine
  248. while retaining full control over their code with the ability to extend and adapt the engine to their workflow.
  249. <br />
  250. <br />
  251. <br />
  252. <a href="/start/"><button id="startbtn" class="highlightedCl" ><i class="fas fa-rocket"></i> Get Started </button></a>
  253. <a href="/#features" title="overview"><button id="startbtn" class="highlightedCl"><i class="fas fa-question-circle" style="padding:0"></i></button></a>
  254. <br />
  255. <br />
  256. </div>
  257. <div class="responsiveWidth" >
  258. <div id="gameDescription" >
  259. <h2><i class="far fa-images" ></i> Spoxel powered by jMonkeyEngine</h2>
  260. Explore, customize, and build across the world of Spoxel as you fight the otherworlders who have subjugated the land and forced the grounders below the surface. Use runes to construct custom powerful …
  261. <br />
  262. <a class="readMore" href="/showcase/spoxel/#showcase">See game page </a>
  263. </div>
  264. </div>
  265. </section>
  266. <br/>
  267. <section class="message list vlist">
  268. <div>
  269. <blockquote class="list vlist responsive">
  270. <span id="backerMessage">-</span>
  271. <i><a rel='noopener nofollow noreferrer' target="_blank" id="backerMessageName">-</a> </i>
  272. </blockquote>
  273. <a href="https://opencollective.com/jmonkeyengine">Become a
  274. backer and leave a message...</a>
  275. </div>
  276. </section>
  277. <br/>
  278. <a id="content"></a>
  279. <section class="full responsiveWidth">
  280. <article>
  281. <h1 >
  282. <i class="fas fa-paragraph useless"></i>
  283. <a href="/tutorials/grizeldi-pbr-tutorials/pbr_tutorial2/">Grizeldi&#39;s PBR Tutorial #2 - What are Light Probes?</a></h1>
  284. <div class="content">
  285. <span>
  286. <h3 id="second-part-of-my-tutorial-series-in-which-i-explain-how-to-use-jmonkeyengines-physically-based-rendering-pipeline-in-this-part-we-answer-the-question-what-are-the-light-probes-and-why-do-we-need-them">Second part of my tutorial series in which I explain how to use jmonkeyengine&rsquo;s Physically Based Rendering pipeline. In this part we answer the question what are the light probes and why do we need them.</h3>
  287. <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
  288. <iframe src="https://www.youtube.com/embed/6isyfPudDfc" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" allowfullscreen title="YouTube Video"></iframe>
  289. </div>
  290. </span>
  291. <nav>
  292. <ul class="tags smaller">
  293. <h3 class="tags">Tags</h3>
  294. <li><a class="pbr" href="/tags/pbr"><i class="fas fa-hashtag"></i>pbr</a></li>
  295. <li><a class="graphics" href="/tags/graphics"><i class="fas fa-hashtag"></i>graphics</a></li>
  296. <li><a class="tutorials" href="/tags/tutorials"><i class="fas fa-hashtag"></i>tutorials</a></li>
  297. <li><a class="blog" href="/tags/blog"><i class="fas fa-hashtag"></i>blog</a></li>
  298. </ul>
  299. <ul class="authors smaller">
  300. <h3 class="authors">Authors</h3>
  301. <li><a class="grizeldi" href="/authors/grizeldi"><i class="fas fa-at"></i>grizeldi</a></li>
  302. </ul>
  303. <ul class="postedDate smaller">
  304. <h3 class="postedDate">Date</h3>
  305. <li><time datetime="2019-10-16 08:00:00 &#43;0000 UTC"><i class="fas fa-calendar"></i>16 October 2019</time> </li>
  306. </ul>
  307. <ul class="share">
  308. <h3 class="share">Share</h3>
  309. <li>
  310. <button><a href="https://twitter.com/share?ref_src=twsrc%5Etfw&text=Second%20part%20of%20my%20tutorial%20series%20in%20which%20I%20explain%20how%20to%20use%20jmonkeyengine%e2%80%99s%20Physically%20Based%20Rendering%20pipeline.%20In%20this%20part%20we%20answer%20the%20%e2%80%a6 " >
  311. <i class="fab fa-twitter-square"></i> Share on Twitter</a></button></li>
  312. </ul>
  313. </nav>
  314. </div>
  315. </article>
  316. </section>
  317. <section class="full responsiveWidth">
  318. <article>
  319. <h1 id="comments"><i class="useless fas fa-comments"></i> Comments</h1>
  320. <div class="content" id='discourse-comments'></div>
  321. <script type="text/javascript">
  322. var eurl=window.location.href ;
  323. eurl=eurl.split("#")[0];
  324. eurl=eurl.split("?")[0];
  325. eurl=eurl.trim();
  326. if(eurl.endsWith("/index.html"))eurl=eurl.substring(0,eurl.length-"/index.html".length).trim();
  327. if(eurl.charAt(eurl.length-1)=="/") eurl=eurl.substring(0,eurl.length-1);
  328. if(eurl.startsWith("http://")) eurl="https://"+eurl.substring("http://".length);
  329. if(eurl.endsWith("/communitylog/new-website")){
  330. eurl+="/#content";
  331. }
  332. DiscourseEmbed = {
  333. discourseUrl: 'https://hub.jmonkeyengine.org/',
  334. discourseEmbedUrl: eurl
  335. };
  336. (function() {
  337. var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
  338. d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
  339. (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
  340. })();
  341. </script>
  342. </article>
  343. </section>
  344. </main>
  345. <footer>
  346. © 2020 jMonkeyEngine.
  347. All other trademarks, logos and featured content are property of their respective owners.
  348. <br />
  349. <a title="Github repo" rel='noopener nofollow noreferrer' target="_blank"
  350. href="https://github.com/jMonkeyEngine/jmonkeyengine-website">
  351. <i class="fab fa-github"></i> Source on Github
  352. </a>
  353. |
  354. <a title="Report issue" rel='noopener nofollow noreferrer' target="_blank"
  355. href="https://github.com/jMonkeyEngine/jmonkeyengine-website/issues">
  356. <i class="fas fa-bug"></i> Report an issue
  357. </a>
  358. <br />
  359. <br />
  360. Website designed and developed by
  361. <a href="https://github.com/riccardobl">Riccardo Balbo</a>
  362. for the jMonkeyEngine's Community.
  363. </footer>
  364. <div id="poweredBy" >
  365. <a rel='noopener nofollow noreferrer' target="_blank" href="https://www.macstadium.com/">
  366. <img src="/images/macstadium-logo.png" />
  367. </a>
  368. <a rel='noopener nofollow noreferrer' target="_blank" href="https://www.java.com/">
  369. <img src="/images/java-logo.png" />
  370. </a>
  371. <a rel='noopener nofollow noreferrer' target="_blank" href="https://opengl.org/">
  372. <img src="/images/opengl-logo.png" />
  373. </a>
  374. </div>
  375. </body>
  376. </html>