# Sprites being distorted

**URL:** <https://phaser.discourse.group/t/sprites-being-distorted/4344>\
**Category:** Phaser 3\
**Created:** [November 22, 2019, 7:21pm UTC](https://phaser.discourse.group/t/sprites-being-distorted/4344 "2019-11-22T19:21:59Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![XXxxHacker420xxXX](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/xxxxhacker420xxxx/32/2353_2.png) [@XXxxHacker420xxXX](https://phaser.discourse.group/u/XXxxHacker420xxXX)\
**Post date:** [November 22, 2019, 7:21pm UTC](https://phaser.discourse.group/t/sprites-being-distorted/4344/1 "2019-11-22T19:21:59Z")

</div>

![15%20PM](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/6/6cae440f035d10e95b8cb1145daa539677a6fd74.png)

i was trying to fix some lines appearing on the tilemaps but in the prosses, my main sprite for some unknown reason got distorted

var config = {  
type: Phaser.AUTO,  
width: 720,  
height: 480,  
roundPixels: true,  
zoom:25,  
pixelArt: true,  
physics: {  
default:‘arcade’,  
arcade: {  
gravity: {y: 1500}  
}  
},  
scene: [level1]  
};

var game = new Phaser.Game(config);

class level1 extends Phaser.Scene{  
constructor(){  
super({key:“level1”})  
}  
preload(){  
this.load.image(‘level1Tiles’,‘assets/tiles1.png’)  
//bk tilemap  
this.load.tilemapCSV(‘level1bk’,‘csv/Level1 - bk.csv’)  
//world tilemap  
this.load.tilemapCSV(‘level1w’,‘csv/Level1 - world.csv’);

```
	// playersprite
	this.load.spritesheet('player','assets/player.png',{frameWidth:16, frameHeight: 26 });
}
create(){
	//cursor
	this.cursors = this.input.keyboard.createCursorKeys();
	//bk tiles
	const bkmap = this.make.tilemap({key:'level1bk', tileWidth:16, tileHeight:16});
	const bktiles = bkmap.addTilesetImage('level1Tiles');
	const bklayer = bkmap.createStaticLayer(0,bktiles,0,0)
	//mainworld tiles
	const wmap = this.make.tilemap({key:'level1w', tileWidth:16, tileHeight:16});
	const wtiles = wmap.addTilesetImage('level1Tiles');
	const wlayer = wmap.createDynamicLayer(0,wtiles,0,0)
	
	//player
	this.player = this.physics.add.sprite(16,128,'player');
	this.player.setBounce(0);
	this.player.setCollideWorldBounds(true);
	//player animations
	this.anims.create({
		key:"idle",
		frames: this.anims.generateFrameNumbers('player',{frames:[0,1]}),
		frameRate: 5,
		repeat: -1
	});
	this.anims.create({
		key:"move",
		frames: this.anims.generateFrameNumbers('player',{frames:[3,5,6,5]}),
		frameRate: 12,
		repeat: -1
	});
	//camera
	this.cameras.main.setBounds(0,0,1440,480);
	this.cameraDolly = new Phaser.Geom.Point(this.player.x, this.player.y);
	this.cameras.main.startFollow(this.cameraDolly);
	//collision
	wmap.setCollisionBetween(0,2)
	this.physics.add.collider(this.player,wlayer);
}
update(){
	//camera
	this.cameraDolly.x = Math.floor(this.player.x);
	this.cameraDolly.y = Math.floor(this.player.y)
	//movement
	if(this.cursors.up.isDown){
		this.player.setVelocityY(-250);
	}
	if(this.cursors.right.isDown){
		this.player.anims.play('move',true);
		this.player.setVelocityX(150)
		this.player.flipX = false;
	} else if(this.cursors.left.isDown){
		this.player.anims.play('move',true);
		this.player.setVelocityX(-150);
		this.player.flipX = true;
	} else{
		this.player.setVelocityX(0);
		this.player.anims.play('idle',true);
	}
}

```

}

---

<div class="post-metadata">

**Author:** ![digitsensitive](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/digitsensitive/32/349_2.png) [@digitsensitive](https://phaser.discourse.group/u/digitsensitive)\
**Post date:** [November 23, 2019, 11:35am UTC](https://phaser.discourse.group/t/sprites-being-distorted/4344/2 "2019-11-23T11:35:58Z")

</div>

You should add the following object in your config:

```
render: { pixelArt: true, antialias: false }
```

---

<div class="post-metadata">

**Author:** ![XXxxHacker420xxXX](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/xxxxhacker420xxxx/32/2353_2.png) [@XXxxHacker420xxXX](https://phaser.discourse.group/u/XXxxHacker420xxXX)\
**Post date:** [November 23, 2019, 2:46pm UTC](https://phaser.discourse.group/t/sprites-being-distorted/4344/3 "2019-11-23T14:46:53Z")

</div>

thank you

---

<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:** [November 23, 2019, 5:49pm UTC](https://phaser.discourse.group/t/sprites-being-distorted/4344/4 "2019-11-23T17:49:28Z")

</div>

I thought `pixelArt=true` includes `antialias=false`.