javafx中的动态条形图

您好，我正在尝试创建显示字段值的条形图。字段值通过排序算法更改，图表应显示任何更改

public class FXMLDocumentController implements Initializable {

    static int[] pole = new int[10]; // field
    int hodnota;

    @FXML               // bar chart
    private BarChart barChart; 

    @FXML
    private void handleButtonAction(ActionEvent ev) { //button for filling up new random graph

        for (int i = 0; i < 10; i++) {
            hodnota = intValue((StrictMath.random() * 100));        
            pole[i] = hodnota;
        }

        final CategoryAxis osaX = new CategoryAxis();          
        final NumberAxis osaY = new NumberAxis();
        ObservableList<XYChart.Series<String, Number>> barChartData = FXCollections.observableArrayList();
        final BarChart.Series<String, Number> series1 = new BarChart.Series<>();
        series1.getData().add(new XYChart.Data<>("1", pole[0]));        
        series1.getData().add(new XYChart.Data<>("2", pole[1]));
        series1.getData().add(new XYChart.Data<>("3", pole[2]));
        series1.getData().add(new XYChart.Data<>("4", pole[3]));
        series1.getData().add(new XYChart.Data<>("5", pole[4]));
        series1.getData().add(new XYChart.Data<>("6", pole[5]));
        series1.getData().add(new XYChart.Data<>("7", pole[6]));
        series1.getData().add(new XYChart.Data<>("8", pole[7]));
        series1.getData().add(new XYChart.Data<>("9", pole[8]));
        series1.getData().add(new XYChart.Data<>("10", pole[9]));
        barChartData.add(series1);
        barChart.setData(barChartData);
    }

    @FXML // button which starts sorting algorhitm, it is changing values in field
    private void bubbleButton(ActionEvent ev) { 
        BubbleSort vlakno=new BubbleSort("vypoctoveVlakno");
        vlakno.start(); 
    }     

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }
}

公共类FXMLDocumentController实现可初始化{
静态整数[]极点=新整数[10]；//字段
霍德诺塔国际酒店；
@FXML//条形图
私人条形图；
@FXML
私有void handleButtonAction（ActionEvent ev）{//填充新随机图的按钮
对于（int i=0；i<10；i++）{
hodnota=intValue（（StrictMath.random（）*100））；
极点[i]=霍德诺塔；
}
最终类别Axis osaX=新类别Axis（）；
最终NumberAxis osaY=新的NumberAxis（）；
ObservableList barChartData=FXCollections.observableArrayList（）；
最终条形图.Series系列1=新的条形图.Series（）；
series1.getData（）.add（新的XYChart.Data（“1”，极点[0]）；
series1.getData（）.add（新的XYChart.Data（“2”，极点[1]）；
series1.getData（）.add（新的XYChart.Data（“3”，极点[2]）；
series1.getData（）.add（新的XYChart.Data（“4”，极点[3]）；
series1.getData（）.add（新的XYChart.Data（“5”，极点[4]）；
series1.getData（）.add（新的XYChart.Data（“6”，极点[5]）；
series1.getData（）.add（新的XYChart.Data（“7”，极点[6]）；
series1.getData（）.add（新的XYChart.Data（“8”，极点[7]）；
series1.getData（）.add（新的XYChart.Data（“9”，极点[8]）；
series1.getData（）.add（新的XYChart.Data（“10”，极点[9]）；
barChartData.add（系列1）；
设置数据（barChartData）；
}
@FXML//按钮，用于开始排序algorhitm，它正在更改字段中的值
私有无效气泡按钮（ActionEvent ev）{
BubbleSort vlakno=新的BubbleSort（“vypoctoveVlakno”）；
vlano.start（）；
}     
@凌驾
公共void初始化（URL、ResourceBundle rb）{
//待办事项
}
}

我已经尝试创建一个新线程，它应该一次又一次地加载数据，但没有成功。还尝试将其加载到FXML控制器中，但图形窗口被卡住。事实上我对这个很陌生

