{"id":2768,"date":"2016-04-27T00:00:38","date_gmt":"2016-04-26T23:00:38","guid":{"rendered":"http:\/\/phoenixgamedevelopment.com\/blog\/?p=2768"},"modified":"2016-04-29T04:16:41","modified_gmt":"2016-04-29T03:16:41","slug":"p-152-virtual-world-concept-update-116-texture-blending","status":"publish","type":"post","link":"https:\/\/phoenixgamedevelopment.com\/blog\/p-152-virtual-world-concept-update-116-texture-blending\/","title":{"rendered":"P-152: Virtual World Concept Update 116: Texture Blending"},"content":{"rendered":"

I have figured out how to blend my terrain textures together. I have not completely finished the system yet, but I have proof of concept.<\/p>\n

The general idea is the same as “texture splatting”, however, Texture Splatting requires an alpha map. This is a map of the whole terrain which is used to determine how much one texture should be blended into the next.<\/p>\n

The problem for me was that my terrain is generated procedurally, so I cant have a single alpha map.<\/p>\n

The solution occurred to me when I realised that the alpha map is essentially just a map of opacity\u00a0values at any given altitude. So, if we assume that the terrains height is between 0 and 100, any height over 75 might be 100% grass, any height under 25 might be 100% sand. The values in the middle should be smoothly blended between the two, using a simple algorithm.<\/p>\n

Producing this opacity value is actually quite easy, if you know the minimum and maximum height values for the range of heights that you are blending between. I simply rescale the height range so that it is between 0 and 1, that gives me the opacity of the second texture. I subtract this value from 1 to get the first textures\u00a0opacity.<\/p>\n

For the concept test, I simply used two textures, very simple blending, and I hardcoded the height ranges. This is the result:<\/p>\n

\"P152_DEBUG<\/a><\/p>\n

\"P152_DEBUG<\/a><\/p>\n

\"P152_DEBUG<\/a><\/p>\n

\"P152_DEBUG<\/a><\/p>\n

As can be clearly seen, the terrain gradually blends from 100% sand coverage to 100% grass coverage, with no seams in between. There is some repitition\u00a0in this image, but that is due to the textures that I used, not the shader. I am confident that I can extend this system to cover all of the textures that I will be applying using a simple series of if statements to determine the range. This, however, is not ideal, and this leads me to the final problem in this system.<\/p>\n

I do not know the exact scale of values in the terrain. They do not seem to be identical to the raw height values of the vertices of the spherical terrain, nor do they correspond to some known range, such as 0-1. They also change depending on the height scale of the terrain, which makes sense. My algorithm with not work unless I can determine the minimum and maximum height values of the terrain at the current scale. I am not sure how to get these values, and the fact that I can’t simply print out values from the shader is making things more complex. Once I solve this, I can simply the aforementioned IF ELSE statements to blend the textures at the correct heights.<\/p>\n

This is my next, and possibly final, goal in MS1, other than some debugging and tidying up.<\/p>\n

Below is a final image I took of the height range. The area in red is the blend region, the area above and below have hardcoded textures (100% opacity). I had to set the values for this region manually, which wouldn’t work for the final project, since the height scale is variable.<\/p>\n

\"P152_DEBUG<\/a><\/p>\n

Finally, here is the Pixel shader that I used to generate this, very basic blending effect:<\/p>\n

\/\/————————————————————–
\n\/\/Structures
\n\/\/————————————————————–<\/p>\n

struct ConnectData {
\n\/\/float4 HPOS : POSITION;
\nfloat2 texCoord : TEXCOORD0;
\nfloat3 pos : TEXCOORD1;
\n};
\nstruct Fragout {
\nfloat4 col : COLOR0;
\n};<\/p>\n

\/\/————————————————————–
\n\/\/Main
\n\/\/————————————————————–
\nFragout main
\n(
\nConnectData IN,
\nuniform sampler2D dirtgrass : register(S0),
\nuniform sampler2D grass1 : register(S1),
\nuniform sampler2D drygrass : register(S2),
\nuniform sampler2D grass2 : register(S3),<\/p>\n

uniform sampler2D rocks1 : register(S4),
\nuniform sampler2D rocktest : register(S5),<\/p>\n

uniform sampler2D sand : register(S6),
\nuniform sampler2D snowtop : register(S7)<\/p>\n

)
\n{
\nFragout OUT;<\/p>\n

\/\/uses the base textures’ color to set difuse color
\nfloat4 diffuseColor = tex2D( dirtgrass, IN.texCoord );<\/p>\n

float4 someColor;<\/p>\n

float OldMin = 0.94575;
\nfloat OldMax = 0.99;<\/p>\n

float NewMin = 0;
\nfloat NewMax = 1;<\/p>\n

float OldValue = IN.pos.z;<\/p>\n

float NewValue = (((OldValue – OldMin) * (NewMax – NewMin)) \/ (OldMax – OldMin)) + NewMin;
\n\/\/simple concept test of blending (two textures only):<\/p>\n

if(OldValue <= OldMin){
\nsomeColor = tex2D( sand, IN.texCoord );
\nOUT.col = someColor;
\n}<\/p>\n

else if (OldValue >= OldMax){
\nsomeColor = tex2D( grass2, IN.texCoord );
\nOUT.col = someColor;
\n}<\/p>\n

else{
\n\/\/blend
\nfloat4 blend1 = tex2D( sand, IN.texCoord );\/\/float4(1.0,0.0,0.0,1.0);
\nfloat4 blend2 = tex2D( grass2, IN.texCoord );\/\/float4(0.0,0.0,1.0,1.0);<\/p>\n

float a1 = 1-NewValue;
\nfloat a2 = NewValue;
\nsomeColor = (blend1 * a1) + (blend2 * a2);
\nOUT.col = someColor;<\/p>\n

}
\nreturn OUT;
\n}<\/p><\/blockquote>\n

And the Vertex shader:<\/p>\n

 <\/p>\n

#define IN_HLSL
\n#include “shdrConsts.h”
\n#include “hlslStructs.h”
\n\/\/—————————————————————
\n\/\/ Constants
\n\/\/—————————————————————<\/p>\n

struct Appdata {
\nfloat4 position : POSITION;
\nfloat4 texCoord : TEXCOORD0;
\n};<\/p>\n

struct Conn {
\nfloat4 outHPOS : POSITION;
\nfloat2 outTexCoord : TEXCOORD0;
\nfloat3 pos : TEXCOORD1;
\n};
\n\/\/—————————————————————
\n\/\/ Main
\n\/\/—————————————————————<\/p>\n

Conn main(
\nAppdata In,
\nuniform float4x4 modelview : register(VC_WORLD_PROJ),
\nuniform float4x4 texMat : register(VC_TEX_TRANS1)
\n)
\n{
\nConn Out;
\n\/\/take vert and get coord by transforming by modelviewmatrix
\nOut.outHPOS = mul(modelview, In.position);
\n\/\/set base texture coord
\nOut.outTexCoord = mul(texMat, In.texCoord);
\nfloat3 pos = In.position.xyz; \/\/mul( cubeTrans, In.pos ).xyz;
\nOut.pos = pos;\/\/mul(objToTangentSpace, In.position.xyz \/ 100.0);
\nreturn Out;
\n}<\/p><\/blockquote>\n

 <\/p>\n

This is obviously very simple, and will be improved in the future, likely after I solve the height scaling issue.<\/p>\n

 <\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

I have figured out how to blend my terrain textures together. I have not completely finished the system yet, but I have proof of concept. The general idea is the same as “texture splatting”, however, Texture Splatting requires an alpha map. This is a map of the whole terrain which is used to determine how […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,17,10,11],"tags":[],"class_list":["post-2768","post","type-post","status-publish","format-standard","hentry","category-astral-realms","category-p-0","category-software-and-games","category-spiritus-astrum","has-post-title","has-post-date","has-post-category","has-post-tag","has-post-comment","has-post-author",""],"aioseo_notices":[],"builder_content":"","_links":{"self":[{"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/posts\/2768"}],"collection":[{"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/comments?post=2768"}],"version-history":[{"count":5,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/posts\/2768\/revisions"}],"predecessor-version":[{"id":2778,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/posts\/2768\/revisions\/2778"}],"wp:attachment":[{"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/media?parent=2768"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/categories?post=2768"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/phoenixgamedevelopment.com\/blog\/wp-json\/wp\/v2\/tags?post=2768"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}