0

我需要一些帮助来确定将任何天气层代码放在自定义 Google 地图（API v3）的位置，任何输入将不胜感激:)

我们创建了一个自定义的 Google 地图，在上面我们有 2 个带有简单切换的 Fusion Table 图层。从开发人员文档以及我在此站点上找到的内容中，我可以看到我需要添加这段代码：

var weatherLayer = new google.maps.weather.WeatherLayer({
temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
});
weatherLayer.setMap(map);

但我完全不知道在哪里放置它，因为每次我尝试添加它（现在 2 天）时，代码都会中断，并且在 F12 控制台窗口中显示一个带有各种错误的空白白页。

我们需要在哪里添加它，我们如何将它添加到切换？这是我们的工作：

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=weather"></script>
    <script src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
    var map;

    var layer1;
    var tableid = '';

    var layer2;
    var tableid2 = 'xxxxx';

    var layer3;
    var tableid3 = 'xxxxx';

    function initialize() {
      map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: new google.maps.LatLng(31.499, -111.202),
        zoom: 10,
     mapTypeControl: true,
        mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
        position: google.maps.ControlPosition.TOP_CENTER
    },
    panControl: true,
    panControlOptions: {
        position: google.maps.ControlPosition.TOP_LEFT
    },
    zoomControl: true,
    zoomControlOptions: {
        style: google.maps.ZoomControlStyle.LARGE,
        position: google.maps.ControlPosition.LEFT_CENTER
    },
    scaleControl: true,
    scaleControlOptions: {
        position: google.maps.ControlPosition.BOTTOM_LEFT
    },
    streetViewControl: false,
    streetViewControlOptions: {
        position: google.maps.ControlPosition.LEFT_TOP
    }
  });

  var styledMapType = new google.maps.StyledMapType({
    map: map,
    name: 'Styled Map'
  });

  map.mapTypes.set('map-style', styledMapType);
  map.setMapTypeId('map-style');

  layer1 = new google.maps.FusionTablesLayer({
    query: {
      select: '',
      from: tableid
    },
    map: map
  });

  layer2 = new google.maps.FusionTablesLayer({
    query: {
      select: 'LOC',
      from: tableid2
    },
    map: map
  });

  layer3 = new google.maps.FusionTablesLayer({
    query: {
      select: 'geometry',
      from: tableid3
    },
suppressInfoWindows:true,
    map: map
  });
}


function changeMap(layerNum) {
  if (layerNum == 2) {
    update(layer2);
  }
  if (layerNum == 3) {
    update(layer3);
  }
}

function update(layer) {
  var layerMap = layer.getMap();
  if (layerMap) {
    layer.setMap(null);
  } else {
    layer.setMap(map);
  }
}

</script>

<style type="text/css">
    #toggle_box { 
        position: absolute; 
        top: 7px; 
        right: 7px; 
        padding: 3px; 
        border: 1px solid #707735; 
        background: #DED9C6; 
        font-family: 'Coda', cursive;
    }
    body { 
        margin: 0px; 
        padding: 0px;
        font-family: 'Coda', cursive;
        }
    #map_canvas {
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        font-family: 'Coda', cursive;
    }
    </style>
</head>
<body onload="initialize();">
<div id="map_canvas"></div>
<div id="toggle_box"><input type="checkbox" value="2" onclick="changeMap(this.value)" checked="checked" />REFERENCE POINTS
<input type="checkbox" value="3" onclick="changeMap(this.value)" checked="checked" />AZ COUNTIES</div>
    </body>
    </html>
4

1 回答 1

0

将它放在地图初始化的地方，例如在该行之前：

var styledMapType = new google.maps.StyledMapType({
于 2013-04-23T07:17:37.037 回答