Move JavaFx 2 Label Shortcut

Question

Is it possible to move / shift label tags in a chart. Currently I see api to hide / show label labels, is there an API that moves label labels inside the diagram? If the API is missing, is there a way I can use / apply to do this?

Current code

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(); } } 

Current result

Expected Result

Answer 1

Single axis translation

You can translate the y axis to the chart.

For instance:

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

To ensure that the axis is displayed on top of the chart, you can set the depth buffer to true on the scene and set the z yAxis coordinate to -1.

 yAxis.setTranslateZ(-1); 

Multi axis translation

Your "Expected Result" actually has several vertical axes. Unfortunately, there is no cloning method for cloning a node in JavaFX. Thus, you will need to create a new axis and overlay it on top of the chart. One way to achieve this (which is a bit overkill and inefficient) is to create a completely new diagram and overlay it on top of the old one, similar to what was done in the decision to draw XYCharts layers . Another way to do this, which is probably preferable, but a bit more complicated, is to simply create another axis and lay it on top of the original diagram.

Code example

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); } } 

overlay-chart.css

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