2010-02-15 2 views
2

새로운 데이터가 추가되면 오른쪽으로 커지는 애니메이션 차트를 만들려고합니다. 나는 변수를 계획하기위한 경로를 사용하고 있습니다 (JavaFX LineChart가 너무 느림). 경로 요소 집합에 새 LineTo를 추가하여 매 500ms마다 새 변수를 플롯하려고 시도합니다. 문제를 다음 샘플 코드로 줄였습니다. 시간은?JavaFX : 경로를 애니메이션으로 경로에 추가합니다.

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 
       } 
      ] 
     } 
     ] 
    } 
} 

덕분에 무리를 통과이 아래로 성장하는 라인에서 오른쪽으로 발생하지 않는 이유를 어떤 자바 FX 전문가들은 말해 수 없습니다.

답변

2

난 당신 잘못이 일을 생각 :

내가 초기화 순서를 싫어하지만 당신은 또한 Y를 증가 또는 서로에 대해 당신의 PathElements을 만들 필요가 단지 스타일 일

수 있습니다 .

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 
     } 
     ] 
    } 
} 
+1

답장을 보내 주셔서 감사합니다. 나는 '친척 : true'대신 'absolute : false'를 사용해야했지만, 그건 내가 알지 못하는 멋진 트릭입니다. 보다 합리적인 변수 초기화와 함께 당신은 확실히 트릭을 완료 제안! – peteroyle

+1

예제를 표시하려면 Scene에 width/height 속성을 추가해야했습니다. –