Quels sont les moyens les plus rapides pour dessiner des graphiques qu’en traçant des lignes séparées?

À partir de maintenant, je dessine mes graphiques de performances de débogage avec des rectangles de 1px étirés à la hauteur requirejse, mais dessiner beaucoup de données de cette façon entraîne une perte de performance significative.

Actuellement, la logique est la suivante: collecter tous les synchronisations pour l’image actuelle, les placer dans les Queue et tracer un graphique pour chaque queue en traçant 300 images-objects étirées de 1px étirées. Il y a 4 graphiques, donc 1200 sprites dans la superposition de débogage seulement, ce qui consum des ressources.

Existe-t-il une meilleure façon de dessiner des graphiques qui au moins ne nécessiteront pas autant de sprites?

Liste de lignes

Vous pouvez utiliser des tableaux VertexPositionColor pour stocker des valeurs de graphique individuelles, puis utiliser GraphicsDevice.DrawUserIndexedPrimitives avec une liste de lignes définie (indices) pour les dessiner avec une projection orthographique.

entrez la description de l'image ici
_{Le .gif est redimensionné à 50% en raison de la taille du fichier.}

Je dessine ces échantillons (4 graphiques avec 300 points de valeur / pixels chacun) à 60 images par seconde.

entrez la description de l'image ici

Bande de sortingangle

Si vous devez remplir les graphiques sous la ligne, vous pouvez dessiner une bande de sortingangle (avec des points au bas du graphique).

entrez la description de l'image ici

Code de liste de lignes

Voici le code pertinent pour le premier graphique rendu ci-dessus:

 Masortingx worldMasortingx; Masortingx viewMasortingx; Masortingx projectionMasortingx; 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(); }

Pour le dessiner:

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

Pour le graphique en bandes sortingangulars, modifiez le code pour afficher une bande sortingangular , et pour chaque sharepoint la courbe graphique, placez-en un au bas du graphique.