Using markers and labels
mapjfx can display markers and labels on the map. Both are objects that are displayed at a given position on the map. A marker has a graphic and a label has a text.
Markers are defined by an image. There are four predefined markers in the library, these are the blue, green, red and orange markers seen in the demo application. It is also possible to define markers with a custom icon as is seen with the logo of the local soccer club KSC. When using a custom icon, it might be necessary to define the image offset in relation to the point where the marker should be place; this can be seen in the code as well.
Labels have a text and can optionally have a css-style asssigned, more about the css later. Like markers, labels may have an offset in relation to the position.
Labels also may be attached to a marker. This means, that the Label will be shown, hidden, moved and removed together with the Marker that it is attached to, so that only the Marker must be watched or moved.
The following image shows a blue marker without a label, an orange, a green and a red label with a label and a custom image without a label. The orange marker might be moved by clicking in the map. Additionally a label without a marker is shown (‘university’).
When the user clicks a marker or a label a custom event is triggered as already described.
The demo application creates the markers as follows:
// a couple of markers using the provided ones markerKaHarbour = Marker.createProvided(Marker.Provided.BLUE).setPosition(coordKarlsruheHarbour).setVisible( false); markerKaCastle = Marker.createProvided(Marker.Provided.GREEN).setPosition(coordKarlsruheCastle).setVisible( false); markerKaStation = Marker.createProvided(Marker.Provided.RED).setPosition(coordKarlsruheStation).setVisible(false); // no position for click marker yet markerClick = Marker.createProvided(Marker.Provided.ORANGE).setVisible(false); // a marker with a custom icon markerKaSoccer = new Marker(getClass().getResource("/ksc.png"), -20, -20).setPosition(coordKarlsruheSoccer) .setVisible(false); // the fix label, default style labelKaUniversity = new MapLabel("university").setPosition(coordKarlsruheUniversity).setVisible(true); // the attached labels, custom style labelKaCastle = new MapLabel("castle", 10, -10).setVisible(false).setCssClass("green-label"); labelKaStation = new MapLabel("station", 10, -10).setVisible(false).setCssClass("red-label"); labelClick = new MapLabel("click!", 10, -10).setVisible(false).setCssClass("orange-label"); markerKaCastle.attachLabel(labelKaCastle); markerKaStation.attachLabel(labelKaStation); markerClick.attachLabel(labelClick);
Markers must be added to the MapView in order to be observed:
// add the markers to the map - they are still invisible mapView.addMarker(markerKaHarbour); mapView.addMarker(markerKaCastle); mapView.addMarker(markerKaStation); mapView.addMarker(markerKaSoccer); // can't add the markerClick at this moment, it has no position, so it would not be added to the map // add the fix label, the other's are attached to markers. mapView.addLabel(labelKaUniversity);
They can also be removed fro the MapView, which automatically removes them from the map display, they might later be readded.
A marker – and a label as well – has a position and a visible property which are both observed by the MapView – as long as the marker is added to the MapView – so that changes to these properties are reflected in the map. The visible property of the markers is bound to the checkboxes in the markers section on the left side of the application:
// bind the checkboxes to the markers visibility checkKaHarbourMarker.selectedProperty().bindBidirectional(markerKaHarbour.visibleProperty()); checkKaCastleMarker.selectedProperty().bindBidirectional(markerKaCastle.visibleProperty()); checkKaStationMarker.selectedProperty().bindBidirectional(markerKaStation.visibleProperty()); checkKaSoccerMarker.selectedProperty().bindBidirectional(markerKaSoccer.visibleProperty()); checkClickMarker.selectedProperty().bindBidirectional(markerClick.visibleProperty());
A marker has a coordinate property that is observed by the MapView so that setting this property to a new value is immediately reflected by the map.
The orange marker is a marker that follows the places where the user clicks in the map, therefore it is called click marker. To make the marker follow the click, an event handler is registered that sets the marker’s position. To make it a little nicer, an animation is added that moves the marker:
// add an event handler for singleclicks, set the click marker to the new position // add an event handler for singleclicks, set the click marker to the new position when it's visible mapView.addEventHandler(MapViewEvent.MAP_CLICKED, event -> { event.consume(); final Coordinate newPosition = event.getCoordinate(); labelEvent.setText("Event: map clicked at: " + newPosition); if (checkDrawPolygon.isSelected()) { handlePolygonClick(event); } if (markerClick.getVisible()) { final Coordinate oldPosition = markerClick.getPosition(); if (oldPosition != null) { animateClickMarker(oldPosition, newPosition); } else { markerClick.setPosition(newPosition); // adding can only be done after coordinate is set mapView.addMarker(markerClick); } } }); private void animateClickMarker(Coordinate oldPosition, Coordinate newPosition) { // animate the marker to the new position final Transition transition = new Transition() { private final Double oldPositionLongitude = oldPosition.getLongitude(); private final Double oldPositionLatitude = oldPosition.getLatitude(); private final double deltaLatitude = newPosition.getLatitude() - oldPositionLatitude; private final double deltaLongitude = newPosition.getLongitude() - oldPositionLongitude; { setCycleDuration(Duration.seconds(1.0)); setOnFinished(evt -> markerClick.setPosition(newPosition)); } @Override protected void interpolate(double v) { final double latitude = oldPosition.getLatitude() + v * deltaLatitude; final double longitude = oldPosition.getLongitude() + v * deltaLongitude; markerClick.setPosition(new Coordinate(latitude, longitude)); } }; transition.play(); }
CSS Styles
Labels just are <div>
elements that are added to the shown page, so they can be styled with css. A label always has the css class mapview-label. The default style contained within the library for labels is:
/*default style for a mapview label */ .mapview-label { border-radius: 5px; border: 1px solid black; background: #eeeeee linear-gradient(#eeeeee, #aaaaaa); padding: 2px; }
An additional css class for a Label can be set as follows:
labelKaCastle = new MapLabel("castle", 10, -10).setVisible(false).setCssClass("green-label");
The css class of a Label can be set as well later when the label already is visible, the change will be shown on the map immediately. To be able to style the labels it is necessary to define the stylesheet containing the information. This is done with the following call on the MapView element:
mapView.setCustomMapviewCssURL(getClass().getResource("/custom_mapview.css"));
The css file used in the demo has the following content:
.red-label { padding: 2px 10px; background: #e6262b linear-gradient(#e67b7b, #ad2125); } .orange-label { padding: 2px 10px; background: #e69327 linear-gradient(#e6a38f, #ae6d1f); } .green-label { padding: 2px 10px; background: #356425 linear-gradient(#93ee93, #356425); }
Markers and Labels have a rotation property which can be set to values from 0..360 and which is used to rotate the corresponding HTML element on the map. The demo application uses this with an animation to rotate the marker for the soccer club.
…continued on the next page
Hello, thank you for your wonderful work, first! I was having trouble with running this extension in IntelliJ. I am stuck after cloning the file. I wonder where I can run the code required to open the application. Do I copy the code and run it to the terminal? (I’m currently using a macbook). Or can I run the code in IntelliJ, if so, where do I put this code?
I am not maintaining this project any longer, but you can find this information in the readme file in the repository.
Hi. can any way openstreetmap use offline in JavaFx Desktop app? Do you can do example for this?
No, there is only the support to cache the data so that the tiles that were downloaded will be reused
Hello..
I did tests with the demo and it works very well, now I try to make a modification to get the Here Maps tiles and from what I see this is done in the methods
private WMSParam wmsParam = new WMSParam () and private XYZParam xyzParams = new XYZParam () inside Conttoller.java
but I can’t get them, it keeps showing me the OSM ones, can you guide me on how to do it ???
I don’t know if WMS or XYZ params are the right ones for Here maps, but besides setting the parameters, you need to switch the map style. The demo application has this in these lines: https://github.com/sothawo/mapjfx-demo/blob/main/src/main/java/com/sothawo/mapjfxdemo/Controller.java#L362-L389
Hallo, many thanks for the work and time you spend for this project and make it open source!
It is exactly what I am looking for to integrate it in my project. But I have an issue with the markers. Once I have set them, they are a kind of hovering over the map and are not fixed to their coordinate. So when I scroll out, the marker is maybe in Africa, only scrolling into the maximum moves it to the right position. Maybe you have an solution for it.
Thank you in advanced.
I found the problem in scaling my display as a result of my high resolution monitor and that this and that the problem is already being discussed.
Sorry for my hasty question
Hi , many thanks for this excellent project.
I have a Question : can i change the url to openMapTile local server this is the format : http://localhost:8080/styles/osm-bright/{z}/{x}/{y}.png
Set up an XYZ source for the map, see https://github.com/sothawo/mapjfx-demo/blob/main/src/main/java/com/sothawo/mapjfxdemo/Controller.java#L255-L258 and https://github.com/sothawo/mapjfx-demo/blob/main/src/main/java/com/sothawo/mapjfxdemo/Controller.java#L378
Thanks it worked 🙂
Hi, awesome project!
I just downloaded the demo and it works perfectly fine. I then tried to integrate this map into my fx application without using FXML – Just getting a plain, basic instance of the map view with something like:
MapView mv = new MapView();
mv.initialize();
StackPane root = new StackPane();
root.getChildren().add(mv);
Unfortunately this and all other things I have tried ended up with just a grey screen and the zoom controls visible.
I then tried to copy the demo code with FXML into my project and excuting / changing it, which worked fine and as expected.
How can I use this without FXML? I have never used FXML before and am slightly struggeling with it.
If it is relevant: Java 11.0.4, Eclipse, Windows 10.
Cheers and once again, awesome project!
the mapjfx project itslef has a small test application which I use when devloping (https://github.com/sothawo/mapjfx/blob/master/src/main/java/com/sothawo/mapjfx/app/TestApp.java#L286-L299). This is s pure code setup, no fxml
I should log in before answering
make sure that your MapView has a center set and an extent / a zoom level (https://github.com/sothawo/mapjfx/blob/master/src/main/java/com/sothawo/mapjfx/app/TestApp.java#L255-L280)
Setting a center did the trick – As your comment in the code said: “Map is only displayed, when an initial coordinate is set”
Thanks for the super quick reply! 🙂
Hi, i am new on JavaFX and mapjfx. I was testing your lib by doing my own test application. I was succedeed in show a map, set center, zoom, change MapType and also include a marker with a label. But I have a little issue with marker, I added just one marker to test and when I change the zoom, the marker just desapears… Am I doing something wrong?? Is that a bug?? There is a kind of “UpdateMapView” method that I can call to refresh the mapView? Thankyou… you did a greatjob…
is there a kind of…*** Sorry bad english!
When you create a Marker object you need to make sure, to keep a reference to it in your java code, for example by having it as a property in some class or by putting it into a list of Markers. If you don’t, then the Java collector will remove the Marker object from the JVM, and then it will also be removed from the map.
Thank You, it works now. As you indicated, I create a global List, add all my markers on this list and call “mapView.addMarker(pt)” from this list. Now they don’t disappears anymore. Thank you again!!!
Hi
I was trying to look into the mapjfx cache issues.
I tried to build a previous cached demo version, 1.7.2, from the maven repo.
But maven keeps failing on a missing configuration (source) file.
Can you give some directions?
Cheers,
Antonio
what is the exact error?
Is it possible to use this library in an offline application? We currently have a swing based application which renders a map and various layers using OpenMap and all our data is stored locally. Plus OpenMap supports a bunch of mapping standards like VMAP and DTED. Does your library support something like those or would we have to write something?
as written here (https://www.sothawo.com/projects/mapjfx-demo/6/) there is an offline caching mode which caches the tiles during an online session, so they are available later even when offline.
**But**: this will not work from probably Java 11 on, as I need to use some reflection to get this working which will not be allowed in Java versions to come
Very interesting and useful code!!!
Can you explain how can i use “stamen watercolor” type map ?
Thank you in advanced.
in the demo app by selecting ‘map style’ on the left and then the ‘Stamen Watercolor” radio button.
But as this is a OpenStreetmap map as wellm you might run into the problems with the mpa tiles not properly loading; see the blog posts and jira issues for more details.
Hello,
The map is not displaying for me. All I can see are zoom buttons, but none of the map layers.
I’m running Java 8 on Windows 10 with 1.15. Any ideas?
Hello Chris,
which version of Java? JDK or JRE? At the moment when running this on 1.8.0_162 on OSX the loading of the map tiles was quite slow, but now it’s working here.
There is an open issue (https://github.com/sothawo/mapjfx/issues/29) where I am investigating a similar problem, but I have no solution for that. Is this only happening for the OSM map? The WMS Gis Landsat server seems not to be available anymore, but can you try the WMS world food programme map and zoom out to level 3? This should give you a grey map with some darker grey boundaries especially in Africa and the middle east.
You can sign up for a Bing Maps API key, that does not cost anything for up to 125.000 calls a year. At least that what give you the possibility to check if this map type is working.
P.J.,
I’m running 1.8.0_161. I’ve tried all the map layers and none of them display for me.
I also tried switching to Java 10, but still didn’t work. Has this been solved yet?
Thanks
Also, I tried both JRE and JDK.
Here is an image of what I’m looking at: https://ibb.co/dTgzHS
Hi Chris, thanks for the info.
Alas as far as I found out, this is a problem which is caused by something in the underlying WebKit implementation (see the analysis in https://github.com/sothawo/mapjfx/issues/29 and my test with a plain example from the OpenLayers webiste https://www.sothawo.com/2018/02/mapjfx-problems/).
I just tried with the new 1.8_172 and there with the mapjfx-demo app I have only parts loading.
So at the moment I do not know how to fix this.
Np, thank you for looking in to this.
Hello,
is it posible to use map in JFXPanel of Swing application, i see only zoom in/out after calling initialize(). But no map?
I have set mapType to OSM.
Thanks for answer
Does the mapjfx-demo application work on your system? I am just asking to make sure that there is no problem in the combination of OS, Java version with mapjfx component. Please check this.
Hello,
is it possible to add markers and labels at runtime?
I have tried it, but only the markers defined in the constructor are visible.
Greetings,
Tursic
Sure it’s possible. You have to take care that you keep a reference of the created markers, otherwise they are immediately garbage-collected.
If for example you add the following property to the Controller class:
private Map<String, Marker> markersCreatedOnClick = new HashMap<>();
and add this code in the event handler initializer:
mapView.addEventHandler(MapViewEvent.MAP_CLICKED, event -> {
final Marker marker = Marker.createProvided(Marker.Provided.ORANGE)
.setPosition(event.getCoordinate())
.setVisible(true);
mapView.addMarker(marker);
markersCreatedOnClick.put(marker.getId(), marker);
});
mapView.addEventHandler(MarkerEvent.MARKER_CLICKED, event -> {
event.consume();
Marker marker = markersCreatedOnClick.remove(event.getMarker().getId());
if (null != marker) {
mapView.removeMarker(marker);
}
});
then with every click you will add a new marker and clicking on the marker will remove it again.
Thank you very much.
On my development-PC it works now fine (except from the missing map when started in the IDE, but that would be ok), but unfortunately on every other PC I tested, the map does not appear at all.
Could it be the WMSParam-Urls?
It looks like the map is loaded somehow, because the markers appear and I can move and zoom, only the map itself is missing, there is only a grey background.
Now i found out:
The problem appears, when ‘jdk’ is used. When using ‘jre’, it works.
Hello everyone I had the same issue when the map was not showing in the demo app even though cache was disabled.
The fix was that I adjusted the Java version to instead using an old JRE 1.8.0_66 to use a new JDK 1.8.0_121.
Then the map was shown correctly.
For some reason the logger.trace is not shown im my debug-output.
And when I step into ‘mapView.initialize()’, only the Logger.finer – Method is called.
I can run the demo, can see the markers,etc, but the map does not appear.
Can anyone help me?
Hello,
on which System? Which map type? Do you run software like vpn etc?
The demo has enabled the offline cache for the embedded browser, can you change the line 271 in Controller.java so that the cache is not used, either by putting a comment in front or by changing it to
offlineCache.setActive(false);
?When starting the program from the console/terminal, do you see some errors in the output?
greetings
Peter
Hello,
thank you for the answer.
The system is Windows7.
Now,I have tested the demo on another PC, and here I can see the OSM-Map, when starting from console.
But in Netbeans-IDE, the map still does not appear.
Setting offlineCache to false takes no effect.
Greetings,
Tursic
any output in the console that shows some errors?
No errors, just this:
10:34:44.789 [JavaFX Application Thread] INFO com.sothawo.mapjfx.demo.DemoApp – starting DemoApp
10:34:44.791 [JavaFX Application Thread] DEBUG com.sothawo.mapjfx.demo.DemoApp – loading fxml file /fxml/DemoApp.fxml
10:34:45.039 [JavaFX Application Thread] DEBUG com.sothawo.mapjfx.demo.Controller – map type toggled to RadioButton[id=radioMsOSM, styleClass=radio-button]’OSM’
10:34:45.532 [JavaFX Application Thread] DEBUG com.sothawo.mapjfx.demo.Controller – initialization finished
10:34:45.858 [JavaFX Application Thread] DEBUG com.sothawo.mapjfx.demo.DemoApp – application start method finished.
10:34:46.081 [JavaFX Application Thread] DEBUG com.sothawo.mapjfx.demo.Controller – setting center and enabling controls…
On the other PC (with Windows 10) the map still doesn’t appear, even if started from console.
Maybe a performance-problem? The rendering of the map is very slow anyway.
strange. When I start the program on Windows the from a console with the command
mvn clean package && cd target/mapjfx-demo && ./bin/mapjfx-demo)
I get the following output:04:55:53.545 INFO [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - starting DemoApp
04:55:53.545 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - loading fxml file /fxml/DemoApp.fxml
04:55:53.792 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - begin initialize
04:55:53.797 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - location buttons done
04:55:53.821 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - options and labels done
04:55:53.823 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - map type toggled to RadioButton[id=radioMsOSM, styleClass=radio-button]'OSM'
04:55:53.826 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - map handlers initialized
04:55:53.869 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - marker checks done
04:55:53.879 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - tracks loaded
04:55:53.879 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - tracks checks done
04:55:53.880 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - start map initialization
04:55:53.880 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - initializing...
04:55:53.881 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/mapview.html
04:55:53.885 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/ol/4.0.1/ol.css
04:55:53.886 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/polyfill.js
04:55:53.886 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/ol/4.0.1/ol.js
04:55:53.908 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/mapview.css
04:55:53.909 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading custom mapview css from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-demo-1.12.1.jar!/custom_mapview.css
04:55:53.910 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/functions.js
04:55:53.911 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/MapObject.js
04:55:53.911 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/WMSParams.js
04:55:53.911 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/coordinateline.js
04:55:53.911 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - loading from jar:file:/C:/Users/peter/Entwicklung/mapjfx-demo/target/mapjfx-demo/lib/mapjfx-1.12.2.jar!/mapview.js
04:55:53.985 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - WebView created
04:55:53.986 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - Java Version: 1.8.0_121-b13
04:55:53.986 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - JavaFX Version: 8.0.121-b13
04:55:53.987 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - OS: Windows 10, 10.0, amd64
04:55:53.987 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/602.1 (KHTML, like Gecko) JavaFX/8.0 Safari/602.1
04:55:53.988 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - load html into WebEngine
04:55:54.007 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - WebEngine loader state READY -> SCHEDULED
04:55:54.008 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - WebEngine loader state SCHEDULED -> RUNNING
04:55:54.010 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - initialization finished
04:55:54.010 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - stage loaded
04:55:54.059 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - scene created
04:55:54.060 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - showing scene
04:55:54.500 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.demo.DemoApp - application start method finished.
04:55:54.732 DEBUG [JavaFX Application Thread] com.sothawo.mapjfx.MapView - WebEngine loader state RUNNING -> SUCCEEDED
04:55:54.735 TRACE [JavaFX Application Thread] com.sothawo.mapjfx.demo.Controller - map intialized
That’s a lot more before the Map is shown. Can you use a debugger to step through the
Controller.initialize()
method?Pingback: mapjfx 1.7.0 with the ability for caching map data | sothawo
You are just awesome! Thank you!
comment for the first user of javafx scene builder
user can download scene builder,
http://gluonhq.com/open-source/scene-builder/
and who can’t open the DemoApp.fxml
check the under document, pp. 35 Import JAR
https://docs.oracle.com/javase/8/scene-builder-2/JSBID.pdf
After importing mapjfx-1.5.0.jar file in scene builder, user can open this DemoApp.fxml
hope It helps for someone.
Thank you agian
Peter-Josef Meisch 🙂
Download link for the last Oracle SceneBuilder: http://www.oracle.com/technetwork/java/javafxscenebuilder-1x-archive-2199384.html
Don’t know why this is, but to have the MapView available in the Scene Builder, I had to import mapjfx-demo (1.9.0) …
1.9.0 is pretty old (February 2017).

I just downloaded SceneBuilder 8.5.0 from https://gluonhq.com/products/scene-builder/ (the Java 8 version), added the actual Java8 version of mapjfx (1.24.3), and there it works
Do the same thing as in the tutorial below just in part where he searches for GMapsFX instead write mapjfx-demo. And you will import MapView.
https://rterp.wordpress.com/2016/10/03/how-to-import-the-gmapsfx-component-into-scenebuilder/