javaFX学习笔记之 折线图用法

已于 2022-04-26 16:43:39 修改
阅读量2.9k 收藏 17
点赞数 2
分类专栏： 前端开发
于 2022-04-26 16:22:53 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/zy103118/article/details/124430749
版权

JavaFX 折线图 股市趋势 数据序列 可视化
关键词由优快云通过智能技术生成

直接上代码

/**
 * @author zhaoyong
 * @Date 2022/4/26
 * @Description 折线图
 */
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;


public class LineChartSample extends Application {

    @Override public void start(Stage stage) {
        stage.setTitle("折线图标例");

        final NumberAxis xAxis = new NumberAxis();//定义一个x轴(数字横轴)
        final NumberAxis yAxis = new NumberAxis();//定义一个y轴(数字纵轴)
        xAxis.setLabel("x轴标题");
        //creating the chart
        final LineChart<Number,Number> lineChart =
                new LineChart<Number,Number>(xAxis,yAxis);//定义一个折线图，将前文定义的x轴和y轴对象挂载上

        lineChart.setTitle("股市趋势, 2022");//设置图的标题
        //defining a series
        XYChart.Series series = new XYChart.Series();//定义式创建一个数字序列
        series.setName("大盘指数");//数字序列添加标题名称
        //populating the series with data
        series.getData().add(new XYChart.Data(1, 23));//给数字序列添加序列值
        series.getData().add(new XYChart.Data(2, 14));
        series.getData().add(new XYChart.Data(3, 15));
        series.getData().add(new XYChart.Data(4, 24));
        series.getData().add(new XYChart.Data(5, 34));
        series.getData().add(new XYChart.Data(6, 36));
        series.getData().add(new XYChart.Data(7, 22));
        series.getData().add(new XYChart.Data(8, 45));
        series.getData().add(new XYChart.Data(9, 43));
        series.getData().add(new XYChart.Data(10, 17));
        series.getData().add(new XYChart.Data(11, 29));
        series.getData().add(new XYChart.Data(12, 25));

        Scene scene  = new Scene(lineChart,800,600);//定义一个场景设置场景大小，并挂载上文定义的图
        lineChart.getData().add(series);//将序列值添加到图中

        stage.setScene(scene);//舞台挂载场景
        stage.show();//舞台展现
    }

    public static void main(String[] args) {
        launch(args);
    }
}

 

/**
 * @author zhaoyong
 * @Date 2022/4/26
 * @Description 折线图
 */
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;


public class LineChartSample extends Application {

    @Override public void start(Stage stage) {
        stage.setTitle("折线图标例");

        final NumberAxis xAxis = new NumberAxis();//定义一个x轴(数字横轴)
        final NumberAxis yAxis = new NumberAxis();//定义一个y轴(数字纵轴)
        xAxis.setLabel("x轴标题");
        //creating the chart
        final LineChart<Number,Number> lineChart =
                new LineChart<Number,Number>(xAxis,yAxis);//定义一个折线图，将前文定义的x轴和y轴对象挂载上

        lineChart.setTitle("股市趋势, 2022");//设置图的标题
        //defining a series
        XYChart.Series series = new XYChart.Series();//定义式创建一个数字序列
        series.setName("大盘指数");//数字序列添加标题名称
        //populating the series with data
        series.getData().add(new XYChart.Data(1, 23));//给数字序列添加序列值
        series.getData().add(new XYChart.Data(2, 14));
        series.getData().add(new XYChart.Data(3, 15));
        series.getData().add(new XYChart.Data(4, 24));
        series.getData().add(new XYChart.Data(5, 34));
        series.getData().add(new XYChart.Data(6, 36));
        series.getData().add(new XYChart.Data(7, 22));
        series.getData().add(new XYChart.Data(8, 45));
        series.getData().add(new XYChart.Data(9, 43));
        series.getData().add(new XYChart.Data(10, 17));
        series.getData().add(new XYChart.Data(11, 29));
        series.getData().add(new XYChart.Data(12, 25));

        Scene scene  = new Scene(lineChart,800,600);//定义一个场景设置场景大小，并挂载上文定义的图
        lineChart.getData().add(series);//将序列值添加到图中
        lineChart.setCreateSymbols(false);//禁用折线图的符号化,就是一个趋势图的样例(展示的折线图使用小圆圈符号来突出显示每个数据项。如果你想展示图中的数据趋势而不是具体的数据值，可以禁用掉图表符号)
        stage.setScene(scene);//舞台挂载场景
        stage.show();//舞台展现
    }

    public static void main(String[] args) {
        launch(args);
    }
}


/**
 * @author zhaoyong
 * @Date 2022/4/26
 * @Description 折线图
 */
import javafx.application.Application;
import javafx.geometry.Side;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;


public class LineChartSample extends Application {

