Я хочу встроить карту листовок через Webview в приложение JavaFX. Листовка-карта отлично работает в браузере. Однако я получаю эту Stacktrace при выполнении моего кода:
Exception in thread "JavaFX Application Thread" netscape.javascript.JSException: ReferenceError: Can't find variable: L
at javafx.web/com.sun.webkit.dom.JSObject.fwkMakeException(JSObject.java:157)
at javafx.web/com.sun.webkit.WebPage.twkExecuteScript(Native Method)
at javafx.web/com.sun.webkit.WebPage.executeScript(WebPage.java:1513)
at javafx.web/javafx.scene.web.WebEngine.executeScript(WebEngine.java:972)
at WebviewTest$1.changed(WebviewTest.java:34)
at javafx.base/com.sun.javafx.binding.ExpressionHelper$SingleChange.fireValueChangedEvent(ExpressionHelper.java:181)
at javafx.base/com.sun.javafx.binding.ExpressionHelper.fireValueChangedEvent(ExpressionHelper.java:80)
at javafx.base/javafx.beans.property.ReadOnlyObjectPropertyBase.fireValueChangedEvent(ReadOnlyObjectPropertyBase.java:74)
at javafx.base/javafx.beans.property.ReadOnlyObjectWrapper.fireValueChangedEvent(ReadOnlyObjectWrapper.java:102)
at javafx.base/javafx.beans.property.ObjectPropertyBase.markInvalid(ObjectPropertyBase.java:113)
at javafx.base/javafx.beans.property.ObjectPropertyBase.set(ObjectPropertyBase.java:147)
at javafx.web/javafx.scene.web.WebEngine$LoadWorker.updateState(WebEngine.java:1251)
at javafx.web/javafx.scene.web.WebEngine$LoadWorker.dispatchLoadEvent(WebEngine.java:1366)
at javafx.web/javafx.scene.web.WebEngine$LoadWorker.access$1200(WebEngine.java:1244)
at javafx.web/javafx.scene.web.WebEngine$PageLoadListener.dispatchLoadEvent(WebEngine.java:1231)
at javafx.web/com.sun.webkit.WebPage.fireLoadEvent(WebPage.java:2513)
at javafx.web/com.sun.webkit.WebPage.fwkFireLoadEvent(WebPage.java:2358)
at javafx.web/com.sun.webkit.network.URLLoader.twkDidFinishLoading(Native Method)
at javafx.web/com.sun.webkit.network.URLLoader.notifyDidFinishLoading(URLLoader.java:871)
at javafx.web/com.sun.webkit.network.URLLoader.lambda$didFinishLoading$5(URLLoader.java:862)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$10(PlatformImpl.java:428)
at java.base/java.security.AccessController.doPrivileged(Native Method)
at javafx.graphics/com.sun.javafx.application.PlatformImpl.lambda$runLater$11(PlatformImpl.java:427)
at javafx.graphics/com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:96)
at javafx.graphics/com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
at javafx.graphics/com.sun.glass.ui.win.WinApplication.lambda$runLoop$3(WinApplication.java:174)
at java.base/java.lang.Thread.run(Thread.java:834)
Мой Java код выглядит следующим образом:
public void start(Stage primaryStage) {
primaryStage.setTitle("JavaFX WebView Example");
WebView webView = new WebView();
WebEngine webEngine = webView.getEngine();
File f = new File("pathToHTMLFile");
webEngine.load(f.toURI().toString());
webEngine.getLoadWorker().stateProperty().addListener(
new ChangeListener() {
@Override
public void changed(ObservableValue observable, Object oldValue, Object newValue) {
if (newValue == Worker.State.SUCCEEDED) {
//document finished loading
webEngine.executeScript("testFunk()");
}
}
}
);
VBox vBox = new VBox(webView);
Scene scene = new Scene(vBox, 960, 600);
primaryStage.setScene(scene);
primaryStage.show();
}
А мой код JS / HTML следующий:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"
integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="
crossorigin=""></script>
<style>
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#mapId { height: 100% }
</style>
<script>
//Works on webbrowser
//window.onload = testFunk;
function testFunk(){
document.getElementById("test").innerHTML = "This function runs";
var mymap = L.map('mapId').setView([51.505, -0.09], 13);
L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18,
id: 'mapbox/streets-v11',
tileSize: 512,
zoomOffset: -1,
accessToken: 'my.mapbox.access.token'
}).addTo(mymap);
}
</script>
</head>
<body>
<p id="test">test</p>
<div id="mapId"></div>
</body>
</html>
Файл HTML отлично работает в браузере. И я проверил выполнение js -функции из Java -файла для изменения внутреннего HTML HTML -документа, и это прекрасно работает. Я использую JavaFX 11 и Java 11. Возможно, проблема в том, что внешние файлы скриптов еще не загружены полностью, но я не знаю. Заранее спасибо.
PS: Если проблема с JavaScript, я хотел бы получить ответ в чистом виде JS :)
РЕДАКТИРОВАТЬ: я решил проблему, загрузив исходный код листовки и ссылки на это непосредственно вместо