Javafx drawing lines and text

Question

I have a problem with drawing strings in JavaFx. We are creating an application that simulates traffic - there are 16 streets, and each street has a different color, depending on traffic. There is a very simple picture: http://img546.imageshack.us/img546/9949/uliceu.jpg

My first idea on how to do this is to draw the streets as lines and just change their colors. But I cannot overlay text on a line (I want text with a street name). So I tried putting string and text in a StackPane. Then I added that StackPanes at the BorderPane center ... But that didn't work. It seems that StackPane does not take into account the beginning of line x, starts y ... The lines overlap with each other.

The main application window is BorderPane, and I want to put the map in the center. It does not require dynamic resizing, we only have one card, so it can be installed in a static way.

I need something like this: http://img834.imageshack.us/img834/1157/ulicac.jpg But the streets should connect to each other ... as in the first picture

Do you have any suggestions on how to do this? Any advice would be appreciated :)

Like:

Group gr = new Group(); Text text = new Text("1st Street"); text.setFill(Color.web("fabbff")); Line line = new Line(0, 150, 200,150); line.setStrokeWidth(20); line.setStroke(Color.web("000000")); gr.getChildren().addAll(line, text); group.getChildren().addAll(gr, //and every other street); 

Answer 1

The StackPane you used will, by default, center everything in the center of the StackPane, which will not be what you want.

Instead of StackPane, use regular Pane (if you need to create CSS style in the panel or have controls in the Pane resize area when the panel is resized), otherwise use Group . Since you are claiming that the map you are drawing does not need to be dynamically changed, then maybe just a group is fine.

The order in which elements are placed in the list of children of a group or panel determines the order in which the elements are displayed. First, items that are added first to the list will be added, and items that were added last to the list will be displayed on top of the first items added. So, first add street lines to your panel or group, and then add Text (or Labels ) at the top of the streets.

Another option is to use a direct Canvas draw, but for your application, using scene graph objects in a panel or group is probably the best approach.

Use one panel / group with all streets added, then all names or one panel / group for all streets, and another for all street names. Separate panels can be nice because you can switch the visibility to street names as needed by setting a visible flag in the street name group. Do not use one group for both the street and its name, and then try to stack several groups of streets + streets on top of each other, otherwise at the crossroads some of the street names will be closed by the streets located at the top.

when I draw a line, I can specify the position of x, y, but I cannot set the position of the text or label ... or can I?

In addition to positioning the lines by providing them with coordinates when creating the line, you also need to place the text so that it appears on top of the lines. You can use the text.relocate (x, y) method to search for text in a specific place.

Answer 2

I know this is an old thread. However, I had the same question: how to add labels to a line that is resistant to moving the arround line. This code works for me:

 line = new Line(); line.startXProperty().bind(source.layoutXProperty().add(source.getBoundsInParent().getWidth() / 2.0)); line.startYProperty().bind( source.layoutYProperty().add(source.getBoundsInParent().getHeight() / 2.0)); line.endXProperty().bind( target.layoutXProperty().add( target.getBoundsInParent().getWidth() / 2.0)); line.endYProperty().bind( target.layoutYProperty().add( target.getBoundsInParent().getHeight() / 2.0)); label.layoutXProperty().bind(line.endXProperty().subtract(line.endXProperty().subtract(line.startXProperty()).divide(2))); label.layoutYProperty().bind(line.endYProperty().subtract(line.endYProperty().subtract(line.startYProperty()).divide(2))); getChildren().addAll( line, label);