2

我想创建可以实时监控温度的温度图表。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.StackedAreaChart;
import javafx.scene.chart.XYChart;
import javafx.stage.Stage;

public class MainApp extends Application
{

    final NumberAxis xAxis = new NumberAxis(1, 31, 1);
    final NumberAxis yAxis = new NumberAxis();
    final StackedAreaChart<Number, Number> sac
        = new StackedAreaChart<Number, Number>(xAxis, yAxis);

    @Override
    public void start(Stage stage)
    {


        setUserAgentStylesheet(STYLESHEET_CASPIAN);
        stage.setTitle("Area Chart Sample");
        sac.setTitle("Temperature Monitoring (in Degrees C)");
        XYChart.Series<Number, Number> seriesApril
            = new XYChart.Series<Number, Number>();
        seriesApril.setName("April");
        seriesApril.getData().add(new XYChart.Data(1, 4));
        seriesApril.getData().add(new XYChart.Data(3, 10));
        seriesApril.getData().add(new XYChart.Data(6, 15));
        seriesApril.getData().add(new XYChart.Data(9, 8));
        seriesApril.getData().add(new XYChart.Data(12, 5));
        seriesApril.getData().add(new XYChart.Data(15, 18));
        seriesApril.getData().add(new XYChart.Data(18, 15));
        seriesApril.getData().add(new XYChart.Data(21, 13));
        seriesApril.getData().add(new XYChart.Data(24, 19));
        seriesApril.getData().add(new XYChart.Data(27, 21));
        seriesApril.getData().add(new XYChart.Data(30, 21));
        XYChart.Series<Number, Number> seriesMay
            = new XYChart.Series<Number, Number>();
        seriesMay.setName("May");
        seriesMay.getData().add(new XYChart.Data(1, 20));
        seriesMay.getData().add(new XYChart.Data(3, 15));
        seriesMay.getData().add(new XYChart.Data(6, 13));
        seriesMay.getData().add(new XYChart.Data(9, 12));
        seriesMay.getData().add(new XYChart.Data(12, 14));
        seriesMay.getData().add(new XYChart.Data(15, 18));
        seriesMay.getData().add(new XYChart.Data(18, 25));
        seriesMay.getData().add(new XYChart.Data(21, 25));
        seriesMay.getData().add(new XYChart.Data(24, 23));
        seriesMay.getData().add(new XYChart.Data(27, 26));
        seriesMay.getData().add(new XYChart.Data(31, 26));
        Scene scene = new Scene(sac, 800, 600);
        sac.getData().addAll(seriesApril);
        stage.setScene(scene);
        stage.show();
    }

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

我想更改高度温度图表的颜色。例如,我想看到 10 到 20 之间的绿色温度和 40 到 50 之间的红色温度。你能帮我实现这个吗?

4

1 回答 1

3

这只能通过 CSS 实现。
将以下行添加到您的 CSS 并为您的图表指定 id temperatureChart

#temperatureChart .series0.chart-series-area-fill {
    -fx-fill: linear-gradient(to top, #0984df, #00d8ff 20%, #fff000 60%, #ff0000) ;
}

您必须自己弄清楚正确的百分比值。

希望这会有所帮助,
卡拉施

编辑(在代码方法中):
要在代码中执行此操作,您可以执行以下操作(建议您检查查找是否为空):

sac.lookup("#temperatureChart .series0.chart-series-area-fill")
.setStyle("-fx-fill: linear-gradient(to top, #0984df, #00d8ff 20%, #fff000 60%, #ff0000);");

不建议这样做,但如果没有其他办法...

于 2014-02-21T10:38:55.583 回答