如何让图表内容区域占据它可用的最大区域？

Question

非常直接的问题：如何让图表内容区域占据它可用的最大区域？

我正在使用 JavaFX。就我而言，我希望有许多基于真/假yAxis (0/1) 的 AreaCharts。不幸的是，我找不到如何在 yAxis 或 AreaChart 对象上使用 setMaxHeight 或 setPrefHeight 等方法更改这些图表的内容高度的解决方案。

我已经尝试了一些 SO 的答案，但没有一个有效。

这是我目前的截图：

任何提示或提示？

Answer 1

重述问题

您的问题有点不清楚，但我认为您要问的是：

如何让图表内容区域占据最大可用区域？

也许不是这样，但无论如何这就是我要在这里回答的问题。

样本输出

这是一个小图表的屏幕截图：

图表已删除所有内容周围的轴、图例、标题和填充。这允许图表内容占用所有可用空间，从而可以显示非常小的图表。默认情况下，填充标题和轴显示会占用足够的空间，以至于图表内容本身对于非常小的图表变得难以辨认。

示例代码

在下面的代码中，很多东西的可见性设置为 false，轴的首选大小设置为 0：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.*;
import javafx.stage.Stage;

import java.net.MalformedURLException;
import java.net.URISyntaxException;

public class AreaChartSample extends Application {

    @Override public void start(Stage stage) throws URISyntaxException, MalformedURLException {
        stage.setTitle("Area Chart Sample");
        final NumberAxis xAxis = new NumberAxis(1, 31, 1);
        final NumberAxis yAxis = new NumberAxis(0, 28, 1);

        xAxis.setAutoRanging(false);
        xAxis.setMinorTickVisible(false);
        xAxis.setTickMarkVisible(false);
        xAxis.setTickLabelsVisible(false);
        xAxis.setPrefSize(0, 0);
        yAxis.setAutoRanging(false);
        yAxis.setMinorTickVisible(false);
        yAxis.setTickMarkVisible(false);
        yAxis.setTickLabelsVisible(false);
        yAxis.setPrefSize(0, 0);

        final AreaChart<Number,Number> ac = 
            new AreaChart<>(xAxis,yAxis);

        ac.setHorizontalGridLinesVisible(false);
        ac.setVerticalGridLinesVisible(false);
        ac.setLegendVisible(false);
        ac.setVerticalZeroLineVisible(false);
        ac.setHorizontalZeroLineVisible(false);

        ac.getStylesheets().add(
                getClass().getResource("unpad-chart.css").toURI().toURL().toExternalForm()
        );

        XYChart.Series seriesApril= new XYChart.Series();
        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));
        seriesApril.getData().add(new XYChart.Data(31, 19));

        XYChart.Series seriesMay = new XYChart.Series();
        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(ac,80,60);
        ac.getData().addAll(seriesApril, seriesMay);

        stage.setScene(scene);
        stage.show();
    }

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

此外，一些 CSS 移除了填充。将 CSS 文件放在与 AreaChartSample.java 相同的位置，并让您的构建系统将其复制到构建目标目录。

unpad-chart.css

.chart {
    -fx-padding: 0px;
}
.chart-content {
    -fx-padding: 0px;
}
.axis {
    AXIS_COLOR: transparent;
}
.axis:top > .axis-label,
.axis:left > .axis-label {
    -fx-padding: 0;
}
.axis:bottom > .axis-label,
.axis:right > .axis-label {
    -fx-padding: 0;
}

布局调试建议

• 要调试布局问题，请使用ScenicView。
• 要确定要覆盖的默认 CSS 样式，请查看 modena.css：
  • 对于 Java 8，modena.css 位于 JRE 随附的 jfxrt.jar 文件中。