FXML文档，main刚刚从FXML加载stage

<AnchorPane id="AnchorPane" prefHeight="487.0" prefWidth="610.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="radicialgoritmy.FXMLDocumentController"> 
<children>  
<Button fx:id="button" layoutX="14.0" layoutY="14.0" onAction="#handleButtonAction" text="Vygeneruj" />  
<BarChart fx:id="barChart" animated="false" cache="true" layoutX="30.0"     layoutY="188.0" legendVisible="false" prefHeight="292.0" prefWidth="552.0">  
  <xAxis>  
    <CategoryAxis fx:id="osaX" side="BOTTOM" />  
  </xAxis>  
  <yAxis>  
    <NumberAxis fx:id="osaY" side="LEFT" />  
  </yAxis>  
</BarChart>
  <Button fx:id="bubble" layoutX="100.0" layoutY="14.0" mnemonicParsing="false" onAction="#bubbleButton" text="BubbleSort" /> 

用于排序算法的类

class BubbleSort extends Thread {

    public BubbleSort(final String jmeno) {
        super(jmeno);
    }

    @Override
    public void run() {
        for (int i = 0; i < pole.length - 1; i++) {
            for (int j = 0; j < pole.length - i - 1; j++) {
                if (pole[j] < pole[j + 1]) {
                    final int tmp = pole[j];
                    pole[j] = pole[j + 1];
                    pole[j + 1] = tmp;
                }
                try {
                    Thread.sleep(250);
                } catch (final InterruptedException ex) {
                    Logger.getLogger(BubbleSort.class.getName()).log(Level.SEVERE, null, ex);
                }
            }
        }
    }
}

