JavaFX - 通过输入更新 WebView 中的变量值

JavaFX - Update values of variables in WebView through input

本文关键字：WebView 变量值 更新 输入 JavaFX      更新时间：2023-09-26

基本上，我想根据用户输入将谷歌地图上的标记移动到新位置。

我如何实现它：

  1. 我制作了一个html文件，它负责所有的javascript和maps部分。 设置标记。

  2. 我已经在JavaFX的WebView中嵌入了该html文件。

  3. 在我的 JavaFX 应用程序中，有 2 个文本，其中 a 输入一个值，该值成为纬度和经度的新值，因此标记移动。

我卡在哪里

我在 html 文件中有 2 个变量，纬度和 lon。它们决定了标记的位置。

通过我的 JavaFX 应用程序操作列表器，如何更新 lat 和 lon 的值？

在我的代码中

网页文件

<!DOCTYPE html>
<html>
  // stuff and stuff
var map;
function initialize() {
    var lat = 30.76;
    var lon = 76.74;
  var myLatlng = new google.maps.LatLng(lat, lon);
  var mapOptions = {
    zoom: 12,
    center: new google.maps.LatLng(30.75, 76.78),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: 'Hello World!'
  });

}
google.maps.event.addDomListener(window, 'load', initialize);
  //stuff and stuff

这是我的JavaFX文件

public class GoogleApp extends Application {

private Scene scene;
  MyBrowser myBrowser;
  String lat;
  String lon;

  public static void main(String[] args) {
      launch(args);
  }
  //stuff and stuff
  class MyBrowser extends Pane{
      HBox toolbar;
      WebView webView = new WebView();
      WebEngine webEngine = webView.getEngine();

      public MyBrowser(){
          final URL urlGoogleMaps = getClass().getResource("demo.html");
          webEngine.load(urlGoogleMaps.toExternalForm());
          getChildren().add(webView);
          final TextField latitude = new TextField("latitude");
          final TextField longitude = new TextField("longitude");
          Button update = new Button("Update");
          update.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent arg0) {
                lat = latitude.getText();
                lon = longitude.getText();
                System.out.println(lat + lon);
            }
        });
       getChildren().addAll(latitude, longitude, update);
      }
  }
}

您可以通过分配给网页上全局可见的window对象来将它们置于全局范围内。 即

在 JS 中：

window.lat = 30.76;
window.lon = 76.74;

在Java中，executeScript将在网页范围内执行JS代码，并为全局var赋值：

webEngine.executeScript("window.lat = 31.2;");

您也可以将它们放入对象中：

.JS：

window.coordinates = {lat: 100, lon: 250}

爪哇岛：

webEngine.executeScript("window.coordinates.lat = 31.2;");

更新

工作演示：https://gist.github.com/chaschev/7481304。

相关文章：