Fatal编程技术网
  • javascript/
  • Javascript 在Chrome插件中打开带有标记的Google地图

Javascript 在Chrome插件中打开带有标记的Google地图

javascript google-maps google-chrome google-maps-api-3 google-chrome-extension

Javascript 在Chrome插件中打开带有标记的Google地图,javascript,google-maps,google-chrome,google-maps-api-3,google-chrome-extension,Javascript,Google Maps,Google Chrome,Google Maps Api 3,Google Chrome Extension,我正在开发一个应用程序，这个chrome扩展是这个web应用程序的一部分。每当用户启动此扩展时，它都应显示带有预定义标记的地图。下面是我编写的test.html示例代码 <html> <head> <title>Test</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <link rel="styl

我正在开发一个应用程序，这个chrome扩展是这个web应用程序的一部分。每当用户启动此扩展时，它都应显示带有预定义标记的地图。下面是我编写的test.html示例代码

<html>
  <head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script src="http://maps.googleapis.com/maps/api/js"></script>
    <script>
      function initialize() {
        var mapProp = {
          center:new google.maps.LatLng(51.508742,-0.120850),
          zoom:5,
          mapTypeId:google.maps.MapTypeId.ROADMAP
        };
        var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>

  <body>
      <div id="loading">
        <div>
          <img src="img/sunny.png" />
          <p>Getting Data From Server</p>
        </div>
      </div>

      <div id="wrapper">
        <div id="weather"></div>
        <div id="googleMap" style="width:500px;height:380px;"></div>
      </div>
  </body>
</html>
它会打开一个弹出窗口，但不会加载地图。当我直接在浏览器中打开此html文件时，它工作正常。

控制台中是否有任何错误？或者您可以附加清单文件吗？顺便说一下，您应该在popup.html文件的开头添加
声明。 
chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('weather.html', {
    id: 'weather',
    innerBounds: {
      height: 450,
      width: 300,
    },
    resizable: true
  });
});