1

在 Google 专家的大力帮助下,我的 HTML 代码在将 HTML 文件拖到浏览器时可以完美运行。但是,我无法让它在我们的 Google 网站上正确显示。我得到的最接近的是搜索框部分显示但没有地图。试图将 HTML 直接放到页面上是行不通的。iFrame 包装器不起作用。如果有人可以提供帮助,以下是 HTML:

<!DOCTYPE html>
<html>
  <head>
  <style>
    #panel {
      margin: 8px 0;
    }
    #map-canvas { width:700px; height:700px; }
  </style>
  <script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=false">
  </script>
  <script type="text/javascript">
    var map;
    var layer_0;
    function initialize() {
      geocoder = new google.maps.Geocoder();
      map = new google.maps.Map(document.getElementById('map-canvas'), {
        center: new google.maps.LatLng(38.497533829342345, -86.4128420767679),
        zoom: 11,
        mapTypeId: google.maps.MapTypeId.HYBRID
      });
      var style = [
        {
          featureType: 'all',
          elementType: 'all',
          stylers: [
            { saturation: -20 }
          ]
        }
      ];
      var styledMapType = new google.maps.StyledMapType(style, {
        map: map,
        name: 'Styled Map'
      });
      map.mapTypes.set('map-style', styledMapType);
      map.setMapTypeId('map-style');
      layer_0 = new google.maps.FusionTablesLayer({
        query: {
          select: "col2",
          from: "1ET-gDs1z0v1T5LVIjYEMPLLCIhLQ1IRiWhq7IMY"
        },
        map: map,
        styleId: 2,
        templateId: 2
      });
    }
    google.maps.event.addDomListener(window, 'load', initialize);

   function codeAddress() {
      var street = document.getElementById('street').value;
      var city = document.getElementById('city').value;
      var address = street + ' ' + city + ' Indiana';
      geocoder.geocode({'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          map.setCenter(results[0].geometry.location);
    map.setZoom(15);
          var marker = new google.maps.Marker({
              map: map,
              position: results[0].geometry.location
          });
        } else {
          alert('Unable to locate the address');
        }
      });
   }
   </script>
  </head>
  <body>

    <div id="panel">
      <span>Enter street address:</span>
      <input id="street" type="textbox" value="501 Elm St">
      <span>City: </span>
      <select id="city">
    <option value="Paoli, Indiana">Paoli</option>
    <option value="Hardinsburg, Indiana">Hardinsburg</option>
    <option value="Orleans">Orleans</option>      <option value="Marengo">Marengo</option>      <option value="English">English</option>      <option value="Campbellsburg">Campbellsburg</option>       <option value="Livonia">Livonia</option>       <option value="French Lick">French Lick</option>
    <option value="West Baden">West Baden</option>       <option value="Orangeville">Orangeville</option>         <option value="">(Other)</option>
      </select>
      <input type="button" value="Show address" onclick="codeAddress()">
    </div>
    <div id="map-canvas"></div>
  </body>
</html>
4

1 回答 1

0

您有一个带有 Html/javascript 的应用程序

您必须在 Google APP 引擎上添加此应用程序才能在 Google 协作平台上部署您的应用程序。

http://tutorialzine.com/2011/01/getting-started-with-google-app-engine/

我认为,本教程可以帮助您。

于 2014-06-25T14:14:23.307 回答