我的ImageMapType实现卡住了

时间:2013-08-15 05:14:07

标签: javascript google-maps google-maps-api-3

我正在尝试实现自己的基本图像映射。但是我的代码出错了。它在我突出显示的行上遇到错误(使用 * *)。地图回退到默认路线图。错误信息只是“错误”,我不知道发生了什么。

你能帮忙看一下吗?

非常感谢!

我的javascript代码:

  <html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=my-api-key&sensor=true">
    </script>
    <script>

      // custom map type
      var mapTypeOptions = {
        getTileUrl: function(coord, zoom) {
           return 'http://http://placehold.it/256x256.gif';
        },
        tileSize: new google.maps.Size(256, 256),
        name: 'Some Place',
      };
      var customMapType = new google.maps.ImageMapType(mapTypeOptions);

      // initalize function
      function initialize() {

        // try to create a new map with custom map type
        var mapOptions = {
          center: new google.maps.LatLng(22.33173, 114.16061),
          zoom: 17,
          minZoom: 17,
          mapTypeId: google.maps.MapTypeId.ROADMAP,
        };

        var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
        map.mapTypes.set('ssp', customMapType); // ****
        map.setMapTypeId('ssp');    
      }
      google.maps.event.addDomListener(window, 'load', initialize);

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

1 个答案:

答案 0 :(得分:1)

看起来你错过了配置设置

mapTypeControlOptions: {
  mapTypeIds: ["ssp"]
}

此外,您需要为maxzoom定义mapTypeOptions

请参阅示例:https://developers.google.com/maps/documentation/javascript/maptypes#ImageMapTypes

您还遇到了一些验证错误,在关闭对象之前删除了尾随逗号。