问题：

GMAPS API在本地主机中不工作

阳狐若

2023-03-14

我正在尝试执行gmapsapi密钥的第一个示例https://developers.google.com/maps/documentation/javascript/tutorial?hl=es-419

在localhost的示例网站中，但地图没有加载。该API密钥是正确的，并与我的谷歌项目检查。

    <!DOCTYPE html>
<html>
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="/js/jquery.min.js" type="text/javascript"></script>
 <style type="text/css">
      html, body { height: 100%; margin: 0; padding: 0; }
      #map { height: 100%; }
    </style>

<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="/js/main.js"></script>



</head>

<div id="content">


<div id="header"> 
    <div id="logo">
        <h1><a href="#">MiEmpresa</a></h1>
        <h2><a href="" id="metamorph">Programación web a medida</a></h2>
    </div>
    <div id="menu">
        <ul>
            <li><a href="index.html" title="">Inicio</a></li>
            <li><a href="presupuesto.html" title="">Presupuesto</a></li>
            <li><a href="galeria.html" title="">Galería</a></li>
            <li><a href="localizacion.html" title="">Dónde estamos</a></li>
            <li><a href="contacto.html" title="">Contacto</a></li>
        </ul>
    </div>
</div>


 <div id="main_top">
<div id="main">
    <div id="right">
      <div id="map"></div>
    <script type="text/javascript">

var map;
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });
}

    </script>
    <script async defer
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB0t7voaGTqvsbCQ12MUWEfAquxMkLNBXc&callback=initMap">
    </script>

    </div>




</body>
</html>

共有2个答案

宁浩博

2023-03-14

假设您已连接到entet且localhost未脱机

尝试添加宽度到您的#地图

    #map {
        height: 100%;  
        width: 500px;
   }

如果有效，则应为贴图id和所有父容器指定适当的宽度（例如：宽度：100%；）

那安宁

2023-03-14

相关问题：谷歌地图刷新灰色

从这个问题：

确保显示地图的div具有有效的大小，如果它被隐藏，它将具有零大小，并且您需要在显示div之前将其具有有效的大小。如果使用百分比调整大小，请确保其所有父元素都具有百分比大小或特定大小（有关详细信息，请参阅Mike Williams的Google Maps API v2教程）。

你的地图没有大小。如果我添加以下css：

  #right { height: 100%; }
  #main {height: 500px; }
  #map { height: 100%; }

地图出现。

代码段：

var map;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {
      lat: -34.397,
      lng: 150.644
    },
    zoom: 8
  });
}

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#right {
  height: 100%;
}
#main {
  height: 500px;
}
#map {
  height: 100%;
}

<div id="content">


  <div id="header">
    <div id="logo">
      <h1><a href="#">MiEmpresa</a></h1>
      <h2><a href="" id="metamorph">Programación web a medida</a></h2>
    </div>
    <div id="menu">
      <ul>
        <li><a href="index.html" title="">Inicio</a>
        </li>
        <li><a href="presupuesto.html" title="">Presupuesto</a>
        </li>
        <li><a href="galeria.html" title="">Galería</a>
        </li>
        <li><a href="localizacion.html" title="">Dónde estamos</a>
        </li>
        <li><a href="contacto.html" title="">Contacto</a>
        </li>
      </ul>
    </div>
  </div>


  <div id="main_top">
    <div id="main">
      <div id="right">
        <div id="map"></div>
      </div>
    </div>
  </div>
</div>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk">
</script>

类似资料：

Wordpress本地主机不工作[重复]

我是wordpress的新手，所以请协助。 3）在wp-config.php中将WP_CACHE变为false 我不知道还能做什么，请协助。
wamp本地主机工作，但其他虚拟主机不工作

我已经在Drive：/SOFTWARES/wamp文件夹上安装了wamp服务器。但是在这里，我有一个问题。只有localhost向我显示wamp索引页。如果我输入网址，设置为虚拟主机，要么1。当我不使用互联网时，它们显示“无法连接”。2.他们通过网络重定向到一些网址。我在wamp安装后采取的步骤： 1）联合国对httpd中的vhost配置行进行了评论。配置文件 3）在windows的主
MAMP本地主机服务器不工作

LocalHost显示空白页。我将Apache的端口更改为80，当我按下open page时，它会转到localhost/mamp。当我删除/mamp时，我得到的只是一个空白页。我尝试过多种方法，比如关闭mamp，启动它，重新启动我的机器。我已经检查了文件夹设置，一切正常。我通过创建一个新的文件页索引来测试它。html，它打开的很好。我不知道它为什么不打开我的索引。php文件。下面是我的php
Web口袋在本地主机上工作，但不在远程Ubuntu主机上工作

我有两个应用程序——基于浏览器的客户端和基于NodeJS的服务器，它们都使用WebSockets进行通信（我使用的是ColyseusJS库）。问题是，当我在本地主机上测试它们时，一切都正常，但当我将应用程序部署到我的Ubuntu VPS服务器时，它停止工作。我在尝试连接时在浏览器中收到的消息是：所以它到达服务器（因为当服务器被禁用时，消息是“连接建立中的错误：净::ERR_CONNECTION
本地主机工作正常，但 phpmyadmin 不是

我已经安装了Wamp Server 2.4。安装正常。我可以登录到本地主机。除了phpmyadmin页面之外，一切都正常（包括sqlbuddy和webgrind）。你能帮我解决可能导致这个问题的原因吗。我在这里附上apache访问日志： 127 . 0 . 0 . 1---[2013年7月17日:17:20:43 0530]" GET/phpmyadmin/HTTP/1.1 " 500-127 .
MAMP本地主机不工作（错误500）-LWT

我试图在我的mac上运行LWT，并为此安装了MAMP。我已经按照这些说明进行了操作，但是当我尝试转到我得到了： localhost页不行 localhost当前无法处理此请求。 500 我在htdocs文件夹中创建了一个不同的文件夹，并在其中创建了一个php文件（index.php），其中包含一些代码以查看php是否正常工作：这一切都很好，很有效。我还检查了lwt文件夹的用户权限，但看起来也不错

GMAPS API在本地主机中不工作

共有2个答案

相关问答

相关文章

相关阅读

相关工具

相关文档