TheAlmightyOne

Members
  • Content Count

    7
  • Joined

  • Last visited

  • Days Won

    1

TheAlmightyOne last won the day on April 2

TheAlmightyOne had the most liked content!

About TheAlmightyOne

  • Rank
    Newbie
  1. You can use Bresenham's algorithm to create a line of sight sort of check between moves that are larger than terrain obstacle might be.
  2. Sure you can. If you're brave enough you can use webRTC over UDP and create you own UDP stack to handle packet order/drops etc. This has an additional advantage of less overhead in each message and that in turn means possible performance improvements.
  3. In many cases you can assume the container size and just add a PIXI.Graphic to that container like so. if (clientConfig.drawChunkGrid && layer.name === 'front') { const grid = new PIXI.Graphics() const text = new PIXI.Text(`${chunkPosition.x}, ${chunkPosition.y}`, { fontFamily: 'ArcadeClassic', fontSize: '16px', fill : '#fff', align: 'center', stroke: '#000', strokeThickness: 4 }) grid.lineStyle(1, 0x000000, 0.6) grid.moveTo(0, 0) grid.drawDashLine(fs * clientConfig.chunkSize.x, 0, 8, 8) grid.moveTo(0, 0) grid.drawDashLine(0, fs * clientConfig.chunkSize.y, 8, 8) chunkContainer.addChild(grid) chunkContainer.addChild(text) } use lineTo instead of this custom drawDashLine. In this case my chunkContainers already have positions and constant dimensions.
  4. I will take that into consideration. For now, there is no way I can benchmark the impact of this implementation but, should the optimization time come, this is the first thing I'll be looking into.
  5. Thanks for your answer. Ok I have a hack/fix figured out. What I did was just set filterautoFit = false AND I moved every layer affected by that filter by half of the scale. Which right now looks like this: for(let container in this.scene) { const s = this.scene[container]; let filterScaleX = 0; let filterScaleY = 0; if (s.filters && s.filters[0] && s.filters[0].scale) { filterScaleX = s.filters[0].scale.x / 2; filterScaleY = s.filters[0].scale.y / 2; } s.x = ((this.origin.x - (player.x + player.ax) + playerOffset.x) * fs) - filterScaleX; s.y = ((this.origin.y - (player.y + player.ay) + playerOffset.y) * fs) - filterScaleY; } In retrospect the autoFit property fixed the 'overflow' effect and moving layers fixed the obvious problem where they were in a wrong position (which was visible on the tree tops). Thanks for your input man, it did indirectly lead me to a solution.
  6. Hi, I've long wanted to implement a neat looking invisibility effect for my game, tried using DisplacementFilter, but stumbled upon an issue with scale property. While it works correctly to displace areas under the displacement sprite I created, it also displaces entire container on which the filter is applied. I presume its from non existent knowledge about the subject and how those filters work, but I'm still hoping for either a fix or a reasonable explanation if anyone can help me with this please. Everything in my code follows DisplacementMap example on pixijs.com (one with the grass and magnifying glass). What is different is my stage tree. I have 3 containers for each layer and inside those there are separate containers for chunks that hold the map data, since it comes from the server. const playerSprite = new PIXI.Sprite(new PIXI.Texture(PIXI.utils.TextureCache['player.eyes'])); const displacementSprite = new PIXI.Sprite( new PIXI.Texture(PIXI.utils.TextureCache['player.normal']) ); let displacementFilter = new PIXI.filters.DisplacementFilter(displacementSprite); playerSprite.position.set(16 / globalScale * fs, (8 - globalScale) / globalScale * fs); playerSprite.scale.set(globalScale, globalScale) this.scene.addChild(playerSprite); this.scene.addChild(displacementSprite); displacementFilter.scale.x = 20; displacementFilter.scale.y = 20; displacementFilter.enabled = true; displacementSprite.position.set(16 / globalScale * fs, (8 - globalScale) / globalScale * fs); displacementSprite.scale.set(globalScale, globalScale) return { scene: this.scene, filter: displacementFilter }; the return value from this block is added to the main stage container, and filters are applied to bottom 2 layers. Should i perhaps look into filterArea? Here is the undesired effect on the edges. You can also see the slanted top layer on the trees. so 2 layers are moved by the filters scale property.