移动刻度标签JavaFx 2

Question

是否可以将刻度标签移动/移动到图表中。目前我看到api's隐藏/显示刻度标签是否有一个API移动图表内的刻度标签？如果没有API，那么我是否可以使用/应用这项技术来完成这项工作？

当前代码

public class Graph extends Application{
private NumberAxis xAxis;
private NumberAxis yAxis;

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

@Override
public void start(final Stage primaryStage) throws Exception
{
    xAxis = new NumberAxis(0, 300, 20);
    xAxis.setAutoRanging(false);
    xAxis.setAnimated(false);
    xAxis.setMinorTickVisible(false);
    xAxis.setTickLabelsVisible(false);
    xAxis.setTickMarkVisible(false);

    yAxis = new NumberAxis(30, 240, 30);
    yAxis.setAutoRanging(false);
    yAxis.setAnimated(false);
    yAxis.setTickMarkVisible(false);
    yAxis.setMinorTickVisible(false);
    yAxis.setMinorTickCount(3);

    final LineChart<Number, Number> ctg = new LineChart<>(xAxis, yAxis);

    ctg.setAnimated(false);
    ctg.setCreateSymbols(false);
    ctg.setAlternativeRowFillVisible(false);
    ctg.setLegendVisible(false);
    ctg.setHorizontalGridLinesVisible(true);
    ctg.setVerticalGridLinesVisible(true);

    Series<Number, Number> series = new LineChart.Series<>();
    ctg.getData().add(series);

    for (int i = 0; i < 300; i += 5) {

        XYChart.Series minorYGrid = new XYChart.Series();
        minorYGrid.getData().add(new XYChart.Data(i, 30));
        minorYGrid.getData().add(new XYChart.Data(i, 240));
        ctg.getData().add(minorYGrid);
    }

    for (int i = 40; i <= 240; i += 10) {

        XYChart.Series minorXGrid = new XYChart.Series();
        minorXGrid.getData().add(new XYChart.Data(0, i));
        minorXGrid.getData().add(new XYChart.Data(500, i));
        ctg.getData().add(minorXGrid);
    }

    final Scene scene = new Scene(ctg, 1600, 400);
    scene.getStylesheets().add("resources/application.css");
    primaryStage.setScene(scene);
    primaryStage.show();
}
}

当前结果

预期结果

Answer 1

翻译单轴

您可以在图表上翻译y轴。

例如：

yAxis.translateXProperty().bind(
    xAxis.widthProperty().divide(2)
);

要确保轴显示在图表的顶部，您可以在场景上将深度缓冲区设置为true，并将yAxis的z坐标设置为-1。

yAxis.setTranslateZ(-1);

翻译多个轴

您的“预期结果”实际上有多个垂直轴。遗憾的是，没有克隆方法来克隆JavaFX中的节点。因此，您必须创建一个新轴并将其层叠在图表的顶部。实现这一目标的一种方法（有点矫枉过正和效率低下）是创建一个全新的图表并将其叠加在旧图表之上，类似于draw layers of XYCharts的解决方案。另一种方法，可能更好，但有点棘手，只需创建另一个轴并将其堆叠在原始图表上。

示例代码

MultiAxisChart.java

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class MultiAxisChart extends Application {

    @Override
    public void start(final Stage primaryStage) throws Exception {
        final StackPane chartStack = createChartStack();

        final Scene scene = new Scene(chartStack, 1600, 400, true);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    private StackPane createChartStack() {
        LineChart<Number, Number> bottomChart = createChart();
        LineChart<Number, Number> topChart    = createChart();

        bottomChart.getYAxis().translateXProperty().bind(
                bottomChart.getXAxis().widthProperty().multiply(1.0/3)
        );
        topChart.getYAxis().translateXProperty().bind(
                topChart.getXAxis().widthProperty().multiply(2.0/3)
        );

        bottomChart.getYAxis().setTranslateZ(-1);
        topChart.getYAxis().setTranslateZ(-1);

        topChart.getStylesheets().addAll(getClass().getResource(
                "overlay-chart.css"
        ).toExternalForm());

        return new StackPane(bottomChart, topChart);
    }

    private LineChart<Number, Number> createChart() {
        NumberAxis xAxis = new NumberAxis(0, 300, 20);
        xAxis.setAutoRanging(false);
        xAxis.setAnimated(false);
        xAxis.setMinorTickVisible(false);
        xAxis.setTickLabelsVisible(false);
        xAxis.setTickMarkVisible(false);

        NumberAxis yAxis = new NumberAxis(30, 240, 30);
        yAxis.setAutoRanging(false);
        yAxis.setAnimated(false);
        yAxis.setTickMarkVisible(false);
        yAxis.setMinorTickVisible(false);
        yAxis.setMinorTickCount(3);

        final LineChart<Number, Number> ctg = new LineChart<>(xAxis, yAxis);

        ctg.setAnimated(false);
        ctg.setCreateSymbols(false);
        ctg.setAlternativeRowFillVisible(false);
        ctg.setLegendVisible(false);
        ctg.setHorizontalGridLinesVisible(true);
        ctg.setVerticalGridLinesVisible(true);

        return ctg;
    }

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

叠加chart.css

/** file: overlay-chart.css (place in same directory as MultiAxisChart) */
.chart-plot-background {
    -fx-background-color: transparent;
}