%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% % Author: Ismael García Fernández %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %------------------------------------------------------------------- % Formato del documento \documentclass[10pt,a4paper,english,twoside]{book} \usepackage[a4paper]{geometry} \usepackage{color} \usepackage{floatflt} \usepackage{subfigure} \usepackage{listings} \usepackage{url} \ifx\pdfoutput\undefined \usepackage[dvips]{graphicx} \else \usepackage[pdftex]{graphicx} \fi \usepackage{epstopdf} \ifx\pdfoutput\undefined \usepackage[ps2pdf, pagebackref=true, colorlinks=true, linkcolor=blue ]{hyperref} \else \usepackage[pdftex, pagebackref=true, colorlinks=true, linkcolor=blue ]{hyperref} \fi \newcommand{\clearemptydoublepage}{\newpage{\pagestyle{empty}\cleardoublepage}} %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% \begin{document} %------------------------------------------------------------------- \begin{titlepage} \vspace*{1cm} \begin{center} {\huge IBR Billboard Cloud Tree Generator}\\ \vspace*{1cm} {\Huge Documentation}\\ %{\huge{\today}} %\vspace*{1cm} \end{center} \begin{figure}[!hbtp] \centering \includegraphics[scale=0.2]{../figures/gametoolsLogo.png} \end{figure} \vspace*{2cm} \begin{figure}[!hbtp] \centering \includegraphics[scale=0.3]{../figures/chestnutShadowMapping.png} \end{figure} \end{titlepage} %------------------------------------------------------------------- % Índice general del proyecto \clearemptydoublepage \tableofcontents \thispagestyle{plain} \clearemptydoublepage % Índice de figuras del proyecto \setcounter{lofdepth}{2} \listoffigures \thispagestyle{plain} \clearemptydoublepage % Índice de tablas del proyecto %\listoftables %\thispagestyle{plain} %\clearemptydoublepage %------------------------------------------------------------------- %\chapter{User Manual} %User manual... % %\section{Installation} % %Installation... % %\section{Getting Started} % %Getting Started... % %\section{Frequently Asked Questions} % %Frequently Asked Questions... % %\section{Troubleshooting} % %Troubleshooting... \chapter{Reference Manual} %\section{Features} % %Features... \section{Introduction} The \emph{IBR Billboard Cloud Tree Generator} provides a set of tools creating and preview tree 3d models for being used in real-time applications. The generated tree is thus represented by a set of billboards, called billboard cloud. The billboards are built automatically by a clustering algorithm. Unlike classical billboards, the billboards of a billboard cloud are not rotated when the camera moves, thus the expected occlusion and parallax effects are provided. On the other hand, this approach allows the replacement of a large number of leaves by a single semi-transparent quadrilateral, which considerably improves the rendering performance. A billboard cloud well represents the tree from any direction and provides accurate depth values, thus the method is also good for shadow. The billboard cloud decomposes the original object into subsets of patches and replaces each subset by a billboard (See figure \ref{IBRBBCGenToolSteps}). These billboards are fixed and the final image is the composition of their images (See figure \ref{leafClustered}). \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/leafClustered.png} \caption{Billboard image generation.} \label{leafClustered} \end{figure} \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/IBRBBCGenToolSteps.png} \caption{Decomposition of the original leaves model.} \label{IBRBBCGenToolSteps} \end{figure} The method \cite{leafClusterImpostorsEG2005} falls into the class of billboard clouds, but it prepares the billboards automatically and so carefully that the results are satisfactory not only on vehicle scale, but also on human scale, and with some compromises on insect scale as well. Since the billboard cloud model has been proposed to model conventional man-made 3D objects, such as teapots, helicopters, etc., we have to alter their construction to take into account the special geometry of natural phenomena. \begin{figure}[!htbp] \centering \includegraphics[scale=0.20]{../figures/chestnutSample.png} \caption{Visual and speed comparisons of the original polygonal tree and the tree rendered with different number of billboards.} \end{figure} \section{Application components overview} The \emph{IBR Billboard Cloud Tree Generator} has been developed using the Ogre3D graphic engine, being compatible with both, the OpenGL and Direct3D render systems, the other optional dependency is OpenEXR. The system has been tested under Windows but there shouldn't be big problems for making it to work under Linux or Mac platforms. \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/IBRBillboardCloudTreeGenerationToolBlocksDiagram.png} \caption{\emph{IBR Billboard Cloud Tree Generator} standard dependencies.} \label{applicationDependencies} \end{figure} \section{Typical Use Case} Create a tree suitable for real-time rendering must take in care some restrictions, basically the polygon and texture memory used. The sample tree shown \ref{originalDataManagement} has 11291 leaves defined by defined by 112910 faces and 338731 vertices. The trunk of the tree has 46174 faces. Current graphic hardware can't handle a forest using this tree model. In these cases this tool is being necessary. \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/originalDataManagement.png} \caption{Sample polygonal tree decomposed in two models. The leaves model will be processed with the IBR Billboard Cloud Tree Generator.} \label{originalDataManagement} \end{figure} \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/inputAndOutputForIBRBBCGenTool.png} \caption{} \label{inputAndOutputForIBRBBCGenTool} \end{figure} \begin{enumerate} \item The 3d content creator at first have to create a high\-detailed tree with some of the available tools, such as Xfrog or Pov\-Tree. (See \cite{xfrog} and \cite{povtree}). However you can use some of the great Xfrog public plants \cite{xfrogpublicplants} instead. \item Then the high\-detailed tree model should be decomposed in two, the leaves and the trunk models. (See figure \ref{originalDataManagement}) \item The leaves model must be converted into the Ogre3D Mesh file format, there are exporters available for the main 3D DCC, such as Maya or 3ds Max \footnote{Check the Ogre 3D webpage \url{http://www.ogre3d.org} in the \emph{Downloads} / \emph{Tools} section}. \end{enumerate} The trunk model won't be processed with the generator tool and the designer must create a set of levels of detail of the original mesh using a simplification sofware. The \emph{IBR Billboard Cloud Tree Generator} receives as input the leaves model and the texture used to map each leaf (See figure \ref{inputAndOutputForIBRBBCGenTool}). The output generated is a billboard cloud mesh and three texture atlas as described here: \begin{itemize} \item The billboard cloud model that replaces the original leaves model. The billboard cloud model will be used in with two techniques described in section \ref{usedInGames} in the in\-game visualization. \item The texture atlas that contains the diffuse color texture atlas that contains all the textures that will be used with the billboard cloud mesh. This texture will be used by the lower\-end technique with standard texture mapping. \item The rotated leaf texture atlas, that contains the leaf placed with different orientations. \item The leaves distribution atlas texture. This texture will be used with the rotated leaf texture atlas in the technique \emph{indirect texturing technique} detailed in section \ref{indirectTexturingSection}. \end{itemize} The \emph{IBR Billboard Cloud Tree Generator}, is a command\-line application managed through configuration files. For each kind of tree we want to process we should create a configuration file. The application must have as input parameter the configuration file as shown here: \scriptsize \begin{lstlisting}[frame=tb] IBRBillboardCloudTreeGeneratorCmd.exe -cfg ../../media/chestnut/leaves/sample.cfg \end{lstlisting} \normalsize These configuration files contain all the parameters you have to specify in order to obtain the desired output. Those parameters can be sumarized as: \begin{itemize} \item The media folders parameters. \item The input files parameters. \item The output files parameters. \item The application parameters. \end{itemize} \section{Media folders} \begin{itemize} \item \textbf{Input folders:} \scriptsize \begin{lstlisting}[frame=tb] # Folder where the sample input leaves model can be found... Entities Folder ../../media/chestnut/leaves/ # Folders where the sample temporary data will be stored... Entity Distribution Folder ../../media/chestnut/leaves/ Entity Clusters Folder ../../media/chestnut/leaves/ # Folder where the sample output files will be stored... Billboard Cloud Folder ../../media/chestnut/leaves/ \end{lstlisting} \normalsize \item \textbf{Temporary folders:} \scriptsize \begin{lstlisting}[frame=tb] # Folders where the sample temporary data will be stored... Entity Distribution Folder ../../media/chestnut/leaves/ Entity Clusters Folder ../../media/chestnut/leaves/ \end{lstlisting} \normalsize \item \textbf{Output folders:} \scriptsize \begin{lstlisting}[frame=tb] # Folder where the sample output files will be stored... Billboard Cloud Folder ../../media/chestnut/leaves/ \end{lstlisting} \normalsize \end{itemize} \subsection{Input files parameters} \scriptsize \begin{lstlisting}[frame=tb] # This is the sample input leaves model filename Entities Mesh Name chestnutLeaves.mesh # This is the sample input leaf texture filename Entity Clusters Grouped Texture Unit 0 Name chestnutLeaf.png \end{lstlisting} \normalsize \subsection{Output files parameters} \begin{itemize} \item \textbf{Rotated leaf texture atlas parameters:} \scriptsize \begin{lstlisting}[frame=tb] # This is the sample input leaf texture filename Diffuse Color Entity Texture Name chestnutLeaf.png # The output texture atlas file name Diffuse Color Entity Texture Atlas Name chestnutRotatedLeafAtlas.png # The output texture atlas bit range (8 bits, 16 bits, 32 bits per channel) Diffuse Color Entity Texture Atlas Bit Range 8 # The output texture altas size in pixels Diffuse Color Entity Texture Atlas Size 512 # The number of textures with different leaf orientations we want Diffuse Color Entity Texture Atlas NumSamples 16 \end{lstlisting} \normalsize \item \textbf{Diffuse color texture atlas parameters:} \scriptsize \begin{lstlisting}[frame=tb] # The output texture atlas file name Diffuse Color Texture Atlas Name diffuseColorAtlas.png # The output texture atlas bit range (8 bits, 16 bits, 32 bits per channel) Diffuse Color Texture Atlas Bit Range 8 # The output texture altas size in pixels Diffuse Color Texture Atlas Size 1024 # The size of each billboard texture in the texture atlas Diffuse Color Texture Size 16 \end{lstlisting} \normalsize \item \textbf{Leaves distribution texture atlas parameters:} \scriptsize \begin{lstlisting}[frame=tb] # The output texture atlas file name Indirect Texture Atlas Name indirectTextureAtlas.png # The output texture atlas bit range (8 bits, 16 bits, 32 bits per channel) Indirect Texture Atlas Bit Range 8 # The output texture altas size in pixels Indirect Texture Atlas Size 1024 # The size for each billboard texture in the texture atlas Indirect Texture Size 16 \end{lstlisting} \end{itemize} \normalsize \subsection{Application parameters} \scriptsize \begin{lstlisting}[frame=tb] # This is the maximum number of billboards desired Entity Clusters MaxClusters 1024 \end{lstlisting} \normalsize \section{Keyboard Controls} \textbf{Navigation controls:} \begin{itemize} \item \textbf{Key F1:} Enable \emph{Diffuse Color Texture Atlas View Mode}. \item \textbf{Key F2:} Enable \emph{Indirect Texture Atlas View Mode}. \item \textbf{Key F3:} Enable \emph{Rotated Leaf Texture Atlas View Mode}. \item \textbf{Key F4:} Enable \emph{Billboard Cloud Final View Mode}. \item \textbf{SPACE:} This key iterate along all the billboards generated to see how each group of leaves have been placed on it. This key is working only in the \emph{Diffuse Color Texture Atlas View Mode} and \emph{Indirect Texture Atlas View Mode}. \end{itemize} \textbf{Navigation controls:} This controls are enabled only in the \emph{Billboard Cloud Final View Mode}. With them you can go around the billboard cloud, using the mouse as the looking forward direction. \begin{itemize} \item \textbf{Key E/Key D:} Accelerate/Brake \item \textbf{Key S/Key F:} Turn \item \textbf{Key PGUP/Key PGDOWN:} Shift \end{itemize} \textbf{Special controls controls:} This controls are enabled only in the \emph{Billboard Cloud Final View Mode}. With them you can tweak the indirect texturing leaf texture position. This is explained in detail in section \ref{usedInGames}. \begin{itemize} \item \textbf{Key UP/Key DOWN:} Move up/down the leaf texture. \item \textbf{Key RIGHT/Key LEFT:} Move rigth/left the leaf texture. \end{itemize} \section{Using IBR Billboard Cloud Trees in Games} \label{usedInGames} For using the billboard cloud trees in games, two techniques are shown: \begin{itemize} \item \textbf{Standard texturing technique}: Use only diffuse color texture atlas generated. This technique is for low-end graphic cards. \item \textbf{Indirect texturing technique}: This technique uses the rotated leaf texture atlas and the leaves distribution texture atlas in order to have hight resolution rendered leaves. \end{itemize} \begin{figure}[!htbp] \centering \includegraphics[scale=0.50]{../figures/directTexturingData.png} \caption{Diffuse color texture atlas that contains all the billboard textures. This texture atlas is used in the \emph{Standard texturing technique}.} \end{figure} \begin{figure}[!htbp] \centering \includegraphics[scale=0.40]{../figures/indirectTexturingData.png} \caption{Leaves distribution texture atlas and rotated leaf texture atlas. These texture atlases are used in the \emph{Indirect texturing technique}} \end{figure} We will cover only the \emph{Indirect texturing technique} more in detail, because the \emph{direct texturing technique} is straightforward. \subsection{Indirect texturing technique} \label{indirectTexturingSection} The indirect texturing technique is an only one pass technique. \begin{itemize} \item [(A)] the billboard cloud is the input geometry. The billboard cloud model generated with the \emph{IBR Billboard Cloud Tree Generator} encodes some information in the the \emph{TEXCOORD0} and \emph{COLOR0} parameters. \begin{itemize} \item \textbf{COLOR0:} Encodes the billboard coordinates in the range [0,0] - [1,1]. They are used to compute the current rotated leaf coordinates respect the leaf top-left corner stored in \emph{(r,g)}. \item \textbf{TEXCOORD0:} Encode the texture coordinates that tells us where the billboard texture is in the leaves distribution texture atlas. \end{itemize} \end{itemize} \begin{figure}[!htbp] \centering \includegraphics[scale=0.25]{../figures/inGameDiagram.png} \caption{This is the diagram showing the indirect texturing rendering pass. Where \emph{A} is the billboard cloud geometry, \emph{B} is the rotated leaf texture atlas and \emph{C} is the leaves distribution texture.} \end{figure} The render state block has the following configuration: \begin{itemize} \item ALPHAFUNC = CMP\_GREATER\_EQUAL \item ALPHAREF = 110 \item ALPHATESTENABLE = TRUE \item CULLMODE = CULL\_NONE \end{itemize} For each texture unit: \begin{itemize} \item [(B)] Rotated leaf texture: \begin{itemize} \item TEXTURE FORMAT = A8R8G8B8 \item MAGFILTER = ANISOTROPIC \item MINFILTER = ANISOTROPIC \item MIPFILTER = ANISOTROPIC \end{itemize} \item [(C)] Leaves distribution texture: \begin{itemize} \item TEXTURE FORMAT = A8R8G8B8 \item MAGFILTER = POINT \item MINFILTER = POINT \item MIPFILTER = NONE \end{itemize} \end{itemize} \begin{enumerate} \item During the rendering pass, the leaf distribution texture is accessed using the \emph{TEXCOORD0 (u,v)} coordinates. \item \begin{itemize} \item [(a)] If the value stored in the \emph{a} channel equal to 0, then this texel is not indexing a leaf position inside the billboard. Therefore will be rendered as a transparent texel above the billboard plane. \item [(b)] \begin{itemize} \item [1.] Else if the \emph{a} channel is not equal to 0, the stored coordinates at \emph{(r,g)} will be the top-left coordinates of the position where the leaf will be shaded. \item [2.] Using the leaf orientation top-left coordinates, stored in \emph{(b,a)}, we will lookup from the rotated leaf texture atlas the desired one. \end{itemize} \end{itemize} \end{enumerate} \begin{figure}[!htbp] \centering \includegraphics[scale=0.45]{../figures/indirectTexturingAlgorithm.png} \caption{Indirect texturing. The billboard is replaced by a leaf distribution impostor and the rotated images of the leaves. All the texels that represents one leaf in the leaf distribution impostor has the same information the (r,g) top-left leaf coordinates and the (b,a) top-left rotated leaf coordinates.} \end{figure} \scriptsize \begin{lstlisting}[frame=tb] // Indirect texturing vertex shader struct VS_OUTPUT { float4 Pos: POSITION; float2 texCoord: TEXCOORD0; float2 subTexCoord: TEXCOORD1; }; float4x4 worldviewproj; VS_OUTPUT IndirectTexturing_VS( float4 position: POSITION, float2 subTexCoord: TEXCOORD0, float4 color: COLOR ) { VS_OUTPUT Out; Out.Pos = mul(worldviewproj, position); Out.subTexCoord = subTexCoord; Out.texCoord = color.xy; return Out; } \end{lstlisting} \scriptsize \begin{lstlisting}[frame=tb] // Indirect texturing pixel shader sampler indirectTexture: register(s0); // leaves impostor distribution texture atlas sampler sourceTexture: register(s1); // rotated leaf texture atlas // epsilon value for the leaf position correction uniform float epsilonX; uniform float epsilonY; uniform float sourceTextureSize; // billboard texture size in the leaves impostor // distribution texture atlas uniform float sqrtNumSamples; // Sqrt(numberLeaves) in the rotated leaf texture atlas float4 IndirectTexturing_PS(float2 texCoord: TEXCOORD0, float2 subTexCoord: TEXCOORD1) : COLOR { // Default transparent fragment (fragment without leaf) float4 ocolor = float4(0.0, 0.0, 0.0, 0.0); // Leaf position correction value float2 epsilon = float2(epsilonX, epsilonY); // Look-up the leafPositionUVTopLeftCorner and leafRotationUVTopLeftCorner // using subTexCoord, which tells where the billboard texture is in // the leaves distribution texture atlas // * leafPositionUVTopLeftCorner <=> leafInfo.xy // * leafRotationUVTopLeftCorner <=> leafInfo.zw float4 leafInfo = tex2D(indirectTexture, subTexCoord).xyzw; // Leaf UV current coordinates (range [0,0] - [1,1]) // Using texCoord (billboard coordinates in the range [0,0] - [1,1]) // we can compute the current leaf coordinates respect the leafPositionUVTopLeftCorner float2 leafPositionUVCoord = float2(0.0, 1.0) - abs(texCoord - (leafInfo.xy - epsilon ) ); // We found a leaf? if (leafInfo.w != 0.0) { // Conversion from [0,0] - [1,1] to [i,j] - [i+(1/sqrtNumSamples),j+(1/sqrtNumSamples)] // In order to look-up the leaf with the choosen orientation from the rotated leaf // texture atlas float2 leafRotationUVCoord = (float2(1.0, 1.0) - leafInfo.zw) + ((leafPositionUVCoord * sourceTextureSize) / sqrtNumSamples); ocolor = float4(tex2D(sourceTexture, newcoord).xyzw); } return ocolor; } \end{lstlisting} \normalsize The billboard cloud trees has been used in two applications: \begin{itemize} \item Ogre Demo: Developers how will work with Ogre3D should take a special look into this demo. The demo has been tested under OpenGL and DirectX using GLSL/Cg Cg/HLSL shaders respectively. \item RenderMonkey Effect: This demo has the same effects as the the Ogre3D Demo, using GLSL/HLSL shaders. This application should be easiest to understand for those developers who want to use this technique with other game engines and applications. \end{itemize} \begin{figure}[!htbp] \begin{center} \begin{tabular}{c} \resizebox{80mm}{!}{\includegraphics{../figures/wforest_02_03.png}} \\ \resizebox{80mm}{!}{\includegraphics{../figures/result01.png}} \\ \end{tabular} \caption{Screenshots of the Ogre Demo application.} \label{romanicoRT} \end{center} \end{figure} \begin{figure}[!htbp] \centering \includegraphics[scale=0.30]{../figures/renderMonkey.png} \caption{Screenshot of the RenderMonkey indirect texturing effect.} \end{figure} The indirect texturing technique is good also for shadows. The Ogre Demo has been implemented using Texture Modulative / Additive Shadows and Depth Shadow Mapping. \begin{figure}[!htbp] \centering \includegraphics[scale=0.40]{../figures/wforest_02_02.png} \caption{Ogre Demo application with texture modulative shadow mapping.} \end{figure} \subsection{Implementation Issues:} \textbf{Billboard cloud mesh TEXCOORD0 and COLOR0 parameters:} The billboard cloud mesh generated by the IBR Billboard Cloud Tree Generator can be used for both techniques, the standard texture mapping and the indirect texturing one. The pixel shader used in the standard texture mapping technique will only use the TEXCOORD0 parameter. And the indirect texturing pixel shader will use both the COLOR0 and TEXCOORD0 parameters. \subsubsection{Incorrect leaf placement with indirect texturing:} One problem that can appear is due to the wrong placement of the leaf texture, this can be avoided adjusting an epsilon shift displacement. \begin{figure}[!hbtp] \begin{center} \includegraphics[scale=0.40]{../figures/epsilonTweaking.png} \caption{The first picture shows the result of the indirect texturing before fixing the shift displacement that should be used. In the second picture all the leaves are placed correctly. Those views are from the IBR Billboard Cloud Tree Generator, and with the key controls UP/DOWN and RIGHT/LEFT in the Billboard Cloud Final View Mode this small epsilon is applied. The numeric value applied appears at the bottom of the screen. This epsilon should be used as a uniform float2 parameter of the indirect texturing pixel shader. In the RenderMonkey Demo you can tweak this value directly.} \label{romanicoRT} \end{center} \end{figure} \begin{figure}[!htbp] \centering \begin{tabular}{c} \resizebox{100mm}{!}{\includegraphics{../figures/epsilonXRenderMonkey.png}} \\ \resizebox{100mm}{!}{\includegraphics{../figures/epsilonYRenderMonkey.png}} \\ \resizebox{100mm}{!}{\includegraphics{../figures/renderMonkey.png}} \\ \end{tabular} \caption{These pictures show how to tweak the epsilon value inside RenderMonkey.} \end{figure} %\chapter{Developers Manual} % %Developers manual... %------------------------------------------------------------------- \begin{thebibliography}{99} \bibitem{leafClusterImpostorsEG2005} Leaf cluster impostors for tree rendering with parallax. García, Ismael, Sbert, Mateu, Szirmay-Kalos, Laszlo. Short Paper of Eurographics (Dublin, Ireland), pp. 69-72, 2005. \bibitem{leafClusterImpostors3rdHungarianCGG} Tree rendering with billboard clouds. Third Hungarian García, Ismael, Sbert, Mateu, Szirmay-Kalos, Laszlo. Conference on Computer Graphics and Geometry, Budapest, 2005. \bibitem{xfrog} Xfrog, Greenworks Organic-Software \url{http://www.xfrogdownloads.com/greenwebNew/products/productStart.htm} \bibitem{povtree} Pov-Tree \url{http://propro.ru/go/Wshop/povtree/povtree.html} \bibitem{xfrogpublicplants} Xfrog Public Plants \url{http://web.inf.tu-dresden.de/ST2/cg/downloads/publicplants/} %\[7\] Collada, An open Digital Asset Exchange Schema for the interactive 3D industry %http://www.collada.org %\[8\] Shark3D, Game Engine Spinor GmbH %http://www.shark3d.com %\[9\] Ogre3D, Graphic Engine 7 %http://www.ogre3d.org %\[10\] Xfrog 7 %http://www.xfrogdownloads.com/greenwebNew/news/newStart.htm \end{thebibliography} \end{document} %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%