drawing many graphics efficiently

[barrard]

Hey thanks for reading/offering help with my question.

 

I'm drawing roughly about 100 horizontal Graphics.drawRect() on a canvas with Pixi.js as seen here

Each horizontal line is a color filled rect using Graphics.

This is simple enough, and poses little efforts to draw even when zooming and panning.

 

The question is, and What I want to do, is,

I want to draw many more of these lines, which wont go all the way across, but small vertical slivers as depicted here

 

This is over simplified, as I would like to draw up to 43,000 of these small vertical slices of colored horizontal lines.

 

How/what is the best way to do this without simply drawing 400k graphics on the canvas???

-is this not  good idea?

Thanks

 

 

P.S.

This is what I'm trying to mimic

Edited April 26, 2023 by barrard

[ivan.popelyshev]

Btw, plot-crypto-related stuff I did is under NDA ) cant help, except.. i can point you to https://github.com/gameofbombs/pixi-candles as a base if you are ready to write better shaders for such things ) 43k small bars should work fine there

[barrard]

So likely drawing each individual line would be the best/only way?

there would be about 100 horizonal lines per veritcal slice, and up to 43k slizes, so 400k+
can I draw a single Rect and fill with different colors ?