# Settings rectangle interactive, error: hitAreaCallback is not a function

**URL:** <https://phaser.discourse.group/t/settings-rectangle-interactive-error-hitareacallback-is-not-a-function/2613>\
**Category:** Phaser 3\
**Created:** [May 30, 2019, 3:40pm UTC](https://phaser.discourse.group/t/settings-rectangle-interactive-error-hitareacallback-is-not-a-function/2613 "2019-05-30T15:40:59Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![BdR](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/bdr/32/2621_2.png) [@BdR](https://phaser.discourse.group/u/BdR)\
**Post date:** [May 30, 2019, 3:40pm UTC](https://phaser.discourse.group/t/settings-rectangle-interactive-error-hitareacallback-is-not-a-function/2613/1 "2019-05-30T15:40:59Z")

</div>

I’m trying to create a clickable rectangle in my game but can’t figure it out. There are [some examples](https://labs.phaser.io/index.html?dir=input/game%20object/&q=), but none for rectangles. The problem is that when I use `setInteractive()` it gives this error when moving the mouse cursor in the Phaser game area.

> Uncaught TypeError: n.hitAreaCallback is not a function

Here is my code (also see [Phaser 3 Extended update sprite bug - JSFiddle - Code Playground](https://jsfiddle.net/69waetpq/3/)) and the rectangle should become darker when you move the mouse over it, and then normal again when you move the mouse out of it.

```
function create ()
{
    // rectangle variable
    var r1 = this.add.graphics();

    // draw rectangle
    r1.fillStyle(0xffb000, 1);
    r1.fillRect(450, 200, 200, 200);

    // this line seem to cause the problem somehow
    r1.setInteractive(new Phaser.Geom.Rectangle(450, 200, 200, 200));

    // pointer on rectangle
    r1.on('pointerover', function () {r1.alpha = 0.5;});
    r1.on('pointerout', function () {r1.alpha = 1.0;});
}

```

---

<div class="post-metadata">

**Author:** ![Jake.Caron](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jake.caron/32/1841_2.png) [@Jake.Caron](https://phaser.discourse.group/u/Jake.Caron)\
**Post date:** [May 30, 2019, 3:54pm UTC](https://phaser.discourse.group/t/settings-rectangle-interactive-error-hitareacallback-is-not-a-function/2613/2 "2019-05-30T15:54:53Z")

</div>

> [@BdR](#):
>
> r1.setInteractive(new Phaser.Geom.Rectangle(450, 200, 200, 200));

change above to: `r1.setInteractive(new Phaser.Geom.Rectangle(450, 200, 200, 200), Phaser.Geom.Rectangle.Contains);`
