Ich habe Probleme beim Anzeigen einer Karte mit OpenLayers v3 in JavaFX WebView. Hier ist mein Code:OpenLayers V3.19.1 wird nicht in JavaFX WebView angezeigt
openLayersV3.html
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet"
href="https://openlayers.org/en/v3.19.1/css/ol.css" type="text/css">
<style>
.map {
height: 400px;
width: 400px;
}
</style>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"></script>
<script src="https://openlayers.org/en/v3.19.1/build/ol.js"
type="text/javascript"></script>
<title>OpenLayers 3 example</title>
<script type="text/javascript">
function loadMap() {
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.fromLonLat([10.0, 53.55]),
zoom: 10
})
});
}
</script>
</head>
<body onLoad="loadMap()">
<h2>My Map</h2>
<div id="map" class="map"></div>
</body>
</html>
Und hier ist ein Auszug aus dem Lader:
OsmView.java
...
protected WebView webView = new WebView();
protected WebEngine webEngine = webView.getEngine();
public OsmView() {
final URL urlOsmMap = getClass().getResource("/some/package/name/openLayersV3.html");
webEngine.load(urlOsmMap.toExternalForm());
getChildren().add(webView);
}
...
Wenn ich die html laden in Ein Browser wie IE oder Firefox, zeigt es ohne Komplikationen. Aber im Java-Programm gibt es nur eine leere Seite mit dem h2 ("My Map"). Aber das JavaScript wird nicht geladen. Also, was mache ich hier falsch?
nicht sicher, ob dies ist es, aber stellen Sie sicher, dass Sie geladen haben alle benötigten Polyfills (requestAnimationFrame, Element.prototype.classList, URL) – bartvde
@bartvde Ok, ich habe "URL" zum JavaScript-Import im HTML hinzugefügt, aber es hat nicht funktioniert. Wie kann ich sicherstellen, dass ich sie richtig geladen habe? –
Ich hatte das gleiche Problem. Polyfills würden nicht den richtigen Inhalt zurückgeben. Am Ende habe ich versucht, den richtigen Code zu liefern, indem ich einen falschen User-Agent benutze (ich habe chrome/10.0.0 benutzt). Die lokal geladene Datei hat den Trick für mich gemacht. – casualcoder