• Content count

  • Joined

  • Last visited

About westy

  • Rank

Contact Methods

  • Twitter

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Yep! As I said in the OP, I am using a custom renderer plugin which is pretty much identical to the renderer plugin example, minus the cropping.
  2. @botmaster Thanks for your response! I'm not really talking about sampling here - I'm talking about how many fragments the shader is actually processing. In my tests, this seems to be completely determined by the size of the sprite in the viewport, as well as the renderer resolution. The size of the underlying texture makes no difference. I assume this behaviour is perfectly expected. I guess what I really want to do is lower the *resolution* for a specific sprite which uses a custom renderer without affecting the resolution of the rest of the game.
  3. @ivanpop I was able to create a lower resolution texture by using a render texture. However, when the sprite is upscaled, the fragment shader still runs on every on-screen pixel, even though the texture itself is noticeably blocky. I suppose this is natural webGL behaviour? I suppose the alternative would be to have the sprite render to a texture every frame, but I imagine there are significant penalties there as well...
  4. I have a custom renderer plugin (based off https://github.com/pixijs/pixi-plugin-example) that employs a very expensive fragment shader. The sprite it applies to (a map) often covers the entire screen. I'd like to be able to optionally render at a lower resolution and then scale up the result so that the fragment shader doesn't need to apply to every single screen pixel. I understand that setting PIXI.settings.resolution will work here, but I don't want to change the resolution of the entire scene - just this object.
  5. @ivan.popelyshev Thanks! I'm not having much luck as I am struggling to understand both why such clipping is necessary (Does PIXI bleed textures internally or something to overcome some webgl issues?), as well as where the (0.5, 0.5, w-0.5, h-0.5) / (w,h) comes from. I also can't find any documentation on the texture transform that the sprite mask example uses, and how that factors in here.
  6. @Exca that looks great! However, I notice there's still some margin/bleed around the edge of the sprite, any idea what's causing this and if I can prevent it?
  7. I want to make a filter that uses multiple source textures. Each source texture is the same size (or, will be scaled to the same size). I've played around with a few different ways of handling this, without much success. I had a look at the guide to create filters in v4 but the documentation for this case leaves a little to be desired. I've been somewhat successful but there are still certain issues: The second texture seems to be slightly scaled up, leading to misalignment and a weird margin. Whenever the sprite goes out of bounds, the coordinate systems go out of whack. You can see the issue in action in this jsfiddle. I need a way to have the source textures line up perfectly, without the misalignment/weird margin. (we can ignore rotation!) 'autoFit' must be true for my application for performance reasons.
  8. I've been working with PIXI filters recently. If I apply the filter to a sprite with alpha, I've noticed that somewhere along the line the alpha gets premultiplied. For example, I have a test texture with a pixel saved as [255, 255, 255, 128]. When I sample the texture, in a filter Instead of [1.0, 1.0, 1.0, 0.5] the result is [0.5, 0.5, 0.5, 0.5]. How can I turn off this premultiplying behaviour? I've tried 'transparent: false' and 'transparent: "notMultiplied" ' in the webGL renderer settings, but neither of those seemed to make any difference?
  9. westy

    How to draw an infinitely zoomable SVG file?

    Thanks Ivan! using PIXI SVG Graphics is giving me great results, cheers.
  10. westy

    How to draw an infinitely zoomable SVG file?

    @ivan.popelyshev Thank you for your reply! The texture will be full screen and will need to update at 60fps, so pushing a brand new huge texture to the GPU each frame sounds like it would be too expensive. Sadly I'll need multiple colours (I guess I could use multiple meshes though!) Thankfully I don't need gradients (well, what I really need is a signed distance field texture, but from what I've seen this can be generated at some cost in a fragment shader). I'll give you some more details as to my intended application: The game world is a large map composed of multiple provinces. The player can zoom in/out of this map to a big degree. I want the map to have animated details, e.g. coastal waves, and fun textures etc. It strikes me that the best way to do this without loading in huge textures would be to generate the detail dynamically in a fragment shader. My end goal is to have a full-screen fragment shader with access to the following information per pixel (besides simply x/y): Which province (or ocean, if no province) Distance from the border (Using a signed distance field technique, e.g. Jump Flooding) My idea so far is to use an SVG image that would look like this: And then, if PIXI is able to render it zoomed in at arbitrary resolution (this is where I'm stuck), that could be used as input for a fragment shader with the required information.
  11. I have a detailed SVG file, and I want to be able to zoom in and out of it in-game, by a large factor, in realtime, while still maintaining perfectly crisp antialiased edges. From what I've gathered, PIXI's SVG support is limited to pre-rendering a raster texture on load, which wouldn't work here as the required resolution for the closest zoom level would create an unmanagably huge texture. I don't need support for gradients etc, just simple colours and paths. I could triangulate the SVG file using something like svg-mesh-3d and then render it out as a mesh, however that leaves the question of how to render out the colours properly - I'm not quite sure how a PIXI mesh object could be made to handle this. Perhaps some kind of shader? Also, the triangulation has the downside that smooth curves will have a limited 'resolution' depending on the number of triangles, but that's not a massive issue for my application. Is there a better way I'm missing? If not, any guidance on how to handle the colour rendering on the mesh would be appreciated.
  12. Thanks Ivan, that sounds exactly like what I'm after. I'll give it a try. I don't really like the idea of forking PIXI functionality but I guess in this case it's a pretty subtle change.
  13. I have a horizontally tiling texture that I want to use to create flexible ropes in PIXI. I followed the same general path as is mentioned here, and it works, however I do have a slight worry. Every different length of rope in this case means another texture in image memory with size proportional to the rope length. I want to have a large number of ropes, all of different lengths. This feels quite expensive to me - is there a more efficient way to do this that doesn't involve baking a new texture for every rope length?
  14. westy

    Advanced interaction event handling

    This is what I've been doing, however event bubbling means that the modal will close when the modal itself is clicked, which is something I don't want.
  15. westy

    Advanced interaction event handling

    All right, but how does that help? It's easy enough to listen for a click event anywhere on the stage (just make the stage interactive), what I need to do is essentially filter out the events that passed through certain specific display objects.