una - lineshape c#

¿Cuáles son las formas más rápidas de dibujar gráficos que dibujando líneas separadas?

Question

A partir de ahora estoy dibujando mis gráficos de rendimiento de depuración con rectángulos de 1px estirados a la altura necesaria, pero dibujar una gran cantidad de datos provoca una pérdida significativa de rendimiento.

Actualmente, la lógica es: recopilar todos los tiempos para el cuadro actual, colocarlos en el Queue<float> sy dibujar un gráfico para cada cola dibujando 300 sprites estirados de 1px. Hay 4 gráficos, por lo que hay 1200 sprites en superposición de depuración sola, lo cual consume muchos recursos.

¿Hay una mejor manera de dibujar gráficos que al menos no requieran dibujar tantos sprites?

Answer 1

Lista de líneas

Puede usar matrices VertexPositionColor para almacenar valores de gráficos individuales, luego use GraphicsDevice.DrawUserIndexedPrimitives<VertexPositionColor> junto con una lista de líneas definidas (índices) para dibujarlos con proyección ortográfica.

_{El archivo .gif se redimensiona al 50% debido al tamaño del archivo.}

Estoy dibujando estas muestras (4 gráficos con 300 puntos de valor / píxeles cada uno) a 60 fps.

Triangle Strip

Si necesita llenar los gráficos debajo de la línea, podría dibujar una franja triangular (con puntos en la parte inferior del gráfico).

Código de lista de líneas

Aquí está el código relevante para el primer gráfico representado arriba:

Matrix worldMatrix;
Matrix viewMatrix;
Matrix projectionMatrix;
BasicEffect basicEffect;

VertexPositionColor[] pointList;
short[] lineListIndices;

protected override void Initialize()
{
    int n = 300;
    //GeneratePoints generates a random graph, implementation irrelevant
    pointList = new VertexPositionColor[n];
    for (int i = 0; i < n; i++)
        pointList[i] = new VertexPositionColor() { Position = new Vector3(i, (float)(Math.Sin((i / 15.0)) * height / 2.0 + height / 2.0 + minY), 0), Color = Color.Blue };

    //links the points into a list
    lineListIndices = new short[(n * 2) - 2];
    for (int i = 0; i < n - 1; i++)
    {
        lineListIndices[i * 2] = (short)(i);
        lineListIndices[(i * 2) + 1] = (short)(i + 1);
    }

    worldMatrix = Matrix.Identity;
    viewMatrix = Matrix.CreateLookAt(new Vector3(0.0f, 0.0f, 1.0f), Vector3.Zero, Vector3.Up);
    projectionMatrix = Matrix.CreateOrthographicOffCenter(0, (float)GraphicsDevice.Viewport.Width, (float)GraphicsDevice.Viewport.Height, 0, 1.0f, 1000.0f);

    basicEffect = new BasicEffect(graphics.GraphicsDevice);
    basicEffect.World = worldMatrix;
    basicEffect.View = viewMatrix;
    basicEffect.Projection = projectionMatrix;

    basicEffect.VertexColorEnabled = true; //important for color

    base.Initialize();
}

Para dibujarlo:

foreach (EffectPass pass in basicEffect.CurrentTechnique.Passes)
{
    pass.Apply();
    GraphicsDevice.DrawUserIndexedPrimitives<VertexPositionColor>(
        PrimitiveType.LineList,
        pointList,
        0,
        pointList.Length,
        lineListIndices,
        0,
        pointList.Length - 1
    );
}

Para el gráfico de la franja triangular, modifique el código para mostrar una franja triangular , y para cada punto en la curva gráfica coloque uno en la parte inferior de la gráfica.