这是诺基亚地图在安卓网络视图

here nokia map on android webview

本文关键字：网络视图诺基亚地图更新时间：2023-09-26

我正在尝试将诺基亚地图嵌入到Android网络视图中，并且工作得很好。问题出在标记单击侦听器上：如果我在浏览器中打开 HTML 文件，侦听器会触发，但不在我的 Android Web 视图中。我确定 javascript 事件在 Web 视图中配置正确，因为如果我使用 html 按钮，onclick 就会起作用。

这是 HML 页面

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7; IE=EmulateIE9; IE=10" />
<base
    href="http://developer.here.com/apiexplorer/examples/api-for-js/markers/marker.html" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Nokia Maps API for JavaScript Example: Adding a marker</title>
<meta name="description"
    content="Putting a standard marker onto the map" />
<meta name="keywords" content="standardmarker, map objects, markers" />
<!-- For scaling content for mobile devices, setting the viewport to the width of the device-->
<meta name=viewport
    content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- Styling for example container (NoteContainer & Logger)  -->
<link rel="stylesheet" type="text/css"
    href="http://developer.here.com/apiexplorer/examples/templates/js/exampleHelpers.css" />
<!-- By default we add ?with=all to load every package available, it's better to change this parameter to your use case. Options ?with=maps|positioning|places|placesdata|directions|datarendering|all -->
<script type="text/javascript" charset="UTF-8"
    src="http://js.cit.api.here.com/se/2.5.3/jsl.js?with=maps"></script>
<!-- JavaScript for example container (NoteContainer & Logger)  -->
<script type="text/javascript" charset="UTF-8"
    src="http://developer.here.com/apiexplorer/examples/templates/js/exampleHelpers.js"></script>
<style type="text/css">

body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}
#mapContainer {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
}
</style>
</head>
<body>
    <div id="mapContainer"></div>
    <div id="uiContainer"></div>

    <script type="text/javascript" id="exampleJsSource">
        /*  Setup authentication app_id and app_code 
         *  WARNING: this is a demo-only key
         *  please register for an Evaluation, Base or Commercial key for use in your app.
         *  Just visit http://developer.here.com/get-started for more details. Thank you!
         */

        nokia.Settings.set("app_id", "DemoAppId01082013GAL");
        nokia.Settings.set("app_code", "AJKnXv84fjrb0KIHawS0Tg");
        // Use staging environment (remove the line for production environment)
        nokia.Settings.set("serviceMode", "cit");
        // Get the DOM node to which we will append the map
        var mapContainer = document.getElementById("mapContainer");
        // Create a map inside the map container DOM node
        var map = new nokia.maps.map.Display(mapContainer, {
            // Initial center and zoom level of the map
            center : [ 52.51, 13.4 ],
            zoomLevel : 10,
            // We add the behavior component to allow panning / zooming of the map
            components : [ new nokia.maps.map.component.Behavior() ]
        });
        var fernsehturmMarker = new nokia.maps.map.StandardMarker(
                new nokia.maps.geo.Coordinate(52.520816, 13.409417), {
                    title : 'This has a click event',
                    brush : {
                        color : '#00AA00'
                    }
                });
        fernsehturmMarker.addListener('click', function(evt) {
            //$('.loc').html(times[i]); 
            alert('');
        });
        /* Create a marker on a specified geo coordinate 
         * (in this example we use the map's center as our coordinate)
         */
        //var standardMarker = new nokia.maps.map.StandardMarker(map.center);
        // Next we need to add it to the map's object collection so it will be rendered onto the map.
        map.objects.add(fernsehturmMarker);

    </script>
</body>
</html>

这是我在onCreate方法中的Java代码

nokiaMap = (NoZoomControllWebView) getActivity().findViewById(R.tab_map_nokia.webView);
nokiaMap.getSettings().setJavaScriptEnabled(true);
nokiaMap.getSettings().setDomStorageEnabled(true);
nokiaMap.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
nokiaMap.getSettings().setSupportMultipleWindows(true);
nokiaMap.setWebChromeClient(new WebChromeClient() );
nokiaMap.loadUrl("file:///android_asset/marker.html");

有人有同样的问题吗？

刚遇到这个开放的话题。你知道HERE同时为Android和iOS提供SDK吗？

更多信息可以在这里找到：https://developer.here.com/develop/mobile-sdks

这可能比嵌入JavaScript API更容易。