• Content Count

  • Joined

  • Last visited

  1. What is the maximum number of renderTextures pixi can handle with ease?
  2. @b10b How to get fast performance for rendering lines with more than 30k points ? Also, the lines will be updated in realtime and can have linewidth more than 1. So, can't use the nativeLine method. Is there any way to use this kind of texture and sprite method here also or any other way to get the best performance?
  3. I want to render 50k circles of varying radius and colors. The radius can vary from 1 to 1000. I want to show it in a scatterplot chart where there are circles of different sizes and colors. I have made this codepen sample where I am drawing 10k circles and changing the radius and color of circles by clearing the graphics and rerendering it. The frame rate drops to 4fps. https://codepen.io/ranajitbanerjee/full/abNRRXN How can I make it faster?
  4. @ivan.popelyshev Can you give an example code where varying sizes and colors of 20k or more rectangles are rendered using sprites?
  5. Yes I have measured only the first render. Also I have set antialias to true in application options new PIXI.Application({ antialias: true, width, height });
  6. I am building a visualization library where I have to render more than 20k rectangles with different color and sizes. I am using a single graphics object to render all the rectangles. The canvas implementation takes only 3ms to render while the pixijs implementation takes more than 30-40ms to render. Is there any better way to draw primitives using pixi other than graphics? Here is the pixijs code: And here is the canvas code:- function createRectsUsingCanvas (container, width, height, points) { var canvas = document.createElement('canvas'); var ctx = c.getContext("2d"); container.appendChild(canvas); c.width = width; c.height = height; ctx.beginPath(); points.forEach((point, i) => { const {x, y, width, height} = point; ctx.rect(x, y, width, height); }); ctx.stroke(); }