Grafici lineari animati con funzioni grafiche lineari primitive Java

Question

Nello sforzo di saperne di più su applet e Java, sto sperimentando la creazione di applet wave disegnando linee (drawLine) e realizzando grafici a linee animati.

Posso creare un grafico statico bene. Tuttavia, sto lottando con l'aspetto animato del grafico: gli assi del grafico dovrebbero spostarsi da sinistra a destra, aumentando e crescendo più di 0.

Il mio problema è tradurre le mie esigenze in una soluzione. Qualcuno può darmi qualche suggerimento con il mio problema?

Ho un array multidimensionale indicizzato da punti contenenti la xey di un punto particolare. Ho provato a modificare la mia funzione di rendering per ridurre le X per farla apparire come se si stesse muovendo a sinistra ma non funziona correttamente.

Quale approccio sto cercando di adottare? Quanto sarà diverso il mio approccio se i valori di Y potessero cambiare a causa dell'azione dell'utente o di dati aggiunti?

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import java.util.Random;

/**
 * A graph that should in the future represent a wave according to my inputs
 * 
 * @authorImprofane
 * @version 1
 */
public class Graph extends JFrame
{
    private InnerGraph inner;

    private int width;
    private Random RNG;
    private int height;
    private int[][] series;

    private int xoffset;
    int prevx = 0;
    int prevy = 0;



    /**
     * Constructor for objects of class Graph
     */
    public Graph(int width, int height) throws InterruptedException
    {
         RNG = new Random();
         setTitle(" Graph");

         series = new int[width][2];

         this.width = width;
         this.height = height;
         inner = new InnerGraph(width, height);

         add(inner, BorderLayout.CENTER);

         setVisible(true);
         inner.preparePaint();
         pack();
         updateGraph();
    }

    public static void main(String[] args) throws InterruptedException
    {
        new Graph(300, 300);
    }

    public void updateGraph() throws InterruptedException
    {   

        // virtual x is how far along on the x axis we are, I ignore the 'real' X axis
        int vx = 0;
        int point = 0;
        int xdecay = 0;
        int inc = 5;

        // how many times we need to plot a point
        int points = (int) java.lang.Math.floor( width / inc );
            System.out.println(points);
            inner.preparePaint();
            // draw all points to graph

            // make some junk data, a saw like graph
            for (vx = 0 ; vx < points ; vx++) {
                series[vx] = new int[] { vx*inc, ( (vx*inc) % 120 ) };
            }

            Thread.sleep(150);
            int n = 5;

        while(n > 0) {
            System.out.println(xdecay);
            inner.preparePaint();
                for (vx = 0 ; vx < points ; vx++) {
                    inner.updateSeries(vx, xdecay);

                    inner.repaint();
                    Thread.sleep(50);
                }
                xdecay += inc;

                // shift the data points to the left
                int[][] nseries = new int[points][2];
                // System.arraycopy(series, 1, nseries, 0, points-1);
                n--;
            }

    }

    public class InnerGraph extends JPanel
    {
        private Graphics g;
        private Image img;

        private int gwidth;
        private int gheight;

        Dimension size;

        public InnerGraph(int width, int height)
        {
            gwidth = width;
            gheight = height;
            size = new Dimension(1, 1);


        }

        /**
         * Try make panel the requested size.
         */
        public Dimension getPreferredSize()
        {
            return new Dimension(gwidth, gheight);
        }

        /**
         * Create an image and graphics context
         * 
         */

        public void preparePaint()
        {          
            size = getSize();
            img = inner.createImage( (size.width | gwidth), (size.height | gheight) );
            g = img.getGraphics();


        }

        /**
         * Draw a point to the chart given the point to use and the decay. 
         * Yes this is bad coding style until I work out the mathematics needed
         * to do what I want.
         */

        public void updateSeries(int point, int decay)
        {
            g.setColor(Color.blue);
            int nx = series[point][0];

            series[point][0] -= decay;
            if ( point-1 >= 0 ) {
                series[point-1][0] -= decay;
            }

            int ny = series[point][1];
            prevx -= decay;

            g.drawLine(prevx-decay, prevy, nx-decay, ny );         
            prevx = nx-decay;
            prevy = ny;
        }


        public void paintComponent(Graphics g)
        {
                    g.drawImage(img, 0, 0, null);
}
    }

}

Answer 1

In primo luogo, sembra che si sottragga il decadimento troppo spesso nel metodo updateSeries. Di seguito è una nuova versione di quel metodo.

public void updateSeries(int point, int decay)
    {

        g.setColor(Color.blue);
        int nx = series[point][0];

        series[point][0] -= decay;
        if ( point-1 >= 0 ) {
            series[point-1][0] -= decay;
        }

        int ny = series[point][1];
    //    prevx -= decay;

    //    g.drawLine(prevx-decay, prevy, nx-decay, ny );         
    g.drawLine(prevx, prevy, nx-decay, ny );     
        prevx = nx-decay;
        prevy = ny;
    }

Con questi cambiamenti, le linee disegnano meglio, ma disegnano così lentamente che l'animazione è difficile da vedere. Probabilmente dovrai creare una nuova grafica e scambiare tutto in modo da non dover guardare ogni singolo segmento di linea che viene disegnato.

Answer 2

Per cominciare puoi dare un'occhiata al seguente esempio (e quelli relativi a questo)

Scorri grafico @ java2s.com