将线图与条形图结合起来

时间:2015-05-05 18:24:58

标签: charts javafx

我正在尝试使用窗格将条形图与线图相结合,但它不起作用。它只显示了线图而不是条形图,我不知道为什么。你能帮帮我吗?

    Stage stage = (Stage) ((Node) event.getSource()).getScene().getWindow();
    stage.setScene(
        new Scene(
            layerCharts(
               createBarChart()
                    ,createLineChart()
            )
        )
    );
    stage.show();
}

private NumberAxis createYaxis() {
    final NumberAxis axis = new NumberAxis(0, 21, 1);
    axis.setPrefWidth(35);
    axis.setMinorTickCount(10);

    axis.setTickLabelFormatter(new NumberAxis.DefaultFormatter(axis) {
        @Override public String toString(Number object) {
            return String.format("%7.2f", object.floatValue());
        }
    });

    return axis;
}

private BarChart<String, Number> createBarChart() {
    final BarChart<String, Number> chart = new BarChart<>(new CategoryAxis(), createYaxis());
    setDefaultChartProperties(chart);
    chart.getData().addAll(
        new XYChart.Series(
            FXCollections.observableArrayList(
                new XYChart.Data("Jan", 2),
                new XYChart.Data("Feb", 10),
                new XYChart.Data("Mar", 8),
                new XYChart.Data("Apr", 4),
                new XYChart.Data("May", 7),
                new XYChart.Data("Jun", 5),
                new XYChart.Data("Jul", 4),
                new XYChart.Data("Aug", 8),
                new XYChart.Data("Sep", 16.5),
                new XYChart.Data("Oct", 13.9),
                new XYChart.Data("Nov", 17),
                new XYChart.Data("Dec", 10)
            )
        )
    );
    return chart;
}

private LineChart<String, Number> createLineChart() {
    final LineChart<String, Number> chart = new LineChart<>(new CategoryAxis(), createYaxis());
    setDefaultChartProperties(chart);
    chart.setCreateSymbols(false);
    chart.getData().addAll(
        new XYChart.Series(
            FXCollections.observableArrayList(
                new XYChart.Data("Jan", 1),
                new XYChart.Data("Feb", 2),
                new XYChart.Data("Mar", 1.5),
                new XYChart.Data("Apr", 3),
                new XYChart.Data("May", 2.5),
                new XYChart.Data("Jun", 5),
                new XYChart.Data("Jul", 4),
                new XYChart.Data("Aug", 8),
                new XYChart.Data("Sep", 6.5),
                new XYChart.Data("Oct", 13),
                new XYChart.Data("Nov", 10),
                new XYChart.Data("Dec", 20)
            )
        )
    );
    return chart;
}

private void setDefaultChartProperties(final XYChart<String, Number> chart) {
    chart.setLegendVisible(false);
    chart.setAnimated(false);
}

private StackPane layerCharts(final XYChart<String, Number> ... charts) {
    for (int i = 1; i < charts.length; i++) {
        configureOverlayChart(charts[i]);
    }

    StackPane stackpane = new StackPane();
    stackpane.getChildren().addAll(charts);

    return stackpane;
}

private void configureOverlayChart(final XYChart<String, Number> chart) {
    chart.setAlternativeRowFillVisible(false);
    chart.setAlternativeColumnFillVisible(false);
    chart.setHorizontalGridLinesVisible(false);
    chart.setVerticalGridLinesVisible(false);
    chart.getXAxis().setVisible(false);
    chart.getYAxis().setVisible(false); 
   chart.setStyle("-fx-background-color: rgba(0, 100, 100, 0.5); -fx-background-radius: 10;");
    //chart.getStylesheets().addAll(getClass().getResource("StyleSheet1.scss").toExternalForm());
}

我的css表

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

0 个答案:

没有答案