Question

当我试图创建一个区域图时，我已经遇到了以下问题：当（据我所知）它不应该填充时，该区域的一部分被填充。情节看起来像这样：

我希望情节看起来像这样：

我试图找到一个控制此行为的javafx或css属性，但我还没找到。任何关于我发现的图表的教程似乎都没有做任何强制我想要的行为 - 它似乎通常是默认的。

我也尝试过：

删除CSS类
将轴类型更改为<Number,Number>
将地图的父级更改为StackPane
更新JDK（至jdk1.8.0_131）

并且它没有帮助。

我已尝试将数据打印到控制台以验证其格式不正确：

02:00->17
05:00->13
08:00->14
11:00->15
14:00->17
17:00->17
20:00->16
23:00->12

但数据似乎很好。

以下是创建情节的代码：

package bug_reproduce;

import java.util.ArrayList;
import java.util.List;
import java.util.Random;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.chart.AreaChart;
import javafx.scene.chart.CategoryAxis;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class App extends Application {

    private static final String FXML_MAIN_TEMPLATE = "/fxml/MainPage.fxml";

    @Override
    public void start(Stage primaryStage) throws Exception {

        FXMLLoader loader = new FXMLLoader();
        Parent pane = loader.load(App.class.getResource(FXML_MAIN_TEMPLATE).openStream());

        StackPane hourly = (StackPane) pane.lookup("#hourly");

        Random rnd = new Random();
        List<Weather> list = new ArrayList<Weather>();
        for(int i = 0; i < 24; i+=3) {
            list.add(new Weather(i+":00", rnd.nextInt(15)+10));
        }

        hourly.getChildren().clear();
        createPlot(list, hourly);

        Scene myScene = new Scene(pane, 1280, 720);
        primaryStage.setScene(myScene);
        primaryStage.setTitle("Weather");
        primaryStage.setMinHeight(720);
        primaryStage.setMinWidth(1280);
        primaryStage.show();
    }

    public void createPlot(List<Weather> list, StackPane parent) {
        CategoryAxis xAxis = new CategoryAxis();
        NumberAxis yAxis = new NumberAxis();
        xAxis.setLabel("Hour");
        yAxis.setLabel("Temperature");

        AreaChart<String,Number> chart = new AreaChart<String,Number>(xAxis,yAxis);
        yAxis.forceZeroInRangeProperty().set(true);

        chart.setTitle("Hourly weather forecast");
        chart.getStyleClass().add("hourlyChart");
        chart.setLegendVisible(false);
        chart.setCreateSymbols(false);

        XYChart.Series series = new XYChart.Series();    
        for(Weather w : list) {
            String time = w.time;
            Number value = w.temperature;
            XYChart.Data datum = new XYChart.Data(time, value);
            series.getData().add(datum);
        }

        chart.getData().add(series);
        parent.getChildren().add(chart);
    }


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

}

Weather类：

package bug_reproduce;

public class Weather {

    String time;
    Number temperature;

    public Weather(String t, Number tem) {
        time = t;
        temperature = tem;
    }
}

样式表：

* {
    -fx-fill:WHITE;
    -fx-font-family: 'Open Sans', sans-serif;
}

#hourly {
    -fx-background-color:#736591;
}

.hourlyChart .chart-plot-background {
    -fx-background-color: transparent;
}

.hourlyChart .chart-vertical-grid-lines {
    -fx-stroke: transparent;
}

.hourlyChart .chart-horizontal-grid-lines {
    -fx-stroke: #fafafa;
}

.hourlyChart .chart-alternative-row-fill {
    -fx-fill: transparent;
    -fx-stroke: transparent;
    -fx-stroke-width: 0;
}

.hourlyChart .default-color0.chart-series-area-line { -fx-stroke: #00ccee; }
.hourlyChart .default-color0.chart-series-area-fill { -fx-fill: rgba(250,250,250,0.6) }

fxml文件：

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

<?import javafx.scene.layout.StackPane?>

<StackPane id="hourly" xmlns:fx="http://javafx.com/fxml/1" stylesheets="@/css/weather.css">

</StackPane>

用部分填充错误绘制的JavaFx AreaChart

0 个答案: