Draw a lot of simple geometry with zoom (x,y or just one of this), pan, drag&drop

[zip87]

Hi everybody, I'm new on this library and I landed here for the offered support on Pixi library. I'm trying to migrate a .net 2D engine to Angular project.
This homemade engine only handles rectangles and allows developers to manage simply the model and return the rectangle to draw, after applying zoom and pan.
You can zoom in one or two directions and drag&drop.
Obviously we do not only draw rectangles, but by approximating the geometry to a rectangle we can draw any path.

Up to now I have tried the viewport and cull library, to manage zoom and cull (I have a model with 200k-300k rectangles)
I'm studying / experimenting with Pixi, and I'm worried about the zoom. Do you have any general suggestion? Not only for the zoom, but, for example, is it better to use graphics or sprites?

[ivan.popelyshev]

Obligatory note: in WebGL this knowledge means you can have a huge salary, because its needed by many startups right now.

This is huge.

General suggestion: pixi-viewport + graphics + sprites , whatever you can use. Culling is usually on your side.

You have to know how to sprites wor, you have to know how texture filtering works in WebGL and what are mipmaps.

You have to know how graphics works in details, how is it translated to WebGL operations.

If you dont know that - no guarantees.

Regarding vector shapes in general, there are breakthroughs like https://github.com/pixijs/graphics-smooth that can zoom without changing line width, but to make things like that someone has to actually sacrifice a lot of time and money and just publish commercial-grade stuff for free.

Please give more concrete questions - we can help you with details.

 

Edited July 26, 2021 by ivan.popelyshev