# Adding a noise overlay to scene (modifying textures programatically?)

**URL:** <https://phaser.discourse.group/t/adding-a-noise-overlay-to-scene-modifying-textures-programatically/8699>\
**Category:** Phaser 3\
**Created:** [January 22, 2021, 9:42pm UTC](https://phaser.discourse.group/t/adding-a-noise-overlay-to-scene-modifying-textures-programatically/8699 "2021-01-22T21:42:18Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![WhiteDragonLight](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@WhiteDragonLight](https://phaser.discourse.group/u/WhiteDragonLight)\
**Post date:** [January 22, 2021, 9:42pm UTC](https://phaser.discourse.group/t/adding-a-noise-overlay-to-scene-modifying-textures-programatically/8699/1 "2021-01-22T21:42:18Z")

</div>

I’m working on a top-down retro RPG thingy and there’s a scene where I need to gradually add “noise” to both the tileset and sprite textures as the player walks.  
I’ve tried adding a graphics object and then plotting with fillPoint() like so:

```javascript
let graphics = this.add.graphics();
  
this.events.on('playerMove', () => {

    for (let i = 0; i < 50; i++) {
        let point = this.getRandomCoords();
        graphics.fillPoint(point.x, point.y, 3);
    }
});

```

This kinda works but it’s far from ideal and it just breaks at one point giving the following warning:  
**WebGL warning: bufferSubData: Offset+size passes the end of the buffer.**

So I’m looking for alternatives to achieve a similar effect. I was wondering if it was possible to modify tileset and sprite textures programatically for instance (that would be ideal) or just any other way to generate the same effect.  
Basically, I want to add random white dots on screen until you can no longer tell what’s going on.

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [January 23, 2021, 12:01am UTC](https://phaser.discourse.group/t/adding-a-noise-overlay-to-scene-modifying-textures-programatically/8699/2 "2021-01-23T00:01:46Z")

</div>

If you want to fill the whole screen you can add a RenderTexture (which is a game object, like a sprite) on top and draw on that.

If you want to modify actual textures, create a CanvasTexture, copy a source texture on to it, then draw.

---

<div class="post-metadata">

**Author:** ![WhiteDragonLight](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@WhiteDragonLight](https://phaser.discourse.group/u/WhiteDragonLight)\
**Post date:** [January 24, 2021, 8:39pm UTC](https://phaser.discourse.group/t/adding-a-noise-overlay-to-scene-modifying-textures-programatically/8699/3 "2021-01-24T20:39:14Z")

</div>

That did the trick, thanks!

 ![Peek 2021-01-24 17-37](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/e/eb3a5cfd9826f30aa2e1f1062ca369ba8e43afad.gif)