Question

这是我的view.jsp，它只是Google的例子。我希望在继续前进之前让它显示出来：

<%@ include file="/init.jsp" %>

    <p>
        <b><liferay-ui:message key="mapsportlet_mapsPortletmvcportlet.caption"/></b>
    </p>

<DOCTYPE! html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
      html, body {
        height: 20%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 20%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDeekwNluL4ssJ3QAFGPSkFHYYQvZoNbVM&callback=initMap"
    async defer></script>
  </body>
</html>

我在localhost：8080上运行了liferay 7的本地实例。我相信JavaScript正在解雇，因为我没有正确设置我的API密钥，我可以在javascript控制台中看到它被拒绝了。修复我的API密钥后，我不再在浏览器的控制台中看到任何错误，但我看不到我的Portlet中的地图显示。

你认为view.jsp有什么问题吗？或者我还有另一种方法可以解决这个问题吗？

Answer 1

你用“liferay”标记这个问题，所以我假设你使用你发布的JSP作为portlet的视图。 portlet绝不能包含<html>，<head>或<body>，因为此标记将由门户添加。

同样要小心map id：如果将相同的portlet添加到页面两次，这将无法正常工作，因为最终会出现重复的HTML元素ID。如果这最终成为问题，请使用<portlet:namespace/>使标识符唯一。您可能还想尝试其他portlet已添加此ID。它可能已经工作，只是不可见 - 取决于当前已经使用此ID的位置。

另外，我不确定在<style>部分中包含<html><head>是否会被忽略<div>。尝试使用适当的高度明确地设置foreach样式。

无法在Liferay 7 MVC Portlet中显示Google Map

1 个答案: