I am implementing an application in java swing java fx with Google maps API.
My problem is this, I need when the map is loaded runs a javascript.
I've be reading of the method: webEngine.getLoadWorker().StateProperty().AddListener
but does not work in my code. I wonder if anyone has any idea how to do this.
I leave my code: SwingHtmlDemo.Java:
public class SwingHtmlDemo {
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
@Override
public void run() {
ApplicationFrame mainFrame = new ApplicationFrame();
mainFrame.setVisible(true);
}
});
}
}
/* Main window used to display some HTML content. */
class ApplicationFrame extends JFrame {
JFXPanel javafxPanel;
WebView webComponent;
JPanel mainPanel;
JTextField urlField;
JButton goButton;
public ApplicationFrame() {
javafxPanel = new JFXPanel();
initSwingComponents();
loadJavaFXScene();
}
/**
* Instantiate the Swing compoents to be used
*/
private void initSwingComponents() {
mainPanel = new JPanel();
mainPanel.setLayout(new BorderLayout());
mainPanel.add(javafxPanel, BorderLayout.CENTER);
JPanel urlPanel = new JPanel(new FlowLayout());
urlField = new JTextField();
urlField.setColumns(50);
urlPanel.add(urlField);
goButton = new JButton("Go");
urlField.setText("Rio branco 1421 montevideo");
/**
* Handling the loading of new URL, when the user enters the URL and
* clicks on Go button.
*/
goButton.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
Platform.runLater(new Runnable() {
@Override
public void run() {
String url = urlField.getText();
if (url != null && url.length() > 0) {
webComponent.getEngine().executeScript("document.goToLocation(\"" + urlField.getText() + "\")");
}
}
});
}
});
urlPanel.add(goButton);
mainPanel.add(urlPanel, BorderLayout.NORTH);
this.add(mainPanel);
this.setDefaultCloseOperation(JFrame.HIDE_ON_CLOSE);
this.setSize(700, 600);
}
/**
* Instantiate the JavaFX Components in the JavaFX Application Thread.
*/
private void loadJavaFXScene() {
Platform.runLater(new Runnable() {
@Override
public void run() {
BorderPane borderPane = new BorderPane();
webComponent = new WebView();
webComponent.getEngine().load(getClass().getResource("googlemap.html").toString());
borderPane.setCenter(webComponent);
Scene scene = new Scene(borderPane, 450, 450);
javafxPanel.setScene(scene);
}
});
}
}
googlemap.html:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100%; background-color: #666970; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyDRtQjq-q-w0Yr6BZ6y1nRGzAUM93udakg&sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(37.39822, -121.9643936);
var myOptions = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
navigationControl: false,
streetViewControl: false,
backgroundColor: "#666970"
};
document.geocoder = new google.maps.Geocoder();
document.map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
document.zoomIn = function zoomIn() {
var zoomLevel = document.map.getZoom();
if (zoomLevel <= 20) document.map.setZoom(zoomLevel + 1);
}
document.zoomOut = function zoomOut() {
var zoomLevel = document.map.getZoom();
if (zoomLevel > 0) document.map.setZoom(zoomLevel - 1);
}
document.setMapTypeRoad = function setMapTypeRoad() {
document.map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
}
document.setMapTypeSatellite = function setMapTypeSatellite() {
document.map.setMapTypeId(google.maps.MapTypeId.SATELLITE);
}
document.setMapTypeHybrid = function setMapTypeHybrid() {
document.map.setMapTypeId(google.maps.MapTypeId.HYBRID);
}
document.setMapTypeTerrain = function setMapTypeTerrain() {
document.map.setMapTypeId(google.maps.MapTypeId.TERRAIN);
}
document.goToLocation = function goToLocation(searchString) {
var address = searchString;
document.geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
document.map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: document.map,
position: results[0].geometry.location
});
if (results[0].geometry.viewport)
document.map.fitBounds(results[0].geometry.viewport);
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>
Consider adding FirebugLite to debug your app:
<script src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
If I understand correctly the question, you need to run this inside the 'document loaded' event listener:
webComponent.getEngine().load(getClass().getResource("googlemap.html").toString());
webComponent.getEngine().stateProperty().addListener(new ChangeListener<Worker.State>() {
@Override
public void changed(ObservableValue<? extends Worker.State> ov, Worker.State t, Worker.State t1) {
if (t1 == Worker.State.SUCCEEDED) {
// this will be run as soon as WebView is initialized.
webComponent.getEngine().executeScript("document.goToLocation(\"" + urlField.getText() + "\")");
}
}
});
UPDATE
The message means there is no such function, so you need to copy JS from your original HTML file into googlemap.html:
document.goToLocation = function goToLocation(searchString) {
document.geocoder.geocode( {'address': searchString}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
document.map.setCenter(results[0].geometry.location);
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
UPDATE 2
Worked for me after this (need to do this for all functions):
document.goToLocation = function goToLocation(searchString) {
You might consider adding FirebugLite to debug your JS app:
<script src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
来源：https://stackoverflow.com/questions/20073837/java-fx-application-onload-event