ImageTexture (class)

Creates a Float32Texture from an input JavaScript image object. The image object needs to be already loaded for the class constructor to work. The color channels will be normalized to be between 0 and 1.

Each image can be used only once for creating textures.

Constructor

The constructor can be called as

var textureInstance = new Abubu.ImageTexture(image, options) ;

The arguments are:

image

image object is compulsory, must be already loaded into the page, and should not be previously used.
options

object of optional named arguments. If none is provided, the default values will be assumed. The options object's available properties are:
- wrapS
  
  String indicating wrapping in the horizontal direction. Possible values are
```
   'clamp_to_edge'   (default)
   'repeat'
   'mirrored_repeat' 
```
- wrapT
  
  String indicating wrapping in the vertical direction. Possible values are
```
   'clamp_to_edge'   (default)
   'repeat'
   'mirrored_repeat' 
```
- magFilter
  
  Texture magnification filter. Possible values are
```
   'nearest'         (default)
   'linear'
```
- minFilter
  
  Texture minification filter. Possible values are
```
   'nearest'         (default)
   'linear'
   'nearest_mipmap_nearest'
   'linear_mipmap_nearest'
   'nearest_mipmap_linear'
   'linear_mipmap_linear'
```

Instance properties

The following properties have read and write permissions and hence can be modified.

width\(^\dagger \)
height\(^\dagger \)
wrapS
wrapT
minFilter
magFilter

\(^\dagger \)Read-Only property.

For more information on these properties, see the explanations in the constructor section.

Example

Consider the following HTML body:

<body onload='loadWebGL();'>
   <img src='somePicture.png' id='pic'   style='display:none'>
</body>

We can define an ImageTexture based on the image loaded on the page by the following JavaScript code.

function loadWebGL(){
   var myImage = document.getElementById('pic') ;

   var imageTexture = new Abubu.ImageTexture(myImage,{
      wrapS : 'repeat' ,
      wrapT : 'mirrored_repeat' ,
   } ) ;

   return ;
}

By setting the onload attribute of the HTML body, and setting up the image texture inside the callback function loadWebGL, we ensure that the image is loaded before accessing it for texture definition. We have set the wrapping in the S direction to 'repeat' and in T direction to 'mirrored_repeat'.