Difference between revisions of "Cube map"

From polycount
Jump to: navigation, search
m (Throttlekitty moved page CubeMap to Cube map: Convert old>new space and case.)
(→‎Cubemap Seams: Clamp link)
 
(23 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
<!-- ## page was renamed from Cube Map -->
 
−
= Cube Map =
 
−
 
 
A cubemap is six images that are mapped onto a cube, creating a 360&#0176; panorama. Cubemaps are supported natively in graphics hardware so they're really quick to transform and render, because of this there's a unified method for rendering them in games.  
 
A cubemap is six images that are mapped onto a cube, creating a 360&#0176; panorama. Cubemaps are supported natively in graphics hardware so they're really quick to transform and render, because of this there's a unified method for rendering them in games.  
  
Line 7: Line 4:
  
 
{| border="1" cellpadding="2" cellspacing="0"
 
{| border="1" cellpadding="2" cellspacing="0"
−
| [[Image:CubeMap$cubemap_Sorsele_humus.jpg}}
+
| [[Image:cubemap_Sorsele_humus.jpg]]
 
|-
 
|-
−
| A cubemap in horizontal-cross format.<<BR>><span style="font-size: smaller">Image by [http://www.humus.name Emil 'Humus' Persson]</span>
+
| A cubemap in horizontal-cross format. <span style="font-size: smaller">Image by [http://www.humus.name Emil 'Humus' Persson]</span>
 
|}
 
|}
  
Line 21: Line 18:
 
When used for reflections, the reflection cubemap is usually centered on the mesh object. The viewing angle bounces off the mesh surface at an angle opposite to the surface normals, so it points to particular parts of the cube map.  
 
When used for reflections, the reflection cubemap is usually centered on the mesh object. The viewing angle bounces off the mesh surface at an angle opposite to the surface normals, so it points to particular parts of the cube map.  
  
−
Cubemaps can also be used for soft ambient-occlusion-like environment lighting, by using a [[Diffusely Convolved Cube Map|diffusely convolved cubemap]].
+
Cubemaps can also be used for soft ambient-occlusion-like environment lighting, by using a [[Diffusely convolved cube map|diffusely convolved cubemap]].
 +
 
 +
Another method is a [[Spherical environment map]], which maps a single image to use as a reflection similar to the behavior of a [[Billboard]].
  
 
== Creating Cubemaps ==
 
== Creating Cubemaps ==
Line 79: Line 78:
 
This distortion becomes more obvious when you view it at any other angle, other than from the center of a cube.  
 
This distortion becomes more obvious when you view it at any other angle, other than from the center of a cube.  
  
−
{| border="1" cellpadding="2" cellspacing="0"
+
[[Image:cubemap_angular_distortion.jpg|left|thumb|600px|A cubemap shows its distortion along the edges of each bitmap. Image by [http://ericchadwick.com Eric Chadwick].]]
−
|-
+
 
−
|}
+
[[Image:cubemap_from_center.jpg|left|thumb|600px|The distortion disappears when viewed from the center of the cube. Image by [http://ericchadwick.com Eric Chadwick].]]
 +
 
 +
[[Image:cubemap_off_center.jpg|left|thumb|600px|The cube becomes obvious if viewed away from the center. Image by [http://ericchadwick.com Eric Chadwick].]]
 +
<br clear="all"/>
  
 
=== Cube Map Formats ===
 
=== Cube Map Formats ===
Line 89: Line 91:
  
 
=== 3ds Max ===
 
=== 3ds Max ===
−
There are two main ways to create cubemaps in 3ds Max:
+
There are multiple ways to create cubemaps in 3ds Max.
 +
 
 +
 
 
# [[#Metal Bump9|Metal Bump9]] ... saves directly into DDS cubemap format, but it's limited to 256x256 and you can't set the [[DDS]] compression format (it always uses ARGB, which is uncompressed).
 
# [[#Metal Bump9|Metal Bump9]] ... saves directly into DDS cubemap format, but it's limited to 256x256 and you can't set the [[DDS]] compression format (it always uses ARGB, which is uncompressed).
−
# [[#Reflect/Refract Map|Reflect/Refract Map]] ... more steps, but you're not limited to a particular resolution or format.
+
# [[#Reflect/Refract Map|Reflect/Refract Map]] ... more steps, but you're not limited to a particular resolution or format. However, does not support more than 24bit color, you can't output HDR with it. Also V-Ray does not support the Reflect/Refract map.
 +
# [[#Create Six Cameras|Create six cameras]] ... a lot more work, but you can render HDR output, and use any renderer you wish. Here's a zip file with the six cameras: [http://www.ericchadwick.com/examples/files/cameras_six_for_rendering_cube_views.zip cameras_six_for_rendering_cube_views.zip]
  
 
3ds Max can display cubemap reflections in real-time if you use the DDS cubemap format and a DirectX Shader material.
 
3ds Max can display cubemap reflections in real-time if you use the DDS cubemap format and a DirectX Shader material.
Line 114: Line 119:
 
# Press ''Pick Object and Render Maps'' and select the viewpoint object.  
 
# Press ''Pick Object and Render Maps'' and select the viewpoint object.  
  
−
The six rendered bitmaps will automatically be loaded into the Reflect/Refect map, or you can convert them into a DDS cubemap with <code><nowiki>Dxtex</nowiki></code> or another tool.
+
The six rendered bitmaps will automatically be loaded into the Reflect/Refect map, or you can convert them into a DDS cubemap with Dxtex or another tool.
  
−
 
−
<pre><nowiki>#!wiki caution
 
 
Warning: The render cannot be canceled once the object is picked, so save your Max file before rendering, in case Max freezes!
 
Warning: The render cannot be canceled once the object is picked, so save your Max file before rendering, in case Max freezes!
−
</nowiki></pre>
 
  
 +
* [https://judegodin.wordpress.com/2011/12/06/how-the-hell-do-i-make-a-cubemap/ How the Hell do I make a cubemap with my own art?] by [https://judegodin.wordpress.com Jude Godin] walks through the process step-by-step, to create a hand-painted cubemap.
 +
 +
==== Create Six Cameras ====
 +
* Here's a zip file with the six cameras: [http://www.ericchadwick.com/examples/files/cameras_six_for_rendering_cube_views.zip cameras_six_for_rendering_cube_views.zip]
 +
* Adaptive renderers may create seams, because the lighting calculations are done individually for each camera. You may be able to solve this by pre-caching the lighting passes. V-Ray can render a single panoramic camera, which can be converted into cube faces, see [http://renderstuff.com/creating-virtual-360-panorama-cg-tutorial/ 360 panorama in 3ds Max tutorial].
 +
 +
==== V-Ray Cube Map Rendering ====
 +
You can use V-Ray's [http://docs.chaosgroup.com/display/VRAY3/Camera#Camera-CameraType "Box" camera type] to render a cubemap with no lighting seams. Because V-Ray uses Global Illumination, if you try to use six cameras it will add seams between the six separate lighting solutions.
 +
 +
The tutorial: '''[http://www.pixelsonic.com/2011/04/360%C2%B0-in-3ds-max-with-vray-2/ 360° in 3Ds Max with VRay – Pixelsonic]''' explains how to use the Spherical camera type, but this will create blurry/smeared poles, which look terrible when converted into cube faces. Their example panorama avoids the errors because it has a flat-colored floor. But if there was a pattern there (grass, carpet, etc.) it would show the poles to be very obviously stretched.
 +
 +
 +
To render seamless cubemaps in V-Ray:
 +
# Place a VRayPhysicalCamera in your scene, pointing where you want the cube's Front to be.
 +
# Render Setup:
 +
#* Output Size = 3x wide, 4x tall. For example, if you want 1024x1024 for each cube face, then render 3072x4096.
 +
#* Save File = set your filename, location, format. This is for the vertical cubecross format, which V-Ray creates.
 +
#* V-Ray tab, V-Ray:: Camera, Type = Box, Override FOV = 90.
 +
# Render.
 +
 +
 +
If you need to convert the vertical cubecross into six cube faces, you can use the Material Editor to do it:
 +
# Load the cubecross bitmap in the Material Editor.
 +
# U Tiling = 0.33333
 +
# V Tiling = 0.25
 +
# Turn on Auto Key to animate the following:
 +
#* To see the +X cube face, at frame 0... U Offset = 1.0, V Offset = -0.5, W Angle = 0.
 +
#* To see the -X cube face, at frame 1... U Offset -1.0, V Offset -0.5, W Angle 0.
 +
#* To see the +Y cube face, at frame 2... U Offset 0, V Offset 1.5, W Angle 180.
 +
#* To see the -Y cube face, at frame 3... U Offset 0, V Offset -0.5, W Angle 180.
 +
#* To see the +Z cube face, at frame 4... U Offset 0, V Offset -1.5, W Angle 180.
 +
#* To see the -Z cube face, at frame 5... U Offset 0, V Offset -0.5, W Angle 0.
 +
# Right-click on the sample image, Render Map, Range = 0-5, Dimensions = (choose your resolution), Files = (set file prefix, location, format).
 +
# Render.
 +
#* This will create six perfectly-seamless cube faces.
 +
#* This animation setup will work with any resolution cubecross. Simply replace the bitmap, and re-render the same animation.
 +
 +
==== 3ds Max to Unity ====
 +
* [http://www.pixelenvision.com/2242/maxscript-vray-cubemap-generator-for-unity/ Maxscript – Vray Cubemap Generator for Unity] creates a default 3ds Max camera at the origin and renders six cubemap faces, named to match Unity's convention.
  
−
=== [[DxTex]] ===
+
=== DxTex ===
 
Microsoft's DxTex offers a way to create a single DDS cube bitmap from six bitmaps. DxTex is automatically installed when you install the [http://msdn.microsoft.com/en-us/directx/aa937788.aspx DirectX SDK]. Once installed it will be found in the folder (SDK root)\Utilities\Bin\x86 or x64. Use the x86 version unless you're running a 64bit OS. There's also a DDS plugin for Photoshop in the SDK, it expects a 1x6 layout in Photoshop:
 
Microsoft's DxTex offers a way to create a single DDS cube bitmap from six bitmaps. DxTex is automatically installed when you install the [http://msdn.microsoft.com/en-us/directx/aa937788.aspx DirectX SDK]. Once installed it will be found in the folder (SDK root)\Utilities\Bin\x86 or x64. Use the x86 version unless you're running a 64bit OS. There's also a DDS plugin for Photoshop in the SDK, it expects a 1x6 layout in Photoshop:
 
* +X
 
* +X
Line 139: Line 180:
 
# For each of the other cube faces, select the View->Cube Map Face menu item and select a face from the list that appears.
 
# For each of the other cube faces, select the View->Cube Map Face menu item and select a face from the list that appears.
 
# Select the File->Open Onto This Cubemap Face... menu item and select a texture to open from the dialog that pops up.
 
# Select the File->Open Onto This Cubemap Face... menu item and select a texture to open from the dialog that pops up.
−
 
−
=== Maya ===
 
−
The easiest way to render a Maya scene into a cubemap is to use six cameras, then stitch the six images together into a cubemap.
 
−
 
−
Workflow tips can be found in the Polycount thread [[http://www.polycount.com/forum/showthread.php?t=75213|[Maya 2009] how to render an environment map?]].
 
−
 
−
=== Photoshop ===
 
−
The [http://developer.nvidia.com/nvidia-texture-tools-adobe-photoshop NVIDIA DDS plugin for Photoshop] is one way to create DDS cubemaps. It expects you to lay out the faces of the cubemap horizontally: +X -X +Y -Y +Z -Z. In 3ds Max terms this is: RT, LF, UP, DN, BK, FR.
 
−
 
−
The DDS format does not actually store the images in a horizontal layout... each image is stored as a separate layer or slice in the DDS file. The Nvidia plugin merely lays them out horizontally to make the cubemap easier to edit in Photoshop.
 
  
 
=== Hugin ===
 
=== Hugin ===
Line 173: Line 204:
 
# Stitch!
 
# Stitch!
 
# Use [[XnView]] to convert to low dynamic range (Gamma 1.66 seems good).
 
# Use [[XnView]] to convert to low dynamic range (Gamma 1.66 seems good).
 +
 +
=== Lys ===
 +
"Lys is an ultra-fast GPU powered solution that sets the standard for generating Radiance, Irradiance and Specular textures from panoramic, Sphere or 2d cube map cross source textures for use with HDR Image Based Lighting."
 +
 +
* [http://polycount.com/discussion/148953 Lys 1.0 Released!]
 +
 +
[[image:Lys_axis_rotation_3_855px.jpg|left|thumb|600px|Image by [http://www.metalliandy.com/ Andy "metalliandy Davies].]]<br clear="all"/>
 +
 +
=== Maya ===
 +
The easiest way to render a Maya scene into a cubemap is to use six cameras, then stitch the six images together into a cubemap.
 +
 +
Workflow tips can be found in the Polycount thread [[http://polycount.com/discussion/75213|[Maya 2009] how to render an environment map?]].
 +
 +
=== Photoshop ===
 +
The [http://developer.nvidia.com/nvidia-texture-tools-adobe-photoshop NVIDIA DDS plugin for Photoshop] is one way to create DDS cubemaps. It expects you to lay out the faces of the cubemap horizontally: +X -X +Y -Y +Z -Z. In 3ds Max terms this is: RT, LF, UP, DN, BK, FR.
 +
 +
The DDS format does not actually store the images in a horizontal layout... each image is stored as a separate layer or slice in the DDS file. The Nvidia plugin merely lays them out horizontally to make the cubemap easier to edit in Photoshop.
 +
 +
 +
=== Unreal Engine ===
 +
* [http://polycount.com/discussion/139823 Baking cubemaps inside UE4]
  
 
== Cubemap Seams ==
 
== Cubemap Seams ==
 
Cubemaps can show seams along the edges of the cube if they aren't mapped properly.  
 
Cubemaps can show seams along the edges of the cube if they aren't mapped properly.  
  
−
When a cubemap is rendered automatically in graphics hardware by a game engine, it will be seamless because it uses the '''Clamp''' uv address mode.  
+
When a cubemap is rendered automatically in graphics hardware by a game engine, it will be seamless because it uses the [[Texture_Coordinates#UV_Address_Modes|'''Clamp''']] uv address mode.  
  
 
However if an artist manually creates a cube mesh and maps the six bitmaps onto it, usually this will cause seams from texture filtering. By default most materials use the '''Wrap''' uv address mode, which allows a texture to tile across a mesh. With a cubemap however this causes a sliver of the opposite side of each texture to be filtered into each edge. If your material has the option to use Clamp instead of Wrap, this will remove the seams.
 
However if an artist manually creates a cube mesh and maps the six bitmaps onto it, usually this will cause seams from texture filtering. By default most materials use the '''Wrap''' uv address mode, which allows a texture to tile across a mesh. With a cubemap however this causes a sliver of the opposite side of each texture to be filtered into each edge. If your material has the option to use Clamp instead of Wrap, this will remove the seams.
Line 187: Line 239:
  
 
{| border="1" cellpadding="2" cellspacing="0"
 
{| border="1" cellpadding="2" cellspacing="0"
−
| [[attachment:cubemap_powervr_seams.jpg|Media:CubeMap/attachments/cubemap_powervr_seams.jpg
+
| [[image:cubemap_powervr_seams.jpg]]
−
| width=500}}
+
−
| [[attachment:cubemap_powervr_borders.jpg|{{attachment:cubemap_powervr_borders.jpg
+
 
|-
 
|-
−
| Seams on the edges of a cubemap.<<BR>><span style="font-size: smaller">Image by [http://www.imgtec.com/powervr/insider/ PowerVR]</span>
+
| Seams on the edges of a cubemap. <span style="font-size: smaller">Image by [http://www.imgtec.com/powervr/insider/ PowerVR]</span>
 +
|}
 +
{| border="1" cellpadding="2" cellspacing="0"
 +
| [[image:cubemap_powervr_borders.jpg]]
 +
|-
 +
| Seams fixed via method 3. <span style="font-size: smaller">Image by [http://www.imgtec.com/powervr/insider/ PowerVR]</span>
 
|}
 
|}
  
−
== Links ==
+
== Resources ==
−
* [[Category:EnvironmentSkies]] - Topics about creating skies for environments in games.
+
* [http://polycount.com/discussion/96380 Big cube map pack] free cubemaps by [http://www.humus.name Emil 'Humus' Persson] and [http://www.kostas.se/ Kostas 'kodde' Gialitakis]
−
* [http://www.polycount.com/forum/showthread.php?t=96380 Big cube map pack] free cubemaps by [http://www.humus.name Emil 'Humus' Persson] and [http://www.kostas.se/ Kostas 'kodde' Gialitakis]
+
* [http://cgtextures.com/textures.php?t=browse&q=23740 CG Textures - Panoramic Skies] free sky panoramas.
−
* [http://www.zdepth.ch/tutorial/an-introduction-to-cube-mapping/ An introduction to cubemaps - Tutorial] by [http://www.zdepth.ch/about/ Zeller Samuel]<<BR>>A great introduction to cubemaps.
+
* [http://www.philohome.com/skycollec/skycollec.htm Philo's Sky Collection] free sky panoramas.
−
* [http://www.cgtextures.com/content.php?action=tutorial&name=cubemaps Cubemaps Tutorial] by CGTextures.com<<BR>>Tutorial using Photoshop, NVIDIA's Photoshop plugin, and [[CubeMapGen]] to convert cubemaps into various layouts.
+
* [https://doschdesign.com/products/hdri?subrubrik=67 Dosch Design HDR Sets] ($) HDR sky panoramas.
−
* [[Diffusely Convolved Cube Map]] wiki page describes how to downsample cubemaps to use for lighting.
+
* [http://hyperfocal.vismasters.com/catalog/products/hyperfocal-hdri-skies_3611.aspx Hyperfocal Design: Hyperfocal HDRI Skies] (S) HDR sky panoramas.
−
* [http://www.polycount.com/forum/showthread.php?t=82620 Correct uvmapping for a cub to preview cubemap] on the Polycount forum.
+
* [http://www.marlinstudios.com/products/pano/pano.htm Marlin Studios Panoramica] ($) sky panoramas.
 +
* [http://www.schloerb.com/Dreamscape2/ Johannes Schlörb: Dreamscape 2.1 Immersive Sky Backgrounds] ($) CG sky panoramas.
 +
* [http://www.1000skies.com/ 1000 Skies] ($) sky panoramas.
 +
* [http://vterrain.org/Atmosphere/ Virtual Terrain Project: Sky / Atmospheric Rendering] has links to sky texture sites.
 +
 
 +
== Tutorials ==
 +
* [https://judegodin.wordpress.com/2011/12/06/how-the-hell-do-i-make-a-cubemap/ How the Hell do I make a cubemap with my own art?] by [http://judegodin.wordpress.com Jude Godin]
 +
* [http://polycount.com/discussion/147893 Abstract skybox creation] on the Polycount forum.
 +
* [[Diffusely convolved cube map]] wiki page describes how to downsample cubemaps to use for lighting.
 +
* [http://www.zdepth.ch/tutorial/an-introduction-to-cube-mapping/ An introduction to cubemaps - Tutorial] by [http://www.zdepth.ch/about/ Zeller Samuel]. A great introduction to cubemaps.
 +
* [http://www.cgtextures.com/content.php?action=tutorial&name=cubemaps Cubemaps Tutorial] by CGTextures.com. Tutorial using Photoshop, NVIDIA's Photoshop plugin, and [[CubeMapGen]] to convert cubemaps into various layouts.
 +
* [http://polycount.com/discussion/82620 Correct uvmapping for a cub to preview cubemap] on the Polycount forum.
 +
* [http://vterrain.org/Atmosphere/ Virtual Terrain Project: Sky / Atmospheric Rendering] has many links to sky rendering resources.
 +
* [http://polycount.com/discussion/45543 360 HDR skies for sale?] from the [http://polycount.com/forum Polycount forums] has a tutorial and links about photographing HDR skies.
 +
* [http://www.outpt.co.uk/how-to-create-a-terragen-2-skybox/ How to: Create a Terragen 2 Skybox] by ''[http://www.outpt.co.uk/about/ Outpt]''.
 +
* [https://www.youtube.com/watch?&v=qU0hdaFARQo 3dmotive.com - Creating a Skydome] is a tutorial for converting a latlong sky into a spheremap layout and mapping it to a dome mesh with Photoshop and 3ds Max. [https://www.3dmotive.com/freebies More free tutorials here].
 +
* [http://polycount.com/discussion/68600 Skymap workflow] by ''[http://polycount.com/profile/divi divi]'' is a quick tutorial about converting a latlong sky into a square dome-like layout that uses all the texture space. [[attachment:Skymap_workflow.pdf|PDF here]]
 +
* [http://www.outpt.co.uk/how-to-convert-a-skybox-to-a-skydome/ How to: Convert a Skybox to a Skydome] by ''[http://www.outpt.co.uk/about/ Outpt]'' is an in-depth tutorial about converting a cubemap into a latlong image with [http://developer.amd.com/gpu/cubemapgen/pages/default.aspx CubeMapGen], HDRShop, Photoshop, and Unreal.
 +
* [http://polycount.com/discussion/74503 Environment Cube Maps: HDR VS LDR] thread on the Polycount forum.
  
 
== Software ==
 
== Software ==
 +
* [http://www.outerspace-software.com/bixorama.html Bixorama] ($) panorama conversion utility (warning... conversions are aliased and jaggy).
 
* [http://developer.amd.com/gpu/cubemapgen/pages/default.aspx CubeMapGen] from AMD.
 
* [http://developer.amd.com/gpu/cubemapgen/pages/default.aspx CubeMapGen] from AMD.
 
* [http://seblagarde.wordpress.com/2012/06/10/amd-cubemapgen-for-physically-based-rendering/ Cubemapgen physically based rendering mod] by Sébastien Lagarde.
 
* [http://seblagarde.wordpress.com/2012/06/10/amd-cubemapgen-for-physically-based-rendering/ Cubemapgen physically based rendering mod] by Sébastien Lagarde.
 
* [http://msdn.microsoft.com/en-us/directx/aa937788.aspx DirectX SDK] has the DxTex tool from Microsoft.
 
* [http://msdn.microsoft.com/en-us/directx/aa937788.aspx DirectX SDK] has the DxTex tool from Microsoft.
 
* [http://developer.nvidia.com/nvidia-texture-tools-adobe-photoshop DDS plugin for Photoshop] from NVIDIA.
 
* [http://developer.nvidia.com/nvidia-texture-tools-adobe-photoshop DDS plugin for Photoshop] from NVIDIA.
−
* [http://www.hdrshop.com/ HDR Shop] ($) older version is free for non-commercial use.
 
−
* [http://www.outerspace-software.com/bixorama.html Bixorama] ($) panorama conversion utility (warning... conversions are aliased and jaggy).
 
−
* [http://wiki.alioth.net/index.php/Planettool Planettool] command line conversion tool.
 
 
* [http://www.flamingpear.com/flexify.html Flexify] ($) conversion filter for Photoshop.
 
* [http://www.flamingpear.com/flexify.html Flexify] ($) conversion filter for Photoshop.
−
* [http://wiki.panotools.org/PanoCube PanoCube] ($) conversion tool.
 
−
* [http://hugin.sourceforge.net/ Hugin] stitching and conversion tool. [http://wiki.panotools.org/Extracting_and_inserting_rectilinear_Views#Inserting_cubefaces_again How to convert a cubemap into a panorama].
 
 
* [http://forum.unity3d.com/threads/32849-To-stupid-to-use-Generate-Cubemap-the-right-way Generate Cubemap] conversion tool for Unity
 
* [http://forum.unity3d.com/threads/32849-To-stupid-to-use-Generate-Cubemap-the-right-way Generate Cubemap] conversion tool for Unity
 +
* [http://www.hdrshop.com/ HDR Shop] ($) older version is free for non-commercial use.
 +
* [http://hugin.sourceforge.net/ Hugin] stitching and conversion tool. [http://wiki.panotools.org/Extracting_and_inserting_rectilinear_Views#Inserting_cubefaces_again How to convert a cubemap into a panorama].
 +
* [https://www.knaldtech.com/lys/ Lys] ($) GPU powered solution that generates Radiance, Irradiance and Specular textures from panoramic, Sphere or 2d cube map cross source textures for use with HDR Image Based Lighting.
 +
* [http://ggnome.com/pano2vr Pano2VR] ($) conversion tool, used by CGTextures for all their panoramic conversions.
 +
* [http://wiki.panotools.org/PanoCube PanoCube] ($) conversion tool.
 +
* [http://wiki.alioth.net/index.php/Planettool Planettool] command line conversion tool.
 
* [http://www.skypaint.com/ Skypaint] ($) cube map painting tool that requires Photoshop, Paint Shop Pro, or Photo Paint.
 
* [http://www.skypaint.com/ Skypaint] ($) cube map painting tool that requires Photoshop, Paint Shop Pro, or Photo Paint.
 +
* [http://www.planetside.co.uk/ Terragen] is another popular skydome creation tool.
 +
* [http://www.e-onsoftware.com/products/ Vue] is a popular skydome creation tool.
  
 
----
 
----
−
[[Category:Texturing]] [[Category:TextureTypes]] [[Category:Environment map]]
+
[[Category:TextureFormat]] [[Category:Texturing]] [[Category:Environment]]

Latest revision as of 16:25, 22 August 2018

A cubemap is six images that are mapped onto a cube, creating a 360° panorama. Cubemaps are supported natively in graphics hardware so they're really quick to transform and render, because of this there's a unified method for rendering them in games.


Cubemap Sorsele humus.jpg
A cubemap in horizontal-cross format. Image by Emil 'Humus' Persson

The cube is usually centered on the current viewpoint or camera. This means, when used as a backdrop or skybox it always appears infinitely distant. If you turn on wireframe mode in any 3d engine using a cubemap skybox, you'll see the geometry of the box. In the end it's just a regular mesh object.

Reflections & Lighting

When used for reflections, the reflection cubemap is usually centered on the mesh object. The viewing angle bounces off the mesh surface at an angle opposite to the surface normals, so it points to particular parts of the cube map.

Cubemaps can also be used for soft ambient-occlusion-like environment lighting, by using a diffusely convolved cubemap.

Another method is a Spherical environment map, which maps a single image to use as a reflection similar to the behavior of a Billboard.

Creating Cubemaps

Layouts

Different tools expect different cubemap layouts.

Cubemapgen 3ds Max Maya CryENGINE 3 Unity
+X _RT Left -X
-X _LF Right +X
+Y _UP Top +Y
-Y _DN Bottom -Y
+Z _BK Front (+Z)
-Z _FR Back (-Z)

Angular Distortion

A cube map has to be created with some angular distortion in order to display a seamless panoramic image.

A cube map is always displayed from a viewpoint in the center of a cube mesh. This means the center of each cube face is closer to you than the edges and corners are. To counteract this, a cube map needs angular distortion.

This distortion becomes more obvious when you view it at any other angle, other than from the center of a cube.

A cubemap shows its distortion along the edges of each bitmap. Image by Eric Chadwick.
The distortion disappears when viewed from the center of the cube. Image by Eric Chadwick.
The cube becomes obvious if viewed away from the center. Image by Eric Chadwick.


Cube Map Formats

The bitmaps for each of the six sides need to be square, each needs to be powers-of-two in size (128, 256, 512, etc.), and all six images need to be the same resolution.

Usually for games you store the bitmaps all in one file using DDS or another compressed format, though some editors prefer them stored as six separate bitmaps (then compress them internally).

3ds Max

There are multiple ways to create cubemaps in 3ds Max.


  1. Metal Bump9 ... saves directly into DDS cubemap format, but it's limited to 256x256 and you can't set the DDS compression format (it always uses ARGB, which is uncompressed).
  2. Reflect/Refract Map ... more steps, but you're not limited to a particular resolution or format. However, does not support more than 24bit color, you can't output HDR with it. Also V-Ray does not support the Reflect/Refract map.
  3. Create six cameras ... a lot more work, but you can render HDR output, and use any renderer you wish. Here's a zip file with the six cameras: cameras_six_for_rendering_cube_views.zip

3ds Max can display cubemap reflections in real-time if you use the DDS cubemap format and a DirectX Shader material.

Metal Bump9

  1. Setup a 3D scene you wish to render into a cubemap.
  2. Place some type of object at the viewpoint you wish to render the cubemap from, for example a camera or a point helper or a geometric object. The orientation of the object doesn't matter, and the object itself won't be rendered into the cubemap.
  3. Create a Standard material, open the DirectX Manager rollout, and change the None flyout to Metal Bump9.
  4. Press Pick object and create and select the object.
  5. Choose a name and a location to render to.

3ds Max will render it directly into DDS cubemap format, but it's limited to 256x256, and you can't set the DDS compression (it uses ARGB).

Reflect/Refract Map

  1. Setup a 3D scene you wish to render into a cubemap.
  2. Place some type of object at the viewpoint you wish to render the cubemap from, for example a camera or a point helper or a geometric object. The object itself won't be rendered into the cubemap.
  3. Setup your rendering options (texture filtering, anti-aliasing, etc.).
  4. Create a Standard material and load a Reflect/Refract map into any slot.
  5. In the map, set Source = From File.
  6. Set the Size spinner to the resolution you want to render. If you're going to use the cubemap for a game it should be a powers-of-two number (128, 256, 512, etc.).
  7. Use the Render Cubic Map Files / To File: button to set the prefix name and bitmap format to render to.
  8. Press Pick Object and Render Maps and select the viewpoint object.

The six rendered bitmaps will automatically be loaded into the Reflect/Refect map, or you can convert them into a DDS cubemap with Dxtex or another tool.

Warning: The render cannot be canceled once the object is picked, so save your Max file before rendering, in case Max freezes!

Create Six Cameras

  • Here's a zip file with the six cameras: cameras_six_for_rendering_cube_views.zip
  • Adaptive renderers may create seams, because the lighting calculations are done individually for each camera. You may be able to solve this by pre-caching the lighting passes. V-Ray can render a single panoramic camera, which can be converted into cube faces, see 360 panorama in 3ds Max tutorial.

V-Ray Cube Map Rendering

You can use V-Ray's "Box" camera type to render a cubemap with no lighting seams. Because V-Ray uses Global Illumination, if you try to use six cameras it will add seams between the six separate lighting solutions.

The tutorial: 360° in 3Ds Max with VRay – Pixelsonic explains how to use the Spherical camera type, but this will create blurry/smeared poles, which look terrible when converted into cube faces. Their example panorama avoids the errors because it has a flat-colored floor. But if there was a pattern there (grass, carpet, etc.) it would show the poles to be very obviously stretched.


To render seamless cubemaps in V-Ray:

  1. Place a VRayPhysicalCamera in your scene, pointing where you want the cube's Front to be.
  2. Render Setup:
    • Output Size = 3x wide, 4x tall. For example, if you want 1024x1024 for each cube face, then render 3072x4096.
    • Save File = set your filename, location, format. This is for the vertical cubecross format, which V-Ray creates.
    • V-Ray tab, V-Ray:: Camera, Type = Box, Override FOV = 90.
  3. Render.


If you need to convert the vertical cubecross into six cube faces, you can use the Material Editor to do it:

  1. Load the cubecross bitmap in the Material Editor.
  2. U Tiling = 0.33333
  3. V Tiling = 0.25
  4. Turn on Auto Key to animate the following:
    • To see the +X cube face, at frame 0... U Offset = 1.0, V Offset = -0.5, W Angle = 0.
    • To see the -X cube face, at frame 1... U Offset -1.0, V Offset -0.5, W Angle 0.
    • To see the +Y cube face, at frame 2... U Offset 0, V Offset 1.5, W Angle 180.
    • To see the -Y cube face, at frame 3... U Offset 0, V Offset -0.5, W Angle 180.
    • To see the +Z cube face, at frame 4... U Offset 0, V Offset -1.5, W Angle 180.
    • To see the -Z cube face, at frame 5... U Offset 0, V Offset -0.5, W Angle 0.
  5. Right-click on the sample image, Render Map, Range = 0-5, Dimensions = (choose your resolution), Files = (set file prefix, location, format).
  6. Render.
    • This will create six perfectly-seamless cube faces.
    • This animation setup will work with any resolution cubecross. Simply replace the bitmap, and re-render the same animation.

3ds Max to Unity

DxTex

Microsoft's DxTex offers a way to create a single DDS cube bitmap from six bitmaps. DxTex is automatically installed when you install the DirectX SDK. Once installed it will be found in the folder (SDK root)\Utilities\Bin\x86 or x64. Use the x86 version unless you're running a 64bit OS. There's also a DDS plugin for Photoshop in the SDK, it expects a 1x6 layout in Photoshop:

  • +X
  • -X
  • +Y
  • -Y
  • +Z
  • -Z

The DDS format does not actually store the images in a horizontal layout... each image is stored as a separate layer or slice in the DDS file. The DxTex plugin merely lays them out horizontally to make the cubemap easier to edit in Photoshop.

How to compile a DDS cubemap in DxTex:

  1. Open an existing texture by selecting the File -> Open... menu item.
  2. Select the Format -> Make Into Cube Map... menu item.
  3. The current texture will occupy one face of the cube map. From the dialog that pops up, select which face you want the texture to occupy, and click OK.
  4. For each of the other cube faces, select the View->Cube Map Face menu item and select a face from the list that appears.
  5. Select the File->Open Onto This Cubemap Face... menu item and select a texture to open from the dialog that pops up.

Hugin

Hugin can be used to convert a 3ds Max cube map into a rectilinear panorama:

  1. Make sure the six cube map image files are in TIF format. Hugin doesn't load TGA.
  2. Start Hugin.
  3. "Images" tab.
  4. Load the six images.
  5. Yaw and Pitch: 
1.a. _BK = Yaw 0, Pitch 0
1.a. _DN = Yaw 0, Pitch -90
1.a. _FR = Yaw 180, Pitch 0
1.a. _LF = Yaw -90, Pitch 0
1.a. _RT = Yaw 90, Pitch 0
1.a. _UP = Yaw 0, Pitch 90
  1. Feature Matching = Align image stack.
  2. "Camera and Lens" tab.
  3. Lens type = Normal rectilinear.
  4. Degrees of view = 90.
  5. "Stitcher" tab. 
1/ Projection = Equirectangular.
  1. Canvas size = 4x the width of a single cube map image, 2x the height.
  2. Panorama Outputs = High dynamic range.
  3. Stitch!
  4. Use XnView to convert to low dynamic range (Gamma 1.66 seems good).

Lys

"Lys is an ultra-fast GPU powered solution that sets the standard for generating Radiance, Irradiance and Specular textures from panoramic, Sphere or 2d cube map cross source textures for use with HDR Image Based Lighting."

Image by Andy "metalliandy Davies.

Maya

The easiest way to render a Maya scene into a cubemap is to use six cameras, then stitch the six images together into a cubemap.

Workflow tips can be found in the Polycount thread [[Maya 2009 how to render an environment map?]].

Photoshop

The NVIDIA DDS plugin for Photoshop is one way to create DDS cubemaps. It expects you to lay out the faces of the cubemap horizontally: +X -X +Y -Y +Z -Z. In 3ds Max terms this is: RT, LF, UP, DN, BK, FR.

The DDS format does not actually store the images in a horizontal layout... each image is stored as a separate layer or slice in the DDS file. The Nvidia plugin merely lays them out horizontally to make the cubemap easier to edit in Photoshop.


Unreal Engine

Cubemap Seams

Cubemaps can show seams along the edges of the cube if they aren't mapped properly.

When a cubemap is rendered automatically in graphics hardware by a game engine, it will be seamless because it uses the Clamp uv address mode.

However if an artist manually creates a cube mesh and maps the six bitmaps onto it, usually this will cause seams from texture filtering. By default most materials use the Wrap uv address mode, which allows a texture to tile across a mesh. With a cubemap however this causes a sliver of the opposite side of each texture to be filtered into each edge. If your material has the option to use Clamp instead of Wrap, this will remove the seams.

There are some solutions for this:

  1. Set the texture coordinate address mode to Clamp instead of Wrap. Then the edge pixels will be sampled instead of the opposite side.
  2. 3ds Max doesn't support Wrap mode, but it does have Mirror mode. Use a Multi/Sub-Object material to apply the six cube faces to a Box model, and adjust the bitmap coordinates for each of the six bitmaps: change all four Offset and Tiling spinners to .5, and turn on both Mirror checkboxes.
  3. For each face of the cube: increase the canvas size by a couple pixels all around, copy the edge pixels out a couple times, scale each face bitmap back down to a powers-of-two size, and scale the UVs down a little too. The PowerVR SDK has a tutorial about this in their docs.
Cubemap powervr seams.jpg
Seams on the edges of a cubemap. Image by PowerVR
Cubemap powervr borders.jpg
Seams fixed via method 3. Image by PowerVR

Resources

Tutorials

Software

Retrieved from "http://wiki.polycount.com/w/index.php?title=Cube_map&oldid=8641"
Personal tools
Namespaces

Variants
Actions
Navigation
Tools