文章/答案/技术大牛

发布

社区首页 >问答首页 >google的新版本的javascript版本在JavaFx-WebView上工作吗？

问google的新版本的javascript版本在JavaFx-WebView上工作吗？
EN

Stack Overflow用户

提问于 2019-06-18 05:50:05

回答 2查看 858关注 0票数 6

我试图在JavaFx-WebView，上加载谷歌地图，它除了在html文件上编码的html主体的背景色之外，没有显示任何东西。另外，我在谷歌搜索上尝试了一些例子，所有的结果都比较老。都不管用。我的Java版本是"1.8.0_121"

我编写了一个html文件并运行它。它成功地加载了谷歌地图。然后使用webEngine.load("path")方法将html文件加载到webview。它除了背景颜色什么也不显示。

之后，我尝试了 http://rterp.github.io/GMapsFX

运行ClusteredMainApp.java (放置我的google密钥)
控制台的产出如下：
“这里”
“聚类图像/m”
“隐藏方向”
"loadMapLibrary“
"loadMapLibrary完成“
"initMap“
LatLong：(47.606189，-122.33584200000001)
Netscape.javascript.JSException: Error: Google API不支持此浏览器。(未定义，0)

而且我也找不到任何解决这个错误的方法。

Html文件

CSS：

#map_canvas { height: 100%; background-color: blue; }

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);

}

html：

<body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>
   </body>

JavaFX：

public class WebMap extends Application {
 
    @Override public void start(Stage stage) {
        // create web engine and view
        final WebView webView = new WebView();
        final WebEngine webEngine = webView.getEngine();
        webEngine.load(getClass().getResource("WebMap.html").toString());
        // create scene
        stage.setTitle("Web Map");
        Scene scene = new Scene(webView,1000,700, Color.web("#666970"));
        stage.setScene(scene);
        // show stage
        stage.show();
    }
 
    public static void main(String[] args){
        Application.launch(args);
    }
}

javascript

java

google-maps

javafx

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-07-25 13:14:24

Google放弃了对旧浏览器的支持，这开始导致“Google API不支持此浏览器”。错误。看看https://developers.google.com/maps/documentation/javascript/releases和https://developers.google.com/maps/documentation/javascript/versions。

您正在使用的库使用的是3.exp版本(实验性的)。

在较新的Java版本上运行将修复此问题(目前而言)。

票数 1

Stack Overflow用户

发布于 2019-06-18 06:09:44

如果要使用GMapsFX，可以从链接中下载示例代码。

如果仔细观察，您将看到库获得了一个类GoogleMapView，其中包含的是自己的WebView。

来自GMapsFX的一些代码

public class GoogleMapView extends AnchorPane {

private static final Logger LOG = LoggerFactory.getLogger(GoogleMapView.class);

protected static final String GOOGLE_MAPS_API_LINK = "https://maps.googleapis.com/maps/api/js?v=3.exp";
protected static final String GOOGLE_MAPS_API_VERSION = "3.exp";

private boolean usingCustomHtml;

protected String language;
protected final String region;
protected String key;
protected WebView webview; <-- Own WebView
protected JavaFxWebEngine webengine;
protected boolean initialized = false;
protected final CyclicBarrier barrier = new CyclicBarrier(2);
protected final List<MapComponentInitializedListener> mapInitializedListeners = new ArrayList<>();
protected final List<MapReadyListener> mapReadyListeners = new ArrayList<>();
protected GoogleMap map;
protected DirectionsPane direc;
protected boolean disableDoubleClick = false;

因此，如果要使用库，就不应该创建自己的WebView。

你可以从样本开始

import com.lynden.gmapsfx.GoogleMapView;
import com.lynden.gmapsfx.javascript.event.GMapMouseEvent;
import com.lynden.gmapsfx.javascript.event.UIEventType;
import com.lynden.gmapsfx.javascript.object.GoogleMap;
import com.lynden.gmapsfx.javascript.object.LatLong;
import com.lynden.gmapsfx.javascript.object.MapOptions;
import com.lynden.gmapsfx.javascript.object.MapTypeIdEnum;
import java.net.URL;
import java.text.DecimalFormat;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Label;
import javafx.scene.web.WebView;

public class LatLongFXMLController implements Initializable {

    @FXML
    private Label latitudeLabel;

    @FXML
    private Label longitudeLabel;

    @FXML
    private GoogleMapView googleMapView;

    private GoogleMap map;

    private DecimalFormat formatter = new DecimalFormat("###.00000");

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        googleMapView.addMapInitializedListener(() -> configureMap());
    }

    protected void configureMap() {
        MapOptions mapOptions = new MapOptions();

        mapOptions.center(new LatLong(47.6097, -122.3331))
                .mapType(MapTypeIdEnum.ROADMAP)
                .zoom(9);
        map = googleMapView.createMap(mapOptions, false);

        map.addMouseEventHandler(UIEventType.click, (GMapMouseEvent event) -> {
            LatLong latLong = event.getLatLong();
            latitudeLabel.setText(formatter.format(latLong.getLatitude()));
            longitudeLabel.setText(formatter.format(latLong.getLongitude()));
        });

    }
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/56642447

复制

相似问题

问google的新版本的javascript版本在JavaFx-WebView上工作吗？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问google的新版本的javascript版本在JavaFx-WebView上工作吗？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问google的新版本的javascript版本在JavaFx-WebView上工作吗？
EN