Question

我正在尝试将我的融合表分层到Google高程图上。我知道我的融合表的ID，但是当我打开html文件时它似乎没有加载。我试图将融合表层放在代码的其他部分，但这似乎搞砸了整个事情。目前，只加载高程图。

感谢您的帮助！

到目前为止，我的代码看起来像这样：

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Southern Ontario Ski Resort Elevation Map</title>
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>

var elevator;
var map;
var infowindow = new google.maps.InfoWindow();
var toronto = new google.maps.LatLng(43.653226, -79.383184);


layer = new google.maps.FusionTablesLayer({
    query: {
      select: '\'Latitude\'',
      from: '1vYUBXl1TCBYOjuz9hH97rFPmtoVniB2-ytxqmlk'
    }
  });
  layer.setMap(map);

function initialize() {
  var mapOptions = {
    zoom: 8,
    center: toronto,
    mapTypeId: 'terrain'
  }

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  elevator = new google.maps.ElevationService();

  google.maps.event.addListener(map, 'click', getElevation);
}

function getElevation(event) {

  var locations = [];

  var clickedLocation = event.latLng;
  locations.push(clickedLocation);

  var positionalRequest = {
    'locations': locations
  }

  elevator.getElevationForLocations(positionalRequest, function(results, status) {
    if (status == google.maps.ElevationStatus.OK) {

      if (results[0]) {

       infowindow.setContent('The elevation at this point <br>is ' + results[0].elevation + ' meters.');
        infowindow.setPosition(clickedLocation);
        infowindow.open(map);
      } else {
        alert('No results found');
      }
    } else {
      alert('Elevation service failed due to: ' + status);
    }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>

Answer 1

您正在尝试在创建地图之前加载Fusion Table。这似乎现在有效：

//...
function initialize() {
var elevator;
var map;
var infowindow = new google.maps.InfoWindow();
var toronto = new google.maps.LatLng(43.653226, -79.383184);
  var mapOptions = {
    zoom: 8,
    center: toronto,
    mapTypeId: 'terrain'
  }
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    layer = new google.maps.FusionTablesLayer({
    query: {
      select: '\'Latitude\'',
      from: '1vYUBXl1TCBYOjuz9hH97rFPmtoVniB2-ytxqmlk'
    }
  });
  layer.setMap(map);

  elevator = new google.maps.ElevationService();//...

如何使用Google API代码对Google Fusion Table进行分层？

1 个答案: