UWP App Google maps API提供了一个空白屏幕

时间:2016-02-10 13:50:56

标签: google-maps uwp

我一直在尝试开发使用Google地图API的UWP应用。所以,我创建了2个项目 -
1)XAML UWP项目
2)JS UWP项目
当我同时运行时,映射在JS项目中可见,但不在 XAML中中。页面显示“内容在此处。”,以及XAML应用中位于其下方的空白区域。我已按照网站上的文件进行操作 The XAML App output
The JS App output

这是 html -

<!DOCTYPE html>
<html>
<head>
    <title></title>

    <script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=visualization"></script>

    <!-- mapframe references -->
    <link href="/map.css" rel="stylesheet" />
    <script src="/map.js"></script>

</head>
<body>
    <div>Content goes here.</div>
    <div id="mapwindow"></div>
</body>
</html>

js如下 -

var map;

function initialize() {
    map = new google.maps.Map(document.getElementById('mapdisplay'), {
        zoom: 3,
        center: new google.maps.LatLng(40, -187.3),
        mapTypeId: google.maps.MapTypeId.TERRAIN
    });
}
google.maps.event.addDomListener(window, 'load', initialize);

CSS是 -

html, body, #mapwindow {
    margin: 0;
    padding: 0;
    height: 100%;
}

提前致谢!

0 个答案:

没有答案