    @Override public void start(Stage stage) {
        stage.setTitle("折线图标例");

        final NumberAxis xAxis = new NumberAxis();//定义一个x轴(数字横轴)
        final NumberAxis yAxis = new NumberAxis();//定义一个y轴(数字纵轴)
        xAxis.setLabel("x轴标题");
        //creating the chart
        final LineChart<Number,Number> lineChart =
                new LineChart<Number,Number>(xAxis,yAxis);//定义一个折线图，将前文定义的x轴和y轴对象挂载上

        lineChart.setTitle("股市趋势, 2022");//设置图的标题
        //defining a series
        XYChart.Series series = new XYChart.Series();//定义式创建一个数字序列
        series.setName("大盘指数");//数字序列添加标题名称
        //populating the series with data
        series.getData().add(new XYChart.Data(1, 23));//给数字序列添加序列值
        series.getData().add(new XYChart.Data(2, 14));
        series.getData().add(new XYChart.Data(3, 15));
        series.getData().add(new XYChart.Data(4, 24));
        series.getData().add(new XYChart.Data(5, 34));
        series.getData().add(new XYChart.Data(6, 36));
        series.getData().add(new XYChart.Data(7, 22));
        series.getData().add(new XYChart.Data(8, 45));
        series.getData().add(new XYChart.Data(9, 43));
        series.getData().add(new XYChart.Data(10, 17));
        series.getData().add(new XYChart.Data(11, 29));
        series.getData().add(new XYChart.Data(12, 25));
        xAxis.setSide(Side.TOP);//坐标轴与绘图区的相对位置是默认的。当然，也可以通过调用setSide方法来让某个坐标轴显示到绘图区的另一侧，将横轴移到绘图区的上方
        Scene scene  = new Scene(lineChart,800,600);//定义一个场景设置场景大小，并挂载上文定义的图
        lineChart.getData().add(series);//将序列值添加到图中
        lineChart.setCreateSymbols(false);//禁用折线图的符号化,就是一个趋势图的样例(展示的折线图使用小圆圈符号来突出显示每个数据项。如果你想展示图中的数据趋势而不是具体的数据值，可以禁用掉图表符号)
        stage.setScene(scene);//舞台挂载场景
        stage.show();//舞台展现
    }

    public static void main(String[] args) {
        launch(args);
    }
}

为折线图创建分类

使用CategoryAxis类来代替NumberAxis类以使折线图中出现非数值型数据。

检查一下例中修改后的代码。该程序用CategoryAxis实例创建了横轴。为了适应横轴数据类型的变化，LineChart对象的声明也做了修改。

 使用来展示CategoryAxis月份

 

/**
 * @author zhaoyong
 * @Date 2022/4/26
 * @Description 折线图
 */
import javafx.application.Application;
import javafx.geometry.Side;
import javafx.scene.Scene;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;


public class LineChartSample extends Application {

    @Override public void start(Stage stage) {
        stage.setTitle("折线图标例");

        final CategoryAxis xAxis = new CategoryAxis();//定义一个x轴(文本横轴)
        final NumberAxis yAxis = new NumberAxis();//定义一个y轴(数字纵轴)
        xAxis.setLabel("x轴标题（月份）");
        //creating the chart
        final LineChart<String,Number> lineChart =
                new LineChart<String,Number>(xAxis,yAxis);//定义一个折线图，将前文定义的x轴和y轴对象挂载上

        lineChart.setTitle("股市趋势, 2022");//设置图的标题
        //defining a series
        XYChart.Series series = new XYChart.Series();//定义式创建一个数字序列
        series.setName("大盘指数");//数字序列添加标题名称
        //populating the series with data
        series.getData().add(new XYChart.Data("1月", 23));//给数字序列添加序列值
        series.getData().add(new XYChart.Data("2月", 14));
        series.getData().add(new XYChart.Data("3月", 15));
        series.getData().add(new XYChart.Data("4月", 24));
        series.getData().add(new XYChart.Data("5月", 34));
        series.getData().add(new XYChart.Data("6月", 36));
        series.getData().add(new XYChart.Data("7月", 22));
        series.getData().add(new XYChart.Data("8月", 45));
        series.getData().add(new XYChart.Data("9月", 43));
        series.getData().add(new XYChart.Data("10月", 17));
        series.getData().add(new XYChart.Data("11月", 29));
        series.getData().add(new XYChart.Data("12月", 25));
        xAxis.setSide(Side.TOP);//坐标轴与绘图区的相对位置是默认的。当然，也可以通过调用setSide方法来让某个坐标轴显示到绘图区的另一侧，将横轴移到绘图区的上方
        Scene scene  = new Scene(lineChart,800,600);//定义一个场景设置场景大小，并挂载上文定义的图
        lineChart.getData().add(series);//将序列值添加到图中
        lineChart.setCreateSymbols(false);//禁用折线图的符号化,就是一个趋势图的样例(展示的折线图使用小圆圈符号来突出显示每个数据项。如果你想展示图中的数据趋势而不是具体的数据值，可以禁用掉图表符号)
        stage.setScene(scene);//舞台挂载场景
        stage.show();//舞台展现
    }

