JavaFX: Ajout de la ligne au chemin en tant qu'animation

Question

J'essaie de créer un graphique animé qui se développe vers la droite lorsque de nouvelles données sont ajoutées. J'utilise un chemin pour tracer les variables (JavaFX LineChart semble trop lent), essayant de tracer une nouvelle variable toutes les 500ms en ajoutant une nouvelle LineTo à l'ensemble des éléments de chemin. J'ai réduit le problème à l'exemple de code suivant. Quelqu'un pourrait-experts JavaFX me dire pourquoi cela ne se traduit pas par une ligne qui pousse vers le bas et vers la droite comme le temps passe ?:

var newX = 10; 
var lineElements: PathElement[]; 


Timeline { 
    repeatCount: Timeline.INDEFINITE 
    keyFrames: [ 
     KeyFrame { 
     time: 500ms 
     canSkip: false 
     action: function() { 
      newX = newX + 10; 
      insert [LineTo {x: newX, y: 100}] into lineElements; 
     } 
     } 
    ] 
}.play(); 

Stage { 
    title: "Application title" 
    scene: Scene { 
     width: 250 
     height: 80 
     content: [ 
     Path { 
      fill: null 
      stroke: Color.RED 
      strokeWidth: 2 
      elements: bind lineElements = [ 
       MoveTo { 
        x: 0 
        y: 100 
       } 
      ] 
     } 
     ] 
    } 
} 

Merci un bouquet.

Answer 1

Je pense que vous faites deux choses mal:

Je n'aime pas l'ordre d'initialisation, mais cela pourrait être juste une chose de style

Vous devez également augmenter Y ou faire vos PathElements par rapport à l'autre .

var lineElements: PathElement[] = [MoveTo { 
    x: 0 
    y: 100 
}]; 
Timeline { 
    repeatCount: Timeline.INDEFINITE 
    keyFrames: [ 
     KeyFrame { 
     time: 500ms 
     canSkip: false 
     action: function() { 
      insert LineTo {x: 10 y: 10 absolute: false} into lineElements; 
     } 
     } 
    ] 
}.play(); 

Stage { 
    scene: Scene { 
     content: [ 
     Path { 
      fill: null 
      stroke: Color.RED 
      strokeWidth: 2 
      elements: bind lineElements 
     } 
     ] 
    } 
}