我正在try 使用WebView将带有Google map 的HTML文件嵌入到一个JavaFX应用程序中.我用更简单的HTML文件(只有段落文本和div)测试了我的代码,它是embedded correctly,但出于某种原因,谷歌 map 不能嵌入.相反,它显示的是white rectangle with a scroll bar.
以下是我的谷歌 map 的超文本标记语言:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title> GUI Embedded Map Test </title>
<style>
#map{
height:600px;
width:100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap() {
window.map = new google.maps.Map(document.getElementById("map"), {
zoom: 15,
center:{lat:32.99069195330653, lng:-106.97436738069189},
mapTypeId: "terrain",
});
}
window.initMap = initMap;
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=RANDOMKEY&callback=initMap" /c/
></script>
</body>
</html>
(仅供参考,如下所示为when opened in a browser)
以下是我嵌入它的Java代码:
WebView webView = new WebView();
WebEngine webEngine = webView.getEngine();
String map_html = "";
try {
File myObj = new File(System.getProperty("user.dir")+"/src/main/resources/embeddedMap.html");
Scanner myReader = new Scanner(myObj);
while (myReader.hasNextLine()) {
map_html += myReader.nextLine();
map_html += "\n";
}
myReader.close();
} catch (FileNotFoundException e) {
System.out.println("An error occurred.");
e.printStackTrace();
}
webEngine.loadContent(map_html);
mapPane.getChildren().add(webView);
我try 使用从谷歌 map 上的"共享"功能复制的iframes标签,而不是上面的html.我还try 了不同的API密钥.
如有任何帮助,将不胜感激!