    public static void main(String[] args) {
        launch(args);
    }
}

_____________________________________

通常折线图可用于分析同一时间段内的不同数据集。使用多组XYChart.Data对象可以实现这个功能

为折线图增加数据序列

例提供了带有三组数据的股票监视程序源码。除了前一个例子中展示的那一个数据序列之外，还另外声明了两个新的数据序列。

这些数据序列通过连续调用getData和addAll方法添加到了图表之中。

向股票监视样例中增加两个新的数据序列 

每个数据序列都通过调用setName方法定义了一个唯一的名称。编译并运行此程序的结果 

 

 

/**
 * @author zhaoyong
 * @Date 2022/4/26
 * @Description 折线图
 */
import javafx.application.Application;
import javafx.geometry.Side;
import javafx.scene.Scene;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;


public class LineChartSample extends Application {

    @Override public void start(Stage stage) {
        stage.setTitle("折线图标例");

        final CategoryAxis xAxis = new CategoryAxis();//定义一个x轴(文本横轴)
        final NumberAxis yAxis = new NumberAxis();//定义一个y轴(数字纵轴)
        xAxis.setLabel("x轴标题（月份）");
        //creating the chart
        final LineChart<String,Number> lineChart =
                new LineChart<String,Number>(xAxis,yAxis);//定义一个折线图，将前文定义的x轴和y轴对象挂载上

        lineChart.setTitle("股市趋势, 2022");//设置图的标题
        //defining a series
        XYChart.Series series1 = new XYChart.Series();//定义式创建一个数字序列
        series1.setName("大盘指数");//数字序列添加标题名称
        //populating the series with data
        series1.getData().add(new XYChart.Data("1月", 23));//给数字序列添加序列值
        series1.getData().add(new XYChart.Data("2月", 14));
        series1.getData().add(new XYChart.Data("3月", 15));
        series1.getData().add(new XYChart.Data("4月", 24));
        series1.getData().add(new XYChart.Data("5月", 34));
        series1.getData().add(new XYChart.Data("6月", 36));
        series1.getData().add(new XYChart.Data("7月", 22));
        series1.getData().add(new XYChart.Data("8月", 45));
        series1.getData().add(new XYChart.Data("9月", 43));
        series1.getData().add(new XYChart.Data("10月", 17));
        series1.getData().add(new XYChart.Data("11月", 29));
        series1.getData().add(new XYChart.Data("12月", 25));
        XYChart.Series series2 = new XYChart.Series();
        series2.setName("m20");
        series2.getData().add(new XYChart.Data("1月",  33));
        series2.getData().add(new XYChart.Data("2月",  34));
        series2.getData().add(new XYChart.Data("3月",  25));
        series2.getData().add(new XYChart.Data("4月",  44));
        series2.getData().add(new XYChart.Data("5月",  39));
        series2.getData().add(new XYChart.Data("6月",  16));
        series2.getData().add(new XYChart.Data("7月",  55));
        series2.getData().add(new XYChart.Data("8月",  54));
        series2.getData().add(new XYChart.Data("9月",  48));
        series2.getData().add(new XYChart.Data("10月", 27));
        series2.getData().add(new XYChart.Data("11月", 37));
        series2.getData().add(new XYChart.Data("12月", 29));

        XYChart.Series series3 = new XYChart.Series();
        series3.setName("m30");
        series3.getData().add(new XYChart.Data("1月",  44));
        series3.getData().add(new XYChart.Data("2月",  35));
        series3.getData().add(new XYChart.Data("3月",  36));
        series3.getData().add(new XYChart.Data("4月",  33));
        series3.getData().add(new XYChart.Data("5月",  31));
        series3.getData().add(new XYChart.Data("6月",  26));
        series3.getData().add(new XYChart.Data("7月",  22));
        series3.getData().add(new XYChart.Data("8月",  25));
        series3.getData().add(new XYChart.Data("9月",  43));
        series3.getData().add(new XYChart.Data("10月", 44));
        series3.getData().add(new XYChart.Data("11月", 45));
        series3.getData().add(new XYChart.Data("12月", 44));


        Scene scene  = new Scene(lineChart,800,600);//定义一个场景设置场景大小，并挂载上文定义的图
        lineChart.getData().addAll(series1,series2,series3);//将序列值添加到图中
        lineChart.setCreateSymbols(false);//禁用折线图的符号化,就是一个趋势图的样例(展示的折线图使用小圆圈符号来突出显示每个数据项。如果你想展示图中的数据趋势而不是具体的数据值，可以禁用掉图表符号)
        stage.setScene(scene);//舞台挂载场景
        stage.show();//舞台展现
    }

    public static void main(String[] args) {
        launch(args);
    }
}

需要注意，折线的不同颜色根据addAll方法中相应数据序列的声明顺序决定。如果这样来修改声明顺序：lineChart.getData().addAll(series3, series1, series2)，然后再编译并运行该程序。修改后的输出结果如图 

 

 

评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值