Lecture 10: Texturing B
COMP5822M – High Perf. Graphics
– Blending&Masking – Texturingshowcase
Copyright By PowCoder代写 加微信 powcoder
COMP5822M – High Perf. Graphics
– Texturing
– VkSampler
– Combined vs separate sampler+image
– Continuationonnormalmappingetc.
– Verybrief:
– Texture compression
– Virtual textures
COMP5822M – High Perf. Graphics
– Whendrawingatriangle:
– Rasterize triangle
– Each pixel: interpolate tex. coords.
– Use to sample texture
– Sample: “read from texture”
– Returns single RGB(A) color
(0.5,0.7) (1,1)
COMP5822M – High Perf. Graphics
– Sampler object
– Texture data in VkImage
COMP5822M – High Perf. Graphics
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
VkBorderColor VkBool32
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
borderColor;
unnormalizedCoordinates;
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags
VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkBool32 float VkBool32 VkCompareOp float
VkBorderColor
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
sType; pNext; flags;
addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
borderColor;
unnormalizedCoordinates;
VkFilter VkSamplerMipmapMode
magFilter; minFilter; mipmapMode;
– Difficulties:
COMP5822M – High Perf. Graphics
– Difficulties:
“Squeezed” / shrunk = “minification”
COMP5822M – High Perf. Graphics
= “magnification”
– We need to perform filtering.
– Twodistinctdirections: – Minification
– Magnification
COMP5822M – High Perf. Graphics
Filtering – Magnification
COMP5822M – High Perf. Graphics
Filtering – Magnification
COMP5822M – High Perf. Graphics
Interpolated texture coordinate not aligned to texels (pixels in texture)!
Filtering – Magnification
– Differentchoices:
– Take nearest texel’s value
– Mix surrounding texel’s values -…
COMP5822M – High Perf. Graphics
Filtering – Magnification
– Differentchoices:
– Take nearest texel’s value (NEAREST)
– Mix surrounding texel’s values (bi-linear / LINEAR) -…
COMP5822M – High Perf. Graphics
Filtering – NEAREST
– Giventexturecoordinate(u,v)
– Scale by texture size
– Floor results
COMP5822M – High Perf. Graphics
Filtering – NEAREST
– Giventexturecoordinate(u,v)
– Scale by texture size
– Floor results
COMP5822M – High Perf. Graphics
Filtering – LINEAR
– Also called bi-linear interpolation – Two linear interpolation operations
COMP5822M – High Perf. Graphics
Src: (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – LINEAR
– Also called bi-linear interpolation – Two linear interpolation operations
COMP5822M – High Perf. Graphics
Src: (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – LINEAR
– Also called bi-linear interpolation – Two linear interpolation operations
COMP5822M – High Perf. Graphics
Src: (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – LINEAR
– Given a texture coordinate (u,v)
– Scale by texture size: 𝑝 , 𝑝 = 𝑢 𝑤, 𝑣 h
– Fractionalpart: 𝑢,𝑣 =(𝑝 − 𝑝 ,𝑝 − 𝑝 ) 𝑢𝑢𝑣𝑣
– Assume 𝑡 𝑖, 𝑗 reads texel from texture 𝑏𝑝,𝑝 =1−𝑢′ 1−𝑣′𝑡𝑝,𝑝 +
u1−vt𝑝+1,𝑝 +
1−uvt𝑝,𝑝+1+ ′𝑢𝑣
uv′t 𝑝 +1,𝑝 +1 𝑢𝑣
COMP5822M – High Perf. Graphics
Filtering – LINEAR
– Requires 4 “taps” (reads) from the texture
– A bit more expensive than nearest
– But texture filtering hardware is pretty good
(and has caches) – Defaultchoice.
COMP5822M – High Perf. Graphics
Filtering – LINEAR
– Given a texture coordinate (u,v)
– Scale by texture size: 𝑝 , 𝑝 = 𝑢 𝑤, 𝑣 h
– Fractionalpart: 𝑢,𝑣 =(𝑝 − 𝑝 ,𝑝 − 𝑝 ) 𝑢𝑢𝑣𝑣
Assume 𝑡 𝑖, 𝑗 reads texel from texture
𝑏 𝑝 ,𝑝 = 1−𝑢′ 1−𝑣′ 𝒕 𝑝 , 𝑝 +
u1−v𝐭𝑝+1,𝑝 +
1−uv𝐭𝑝,𝑝+1+ ′𝑢𝑣
uv′𝐭 𝑝 +1,𝑝 +1 𝑢𝑣
COMP5822M – High Perf. Graphics
Filtering – LINEAR
– Requires 4 “taps” (reads) from the texture
– A bit more expensive than nearest
– But texture filtering hardware is pretty good
(and has caches) – Defaultchoice.
COMP5822M – High Perf. Graphics
Filtering – LINEAR
– Requires 4 “taps” (reads) from the texture
– A bit more expensive than nearest
– But texture filtering hardware is pretty good
(and has caches) – Defaultchoice.
COMP5822M – High Perf. Graphics
Filtering – NEAREST vs LINEAR
COMP5822M – High Perf. Graphics
Filtering – NEAREST vs LINEAR
Unless there’s a special reason, use LINEAR for magnification.
NEAREST used to be cheaper, but unlikely to be a bottleneck now.
COMP5822M – High Perf. Graphics
Filtering – Minification
– Sameproblem?
COMP5822M – High Perf. Graphics
Filtering – Minification
– Sameproblem?
N E A R E S T
COMP5822M – High Perf. Graphics
L I N E A R
Filtering – Minification
– Sameproblem?
COMP5822M – High Perf. Graphics
N E A R E S T
L I N E A R
Filtering – Minification
– What’sgoingon? – Aliasing!
– We’re not sampling all texels
COMP5822M – High Perf. Graphics
Filtering – Minification
– What’sgoingon? – Aliasing!
– We’re not sampling all texels
COMP5822M – High Perf. Graphics
Filtering – Minification
– Problem:pixelsarenotpoints – But have a small area
COMP5822M – High Perf. Graphics
Filtering – Minification
– Problem:pixelsarenotpoints
– But have a small area
– We should average in this area!
COMP5822M – High Perf. Graphics
Filtering – Minification
– Averaging pixels in large areas is too
expensive.
– Technically, there are better filters than
average, but that’s a topic for a different
– The better filters are even more expensive
anyway. => Mipmaps!
COMP5822M – High Perf. Graphics
Filtering – Mipmaps
– Imagepyramid
– Halfimageresolutionwhen
going upwards – Up to 1×1
COMP5822M – High Perf. Graphics
Src: (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – Mipmaps
– Imagepyramid
– Halfimageresolutionwhen
going upwards – Up to 1×1
– Decidewhichlevelmatchesbest size of pixel and use that.
COMP5822M – High Perf. Graphics
Src: (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – Mipmaps
– Choices:
VK_SAMPLER_MIPMAP_MODE_NEAREST – pick nearest mipmap level VK_SAMPLER_MIPMAP_MODE_LINEAR – linearly interp. between mipmap levels
VK_FILTER_NEAREST – nearest filtering in relevant mipmap levels VK_FILTER_LINEAR – linear filtering in relevant mipmap levels
MODE_LINEAR + FILTER_LINEAR = “trilinear filtering”
COMP5822M – High Perf. Graphics
Src: Level d Level d+1 (https://www.cse.chalmers.se/edu/course/TDA362/texturing.pdf)
Filtering – Mimaps
– Depends on projected pixel size
– How do we figure this out
– Short: HW does it for us.
– Uses per-fragment partial derivatives
– Computed during rasterization via
local differencing (neighbours)
COMP5822M – High Perf. Graphics
Filtering – Mimaps
COMP5822M – High Perf. Graphics
LINEAR_ MIPMAP_ LINEAR
Filtering – Mimaps
L I N E A R
COMP5822M – High Perf. Graphics
LINEAR_ MIPMAP_ LINEAR
Filtering – Mimaps
– Allgood?
COMP5822M – High Perf. Graphics
Filtering – Mimaps
– Allgood?
– Maybe. Used to be the standard for a long
– But tends to overblur the results
COMP5822M – High Perf. Graphics
Filtering – Mimaps
– Allgood?
– Maybe. Used to be the standard for a long
– But tends to overblur the results
COMP5822M – High Perf. Graphics
LINEAR_MIPMAP_LINEAR
Filtering – Mimaps
– What’sgoingon?
– Mipmaps give us a square filter region
– Pixel footprint isn’t square.
COMP5822M – High Perf. Graphics
Filtering – Anisotropic filtering
– Solution:anisotropicfiltering
– Uses additional taps to better approximate
pixel’s footprint
– Won’t go into details
– HW-dependent anyway.
COMP5822M – High Perf. Graphics
Filtering – Anisotropic filtering
– Solution:anisotropicfiltering
– Uses additional taps to better ?
approximate pixel’s footprint
– Won’t go into details
– HW-dependent anyway.
COMP5822M – High Perf. Graphics
Samples can end up in different mip levels!
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
VkBorderColor VkBool32
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
borderColor;
unnormalizedCoordinates;
Anisotropic sampling
maxAnisotropy device dependent, but seems to be [0 … 16] for almost all devices.
Affects number of samples. Lower = faster, higher = better.
Filtering – Anisotropic filtering
– Solution:anisotropicfiltering
– Uses additional taps to better approximate
pixel’s footprint
– Won’t go into details
– HW-dependent anyway.
MIPMAP_MODE_LINEAR FILTER_LINEAR
COMP5822M – High Perf. Graphics
MIPMAP_MODE_LINEAR FILTER_LINEAR Anisotropy => 16.0
Filtering – Anisotropic filtering
– Morecostly
– Especially on integrated GPUs
– Results probably worth it? Measure!
– OptionalfeatureinVulkan1.0
– Must be enabled during device creation
(VkPhysicalDeviceFeatures::samplerAnisotropy)
– Support is quite broad (90% across all platforms, 99+% on desktop/windows)
COMP5822M – High Perf. Graphics
Addressing/Wrapping modes
– Whathappenswhen(u,v)<0or>1? – Configurable!(2,2)
Source Image
CLAMP_TO_EDGE
MIRROR_REPEAT
CLAMP_TO_BORDER
COMP5822M – High Perf. Graphics
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
VkBorderColor VkBool32
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
borderColor;
unnormalizedCoordinates;
Addressing / wrapping modes Each direction.
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
VkBorderColor VkBool32
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
borderColor;
unnormalizedCoordinates;
For shadow mapping.
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
unnormalizedCoordinates;
Border color (address mode = CLAMP_TO_BORDER)
Note: only predefined colors!
VkBorderColor borderColor;
typedef struct VkSamplerCreateInfo {
VkStructureType const void* VkSamplerCreateFlags VkFilter
VkFilter VkSamplerMipmapMode VkSamplerAddressMode VkSamplerAddressMode VkSamplerAddressMode float
VkCompareOp
VkBorderColor VkBool32
} VkSamplerCreateInfo;
COMP5822M – High Perf. Graphics
magFilter; minFilter; mipmapMode; addressModeU; addressModeV; addressModeW; mipLodBias; anisotropyEnable; maxAnisotropy; compareEnable; compareOp; minLod;
Normally: texture coordinates in [0 … 1] Unnormalized: [0 … width], [0 … height] in pixels
borderColor;
unnormalizedCoordinates;
Samplers and textures
– Combinedimageandsampler
– VK_DESCRIPTOR_TYPE_COMBINED_IMAGE_SAMPLER
– Both VkImage and VkSampler
– Most common (maybe better perf) – Separate(twodescriptors!)
– VK_DESCRIPTOR_TYPE_SAMPLED_IMAGE
for VkImage
– VK_DESCRIPTOR_TYPE_SAMPLER
for VkSampler
COMP5822M – High Perf. Graphics
Samplers and textures – GLSL
– Combinedimageandsampler:
layout( … ) uniform sampler2D uTex; …
vec4 res = texture( uTex, uv );
– Separate image and sampler
layout( … ) uniform texture2D uImg;
layout( … ) uniform sampler uSamp;
vec4 res = texture( sampler2D(uImg,uSamp), uv );
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
Still two triangles!
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
COMP5822M – High Perf. Graphics
Modeling rough surfaces
– Twoaspects:
– Macroscopic level: “where light is reflected”
– Microscopic level: “how light is reflected”
– Diffuse vs. specular surfaces
COMP5822M – High Perf. Graphics
Modeling rough surfaces
– Twoaspects:
– Macroscopic level: “where light is reflected”
– Microscopic level: “how light is reflected”
– Diffuse vs. specular surfaces
– Macroscopic: Normal / Bump mapping
– Microscopic: Specularity /
Roughness & Metalness /…
– BRDF! More on this when we get to shading
COMP5822M – High Perf. Graphics
Macroscopic:
– BumpMaps(Heightmaps)
– NormalMaps
– Parallax Mapping
– ReliefMapping
– DisplacementMaps
COMP5822M – High Perf. Graphics
Bump mapping & Normal Mapping
– Simulate additional surface detail – E.g., small bumps and wrinkles
– Done by changing lighting of the surface
– Duringlightingcomputations:
– Replace true surface normal with
emulated surface’s normal
– Perception of additional detail due to
changes in lighting
– Underlying geometry not changed!
COMP5822M – High Perf. Graphics
Bump mapping & Normal Mapping
True Surface Normal
2021/20E22mulated Surface Normal COMP5822M – High Perf. Graphics
Bump mapping & Normal Mapping
COMP5822M – High Perf. Graphics
Geometry remains unchanged!
Left: Bump Mapping
=> silhouette still a sphere
Right: “True surface” => silhouette shows bumps too
Src: https://en.wikipedia.org/wiki/Bump_mapping
Bump mapping & Normal Mapping
– Often confused
– Bumpmapping:
– Use a (grey scale) height map
– Derive normal via finite differences
– Perturb true surface normal with
derived normal
– Normalmapping:
– Store tangent space normal in texture (RGB)
COMP5822M – High Perf. Graphics
Normal mapping
– Morecommonvariantthesedays
– When people talk about bump mapping,
they usually mean normal mapping
– (I am guilty of this too)
COMP5822M – High Perf. Graphics
Normal mapping
– Requiresnormalmap
– Normalsintangentspace
– Lightdefinedinworldspace
– Need to transform normal to world space
– Or light to tangent space
– (Just make sure they are in the same space!)
COMP5822M – High Perf. Graphics
Tangent space
– Each point has its own tangent space frame
COMP5822M – High Perf. Graphics
Tangent space
– t and b follow the (u,v) texture coordinates along the surface
– 𝒕=𝜕𝑺,𝒃=𝜕𝑺 𝜕𝑢 𝜕𝑣
COMP5822M – High Perf. Graphics
Tangent space
– t and b follow the (u,v) texture coordinates along the surface
– 𝒕=𝜕𝑺,𝒃=𝜕𝑺 𝜕𝑢 𝜕𝑣
– Notnecessarilyorthonormal
– u and v directions not at 90 degree angle
=> texture shear
COMP5822M – High Perf. Graphics
Tangent space
– Texture shear is typically not desirable
– Visually not very nice
– Typically try to avoid much texture shear
– Can orthogonalize and normalize => Orthonormal basis for tangent space
– Orthonormalbasesaremuchnicer to work with
COMP5822M – High Perf. Graphics
Tangent space
– Typically, we already know n
– Just our vertex normal
– So, just figure out t
– Compute𝒃=𝒏 ×𝒕
– Sometimesmirrored.
– Symmetric/mirrored modelling – 𝒃 = −𝒏 × 𝒕
COMP5822M – High Perf. Graphics
Tangent space
– Matrix defined by [t b n] to transform to tangent space
– A rotation
– Inverse from tangent space to e.g. world space
– Recall: orthonormal, so inverse = transpose
– (Cheaper than “proper” inverse)
COMP5822M – High Perf. Graphics
Tangent space
– How to compute?
– Pre-computeusingtrianglegeometry
– Additional vertex attribute
– A bit of vector algebra (look at vectors
along triangle edges)
– Use a 3rd party library? Has tricky cases…
COMP5822M – High Perf. Graphics
Tangent space
– On the fly, in the fragment shader
– Fragmentshader
– dFdx(), dFdy() : derivatives in screen space
– “Local differencing … current fragment and immediate neighbours”
– Define local triangle between current fragment and neighbours
– Same idea as before
– Warning: inconvenient spaces
COMP5822M – High Perf. Graphics
Parallax Mapping
– Normal mapping doesn’t have self-occlusion
– Geometric details look wrong
– Especially when moving
COMP5822M – High Perf. Graphics
Parallax Mapping
COMP5822M – High Perf. Graphics
Parallax Mapping
– Approximatesolution
– Better:localraytracing(“raymarching”)
COMP5822M – High Perf. Graphics
Relief Mapping
– Heightmap
– Search locally for
intersection
– Along view vector
COMP5822M – High Perf. Graphics
Relief Mapping
COMP5822M – High Perf. Graphics
Improves on normal mapping.
Still has bad silhouettes, though.
Displacement Mapping
– Actuallyaddgeometricdetails
– Essentially a height field
– Like with the terrain
– Tessellate triangle surface
– Displace extra vertices based on texture
– Tessellationshader?
– Either way, quite expensive
COMP5822M – High Perf. Graphics
Displacement Mapping
COMP5822M – High Perf. Graphics
Displacement Mapping
COMP5822M – High Perf. Graphics
Overlaps with height field rendering.
Similar techniques apply.
Texture storage
– Textures take a lot of space
– Probably account for biggest portion of data
– Compressedtextureformats!
– Blockcompression
– Fixed bit rate
程序代写 CS代考 加微信: powcoder QQ: 1823890830 Email: powcoder@163.com