forked from noxious/client
Worked on map
This commit is contained in:
parent
1851cc4782
commit
c58b6012b9
36
package-lock.json
generated
36
package-lock.json
generated
@ -2106,13 +2106,13 @@
|
||||
"integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
|
||||
},
|
||||
"node_modules/@vue/devtools-core": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-core/-/devtools-core-7.1.2.tgz",
|
||||
"integrity": "sha512-yO2+xSnXkZPqSJAiWPigIwSdWQordROOg4nrLVA6ByJAzFowJmN6sAKysFtbhVg8Fb1e/DnI+1dJ4tp3zbvM7Q==",
|
||||
"version": "7.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-core/-/devtools-core-7.1.3.tgz",
|
||||
"integrity": "sha512-pVbWi8pf2Z/fZPioYOIgu+cv9pQG55k4D8bL31ec+Wfe+pQR0ImFDu0OhHfch1Ra8uvLLrAZTF4IKeGAkmzD4A==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@vue/devtools-kit": "^7.1.2",
|
||||
"@vue/devtools-shared": "^7.1.2",
|
||||
"@vue/devtools-kit": "^7.1.3",
|
||||
"@vue/devtools-shared": "^7.1.3",
|
||||
"mitt": "^3.0.1",
|
||||
"nanoid": "^3.3.4",
|
||||
"pathe": "^1.1.2",
|
||||
@ -2120,12 +2120,12 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@vue/devtools-kit": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.1.2.tgz",
|
||||
"integrity": "sha512-UTrcUSOhlI9eXqbPMHUWwA6NQiiPT3onzXsVk2JHGR8ZFFSkzsWTTpHyVA1woG8zvgu2HNV/wigW2k87p858zw==",
|
||||
"version": "7.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.1.3.tgz",
|
||||
"integrity": "sha512-NFskFSJMVCBXTkByuk2llzI3KD3Blcm7WqiRorWjD6nClHPgkH5BobDH08rfulqq5ocRt5xV+3qOT1Q9FXJrwQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@vue/devtools-shared": "^7.1.2",
|
||||
"@vue/devtools-shared": "^7.1.3",
|
||||
"hookable": "^5.5.3",
|
||||
"mitt": "^3.0.1",
|
||||
"perfect-debounce": "^1.0.0",
|
||||
@ -2136,9 +2136,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@vue/devtools-shared": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.1.2.tgz",
|
||||
"integrity": "sha512-r9cUf93VMhKSsxF2/cBbf6Lm1nRBx+r1pRuji5CiAf3JIPYPOjeEqJ13OuwP1fauYh1tyBFcCxt3eJPvHT59gg==",
|
||||
"version": "7.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.1.3.tgz",
|
||||
"integrity": "sha512-KJ3AfgjTn3tJz/XKF+BlVShNPecim3G21oHRue+YQOsooW+0s+qXvm09U09aO7yBza5SivL1QgxSrzAbiKWjhQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"rfdc": "^1.3.1"
|
||||
@ -5644,14 +5644,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/vite-plugin-vue-devtools": {
|
||||
"version": "7.1.2",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-vue-devtools/-/vite-plugin-vue-devtools-7.1.2.tgz",
|
||||
"integrity": "sha512-TQm0sLGlAI9zEG6wZSzadBqzLOJ0VVUOvgRv2uqx/O1cEfH7UHuGkkGMFaeSQfbRWzD1OnOsJHsTMaUZB6m8iQ==",
|
||||
"version": "7.1.3",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-vue-devtools/-/vite-plugin-vue-devtools-7.1.3.tgz",
|
||||
"integrity": "sha512-qv8Z4yok9RYo6TEs89WnIAlmTHby/+XTim8tlSnMs3lAPcQqqcl/wGRY8gAeYrGCANngOqO+VuabW3Jb1HZtyw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@vue/devtools-core": "^7.1.2",
|
||||
"@vue/devtools-kit": "^7.1.2",
|
||||
"@vue/devtools-shared": "^7.1.2",
|
||||
"@vue/devtools-core": "^7.1.3",
|
||||
"@vue/devtools-kit": "^7.1.3",
|
||||
"@vue/devtools-shared": "^7.1.3",
|
||||
"execa": "^8.0.1",
|
||||
"sirv": "^2.0.4",
|
||||
"vite-plugin-inspect": "^0.8.4",
|
||||
|
Before Width: | Height: | Size: 2.2 MiB After Width: | Height: | Size: 2.2 MiB |
Binary file not shown.
Before Width: | Height: | Size: 61 KiB |
@ -7,8 +7,7 @@ const gameConfig = {
|
||||
scale: {
|
||||
mode: Phaser.Scale.FIT,
|
||||
autoCenter: Phaser.Scale.CENTER_BOTH,
|
||||
width: 1280,
|
||||
height: 720,
|
||||
|
||||
},
|
||||
render: {
|
||||
roundPixels: true,
|
||||
@ -19,6 +18,20 @@ const gameConfig = {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.game-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
.game {
|
||||
border: 1px solid red;
|
||||
}
|
||||
</style>
|
||||
|
||||
<template>
|
||||
<div class="game-container">
|
||||
<Game :config="gameConfig" class="game" />
|
||||
|
@ -7,41 +7,34 @@ class Example extends Phaser.Scene
|
||||
}
|
||||
|
||||
preload () {
|
||||
this.load.image('tiles', '/assets/tilesets/1.png');
|
||||
this.load.image('tiles', '/assets/tilesets/default.png');
|
||||
}
|
||||
|
||||
/**
|
||||
* tile width: 63,
|
||||
* tile height: 32,
|
||||
* total w: 640,
|
||||
* total h: 4000,
|
||||
*/
|
||||
|
||||
create () {
|
||||
const mapData = new Phaser.Tilemaps.MapData({
|
||||
width: 63,
|
||||
height: 32,
|
||||
tileWidth: 63,
|
||||
tileHeight: 32,
|
||||
orientation: Phaser.Tilemaps.Orientation.ISOMETRIC,
|
||||
format: Phaser.Tilemaps.Formats.ARRAY_2D
|
||||
format: Phaser.Tilemaps.Formats.ARRAY_2D,
|
||||
width: 10,
|
||||
height: 10,
|
||||
tileWidth: 64,
|
||||
tileHeight: 32,
|
||||
});
|
||||
|
||||
const map = new Phaser.Tilemaps.Tilemap(this, mapData);
|
||||
const tileset = map.addTilesetImage('1', 'tiles');
|
||||
const layer = map.createBlankLayer('layer', tileset, 350, 200);
|
||||
const tileset = map.addTilesetImage('tiles', 'tiles');
|
||||
const layer = map.createBlankLayer('layer', tileset);
|
||||
|
||||
const data = [
|
||||
[ 1, 2, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ],
|
||||
[ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 1, 1, 1, 1, 1, 1, 1, 1, 0 ],
|
||||
[ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ],
|
||||
];
|
||||
|
||||
let y = 0;
|
||||
@ -53,11 +46,14 @@ class Example extends Phaser.Scene
|
||||
y++;
|
||||
});
|
||||
|
||||
var cam = this.cameras.main;
|
||||
// middle of the screen by default
|
||||
const centerX = map.widthInPixels / 1.5;
|
||||
const centerY = map.heightInPixels / 2;
|
||||
layer.setPosition(centerX, centerY);
|
||||
|
||||
let cam = this.cameras.main;
|
||||
this.input.on("pointermove", function (p) {
|
||||
if (!p.isDown) return;
|
||||
|
||||
cam.scrollX -= (p.x - p.prevPosition.x) / cam.zoom;
|
||||
cam.scrollY -= (p.y - p.prevPosition.y) / cam.zoom;
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user