类BubbleSort扩展线程{
公共BubbleSort（最终字符串jmeno）{
超级（jmeno）；
}
@凌驾
公开募捐{
对于（int i=0；i

这里是mcve演示了一种将不断变化的数据耦合到

条形图的机制

还有其他方法可以实现这种“绑定”，但我尽量保持简单

气泡排序算法与问题无关，与答案无关
，所以最好把它排除在外。mcve需要演示问题/答案，而不是应用程序：

import java.util.Random;
import javafx.beans.Observable;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ListChangeListener.Change;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.chart.BarChart;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.chart.XYChart.Data;

public class FXMLDocumentController {

    @FXML private BarChart barChart;
    private ObservableList<XYChart.Series<String, Number>> barChartData;
    private ObservableList<DataItem> items;
    private  Random rnd = new Random();
    private static  int SIZE = 10;

    @FXML
    void initialize(){
        //an observable collection of DataItem objects, each representing data of one bar 
        items = FXCollections.observableArrayList(
                dataItem -> new Observable[] { dataItem.nameProperty(), dataItem.valueProperty()});
        //initialize with random values 
        for (int i = 0; i < SIZE; i++) {
            items.add(new DataItem(String.valueOf(i), rnd.nextInt(100)));
        }
    }

    @FXML
    private void handleButtonAction( ActionEvent ev) {

         ObservableList<Data<String, Number>> seriesData = new DataConvertor(items).getData();
         CategoryAxis osaX = new CategoryAxis();
         NumberAxis osaY = new NumberAxis();
        barChartData = FXCollections.observableArrayList();
         BarChart.Series<String, Number> series1 = new BarChart.Series<>();
        series1.setData(seriesData);
        barChartData.add(series1);
        barChart.setData(barChartData);
    }

    @FXML
    private void bubbleButton( ActionEvent ev) {
        BubbleSort vlakno=new BubbleSort(items);
        vlakno.start();
    }
}

//pojo to represent items of one bar
class DataItem {

    private StringProperty name = new SimpleStringProperty(this, "name");
    private IntegerProperty value = new SimpleIntegerProperty(this, "value");

    public DataItem( String name,  int value) {
        setName(name);
        setValue(value);
    }
    public StringProperty nameProperty() {
        return name;
    }
    public String getName() {
        return this.nameProperty().get();
    }
    public void setName( String name) {
        this.nameProperty().set(name);
    }
    public  IntegerProperty valueProperty() {
        return value;
    }
    public int getValue() {
        return this.valueProperty().get();
    }
    public void setValue( int value) {
        this.valueProperty().set(value);
    }
}

//simple coupling between items and graph data 
class DataConvertor{

    ObservableList<DataItem> items;
    ObservableList<Data<String, Number>>data;
     DataConvertor( ObservableList<DataItem> items) {
        super();
        this.items = items;
        data =  FXCollections.observableArrayList();
        items.forEach(item -> data.add(new Data<>(item.getName(), item.getValue())));
        items.addListener( ( Change<? extends DataItem> arg0 ) ->   update());
    }

    void update() {
        for(int i =0; i < data.size(); i++){
             Data<String, Number> d = data.get(i);
            d.setYValue(items.get(i).getValue());
        }
        data.clear();
        items.forEach(item -> data.add(new Data<>(item.getName(), item.getValue())));
    }

    ObservableList<Data<String, Number>>getData(){
        return data;
    }
}

请注意，中发布的fxml文件不完整。缺少这两个标签：

</children>   
</AnchorPane> 

我修改了你的程序，只是想给你一个实现这一点的方法。我使用
Timeline
来实现
BubbleSort

主要

控制器

import java.net.URL；
导入java.util.ArrayList；
导入java.util.array；
导入java.util.List；
导入java.util.ResourceBundle；
导入javafx.animation.KeyFrame；
导入javafx.animation.Timeline；
导入javafx.collections.FXCollections；
导入javafx.collections.ObservableList；
导入javafx.event.ActionEvent；
导入javafx.fxml.fxml；
导入javafx.fxml.Initializable；
导入javafx.scene.chart.BarChart；
导入javafx.scene.chart.CategoryAxis；
导入javafx.scene.chart.NumberAxis；
导入javafx.scene.chart.XYChart；
导入javafx.util.Duration；
导入静态oracle.jrockit.jfr.events.Bits.intValue；
公共类FXMLDocumentController实现可初始化{
时间线；
静态整数[]极点=新整数[10]；//字段
霍德诺塔国际酒店；
int ii；
@FXML//条形图
私人条形图；
@FXML
私有void handleButtonAction（ActionEvent ev）{//填充新随机图的按钮
对于（int i=0；i<10；i++）{
hodnota=intValue（（StrictMath.random（）*100））；
极点[i]=霍德诺塔；
}
最终类别Axis osaX=新类别Axis（）；
最终NumberAxis osaY=新的NumberAxis（）；
ObservableList barChartData=FXCollections.observableArrayList（）；
最终条形图.Series系列1=新的条形图.Series（）；
series1.getData（）.add（新的XYChart.Data（“1”，极点[0]）；
series1.getData（）.add（新的XYChart.Data（“2”，极点[1]）；
series1.getData（）.add（新的XYChart.Data（“3”，极点[2]）；
series1.getData（）.add（新的XYChart.Data（“4”，极点[3]）；
series1.getData（）.add（新的XYChart.Data（“5”，极点[4]）；
series1.getData（）.add（新的XYChart.Data（“6”，极点[5]）；
series1.getData（）.add（新的XYChart.Data（“7”，极点[6]）；
series1.getData（）.add（新的XYChart.Data（“8”，极点[7]）；
series1.getData（）.add（新的XYChart.Data（“9”，极点[8]）；
series1.getData（）.add（新的XYChart.Data（“10”，极点[9]）；
barChartData.add（系列1）；
设置数据（barChartData）；
ii=0；
时间线=新时间线（新关键帧（持续时间。秒（1），（事件）->{
System.out.println（ii+“：”+数组.toString（pole））；
对于（int j=0；j</children>   
</AnchorPane> 

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

/**
 *
 * @author sedri
 */
public class RradiciAlgoritmy extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

import java.net.URL;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.ResourceBundle;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.chart.BarChart;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.util.Duration;
import static oracle.jrockit.jfr.events.Bits.intValue;

public class FXMLDocumentController implements Initializable {

    Timeline timeline;
    static int[] pole = new int[10]; // field
    int hodnota;
    int ii;

    @FXML               // bar chart
    private BarChart barChart; 

    @FXML
    private void handleButtonAction(ActionEvent ev) { //button for filling up new random graph

        for (int i = 0; i < 10; i++) {
            hodnota = intValue((StrictMath.random() * 100));        
            pole[i] = hodnota;
        }

        final CategoryAxis osaX = new CategoryAxis();          
        final NumberAxis osaY = new NumberAxis();
        ObservableList<XYChart.Series<String, Number>> barChartData = FXCollections.observableArrayList();
        final BarChart.Series<String, Number> series1 = new BarChart.Series<>();
        series1.getData().add(new XYChart.Data<>("1", pole[0]));        
        series1.getData().add(new XYChart.Data<>("2", pole[1]));
        series1.getData().add(new XYChart.Data<>("3", pole[2]));
        series1.getData().add(new XYChart.Data<>("4", pole[3]));
        series1.getData().add(new XYChart.Data<>("5", pole[4]));
        series1.getData().add(new XYChart.Data<>("6", pole[5]));
        series1.getData().add(new XYChart.Data<>("7", pole[6]));
        series1.getData().add(new XYChart.Data<>("8", pole[7]));
        series1.getData().add(new XYChart.Data<>("9", pole[8]));
        series1.getData().add(new XYChart.Data<>("10", pole[9]));
        barChartData.add(series1);
        barChart.setData(barChartData);

        ii = 0;
        timeline = new Timeline(new KeyFrame(Duration.seconds(1), (event) -> {
            System.out.println(ii + ": " + Arrays.toString(pole));
            for (int j = 0; j < pole.length - (ii) - 1; j++) {
                if (pole[j] < pole[j + 1]) {
                    final int tmp = pole[j];
                    pole[j] = pole[j + 1];
                    pole[j + 1] = tmp;
                }               
            }

            //Create new data and set it to the series
            List<XYChart.Data<String, Number>> tempData = new ArrayList();
            for(int i = 0; i < pole.length; i++)
            {
                tempData.add(new XYChart.Data(Integer.toString(i), pole[i]));
            }            
            barChartData.get(0).getData().setAll(tempData);

            ii++;
        }));
        timeline.setCycleCount(pole.length - 1);
    }

    @FXML // button which starts sorting algorhitm, it is changing values in field
    private void bubbleButton(ActionEvent ev) { 
        timeline.play();

    }     

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }
}

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.chart.BarChart?>
<?import javafx.scene.chart.CategoryAxis?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane id="AnchorPane" prefHeight="487.0" prefWidth="610.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="radicialgoritmy.FXMLDocumentController"> 
<children>  
<Button fx:id="button" layoutX="14.0" layoutY="14.0" onAction="#handleButtonAction" text="Vygeneruj" />  
<BarChart fx:id="barChart" animated="false" cache="true" layoutX="30.0" layoutY="188.0" legendVisible="false" prefHeight="292.0" prefWidth="552.0">  
  <xAxis>  
    <CategoryAxis fx:id="osaX" side="BOTTOM" />  
  </xAxis>  
  <yAxis>  
    <NumberAxis fx:id="osaY" side="LEFT" />  
  </yAxis>  
</BarChart>
  <Button fx:id="bubble" layoutX="100.0" layoutY="14.0" mnemonicParsing="false" onAction="#bubbleButton" text="BubbleSort" /> 
</children>
</AnchorPane>