Question

带有类别轴的我的AreaChart表现得很奇怪。首先，数据超出Y轴范围。其次，areacharts X轴不是从最左边开始（第一个刻度线），而是在第二个刻度线上？

enter image description here

这是一个MVCE：

public class FXMLDocumentController implements Initializable {

    @FXML
    StackedAreaChart st;
    @FXML
    private Label label;

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

    }

    @FXML
    private void handleButtonAction(ActionEvent event) {
        ObservableList<XYChart.Data> xyList1
                = FXCollections.observableArrayList(
                        new XYChart.Data<>("austria", 30),
                        new XYChart.Data<>("rr", 40),
                        new XYChart.Data<>("zz", 40),
                        new XYChart.Data<>("zq", 50),
                        new XYChart.Data<>("zr", 33),
                        new XYChart.Data<>("zw", 44));

        st.setAnimated(false);
        XYChart.Series series1 = new XYChart.Series(xyList1);
        st.getData().addAll(series1);

    }

}

如果我删除此行：

new XYChart.Data<>("zq", 50)

范围还可以，但是勾号看起来仍然很奇怪。

Answer 1

我们再次遇到了与我们已经找到here相同的错误。只计算最后一个值来计算图表Y范围。因此，任何先前较大的值都没有正确显示。

对此的解决方法是将auto range设置为false，并手动处理它：

@FXML StackedAreaChart<String, Integer> st;
@FXML NumberAxis yAxis;

@FXML
public void handleButtonAction(ActionEvent e){
    ObservableList<XYChart.Data<String,Integer>> xyList1
            = FXCollections.observableArrayList(
                    new XYChart.Data<>("austria", 30),
                    new XYChart.Data<>("rr", 40),
                    new XYChart.Data<>("zz", 40),
                    new XYChart.Data<>("zq", 50),
                    new XYChart.Data<>("zr", 33),
                    new XYChart.Data<>("zw", 44));

    st.setAnimated(false);
    XYChart.Series series1 = new XYChart.Series(xyList1);
    st.getData().addAll(series1);

    yAxis.setAutoRanging(false);
    yAxis.setLowerBound(Math.min(0,
        xyList1.stream().mapToInt(d->d.getYValue()).min().getAsInt()));
    yAxis.setUpperBound(xyList1.stream().mapToInt(d->d.getYValue()).max().getAsInt());
    yAxis.setTickUnit((yAxis.getUpperBound()-yAxis.getLowerBound())/10);

}

在FXML文件中，您为Y轴提供fx:id：

<StackedAreaChart fx:id="st">
    <xAxis>
      <CategoryAxis side="BOTTOM" />
    </xAxis>
    <yAxis>
      <NumberAxis fx:id="yAxis" side="LEFT" />
    </yAxis>
  </StackedAreaChart>

StackedAreaChart - 自动调整bug

1 个答案: