Question

我正在按照教程实施google maps v3以显示简单地图的项目，在找出mostRecentLocation空指针错误后，它现在显示地图并居中于我的位置。

我认为我应该从我的assets文件夹加载一个html文件，其中包含google maps api的javascript和api链接，这样可以使用内置的缩放按钮？当我这样做时，webview显示一个空屏幕。我应该设置webview来加载html吗？如果是这样，谁能告诉我为什么我可能有一个空白屏幕？

我有api v1和2工作，但如果可以，我更愿意使用v3。

private void setupWebView(){
    final String centerURL = "javascript:centerAt(" +  mostRecentLocation.getLatitude() + "," +  mostRecentLocation.getLongitude()+ ")";  
    webView = (WebView) findViewById(R.id.webview);
    WebSettings settings = webView.getSettings();  
    webView.getSettings().setJavaScriptEnabled(true);
    settings.getJavaScriptEnabled();
    settings.getBuiltInZoomControls();
    settings.setBuiltInZoomControls(true);
    //Wait for the page to load then send the location information  
    webView.setWebViewClient(new WebViewClient());  
    //webView.loadUrl("file:///android_asset/html/index.html");
    webView.loadUrl(MAP_URL);
    /** Allows JavaScript calls to access application resources **/  
    webView.addJavascriptInterface(new JavaScriptInterface(), "android");
    }

和html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="theme.css"> 
<script type="text/javascript"   src="http://maps.googleapis.com/maps/api/js?&sensor=true"></script>
<script type="text/javascript">  
var map;  function initialize() {    
var latitude = 0;    
var longitude = 0;    
if (window.android){      
    latitude = window.android.getLatitude();      
    longitude = window.android.getLongitude();    
    }    
var myLatLng = new google.maps.LatLng(latitude,longitude);    
var myOptions = {      
        zoom: 20,      
        center: myLatLng,      
        mapTypeId: google.maps.MapTypeId.ROADMAP  

        }    
map = new google.maps.Map(document.getElementById("map_canvas"),      myOptions);  }  
function centerAt(latitude, longitude){    
    myLatlng = new google.maps.LatLng(latitude,longitude);    
    map.panTo(myLatLng);
    }
</script>
<title>Insert title here</title>
</head>
<body>

</body>
</html>

Answer 1

你的身体需要<div id="map_canvas"></div>，所以谷歌知道在哪里放置地图（这是你在JS中为新地图所拥有的元素）。 div也需要一个大小。

添加此功能

<body>
  <div id="map_canvas" style="height: 100px; width=100px;"></div>
  <script type="text/javascript">initialize();</script>
</body>

webview for google maps v3显示空白屏幕

1 个答案: