控件可用位置：

大多数控件选项都包含 position 属性，该属性用于指明要在地图上放置相应

控件的位置。这些控件的定位并不是绝对的；相反，API 将通过使控件在给定约束（例如地图尺寸）内围绕现

有地图元素或其他控件“流动”，以智能方式安排控件布局。

·         TOP_CENTER：表示控件应沿着地图顶部中心放置

·         TOP_LEFT：表示控件应沿着地图左上角放置，控件的所有子元素“流”向顶部中心

·         TOP_RIGHT：表示控件应沿着地图右上角放置，控件的所有子元素“流”向顶部中心

·         LEFT_TOP：表示控件应沿着地图左上角放置，但应位于任何 TOP_LEFT 元素下方

·         RIGHT_TOP：表示控件应沿着地图右上角放置，但应位于任何 TOP_RIGHT 元素下方

·         LEFT_CENTER：表示控件应沿着地图左侧放置在 TOP_LEFT 和 BOTTOM_LEFT 之间的中心位置

·         RIGHT_CENTER：表示控件应沿着地图右侧放置在 TOP_RIGHT 和 BOTTOM_RIGHT 之间的中心位置

·         LEFT_BOTTOM：表示控件应沿着地图左下角放置，但应位于任何 BOTTOM_LEFT 元素上方

·         RIGHT_BOTTOM：表示控件应沿着地图右下角放置，但应位于任何 BOTTOM_RIGHT 元素上方

·         BOTTOM_CENTER：表示控件应沿着地图底部中心放置

·         BOTTOM_LEFT：表示控件应沿着地图左下角放置，控件的所有子元素“流”向底部中心

·         BOTTOM_RIGHT：表示控件应沿着地图右下角放置，控件的所有子元素“流”向底部中心

控件选项

有些控件是除了位置可以配置的，还允许您更改它们的行为或外观。例如，地图类型控件可以水平栏或下拉菜单形式显示。

地图类型控件可接受如下控件：

·         google.maps.MapTypeControlStyle.HORIZONTAL_BAR：用于在水平栏中将一组控件显示为如 Google 地图中所示的按钮

·         google.maps.MapTypeControlStyle.DROPDOWN_MENU：用于显示单个按钮控件，以便您通过下拉菜单选择地图类型

·         google.maps.MapTypeControlStyle.DEFAULT：用于显示默认行为，该行为取决于屏幕大小且可能会在以后的 API 版本中有所变化

您可以在创建地图时，通过地图的 MapOptions 对象中的字段来指定控件的显示效果。这些字段描述如下：

·         zoomControl：用于启用/禁用缩放控件。默认情况下，此控件可见并显示在地图右下角。zoomControlOptions 字段用于进一步指定要用于此控件的 ZoomControlOptions

·         mapTypeControl：用于启用/禁用地图类型控件，该控件可让用户在不同的地图类型（例如“地图”和“卫星”）之间进行切换。默认情况下，此控件可见并显示在地图左上角。mapTypeControlOptions 字段用于进一步指定要用于此控件的 MapTypeControlOptions

·         streetViewControl：用于启用/禁用街景小人控件，该控件可让用户激活 Street View 全景图。默认情况下，此控件可见并显示在地图右下角。streetViewControlOptions 字段用于进一步指定要用于此控件的StreetViewControlOptions

·         scaleControl：用于启用/禁用比例控件，该控件可提供一个简单的地图比例尺。默认情况下，此控件不可见。启用后，它将始终显示在地图右下角。scaleControlOptions 用于进一步指定要用于此控件的ScaleControlOptions

代码示例:

var map;
//自定义地图
function BigeMap() {}
//地图下属瓦片大小
BigeMap.prototype.tileSize = new google.maps.Size(256, 256);
//地图最大级别
BigeMap.prototype.maxZoom = 19;
//地图最小级别
BigeMap.prototype.minZoom = 4;
//地图名称
BigeMap.prototype.name = "谷歌在线地图";
//此地图种类获取URL的地址
BigeMap.prototype.getTile = function (coord, zoom, ownerDocument) {
    var img = ownerDocument.createElement("img");
    img.style.width = this.tileSize.width + "px";
    img.style.height = this.tileSize.height + "px";
    //这里使用谷歌在线的数据，当然您也可以使用Bigemap地图下载器下载的离线瓦片作为此处的地址
    var strURL = 'http://mt0.google.cn/vt/lyrs=m@365000000&hl=zh-CN&gl=cn&x=' + coord.x + '&y=' + coord.y + '&z=' + zoom + '&s=Galil';
    img.src = strURL;
    return img;
};
var google_map = new BigeMap();

var offline_map=new BigeMap();
offline_map.name='离线地图';
offline_map.getTile=function (coord,zoom,ownerDocument) {
    var img = ownerDocument.createElement("img");
    img.style.width = this.tileSize.width + "px";
    img.style.height = this.tileSize.height + "px";
    //这里使用Bigemap地图下载器下载的离线瓦片作为此处的地址
    var strURL = './tiles/' + coord.x + '/' + coord.y + '/' + zoom+'.png';
    img.src = strURL;
    return img;
};

var myOptions = {
    //设置中心点
    center: new google.maps.LatLng(30.54024807, 104.06966686),
    //默认显示级别
    zoom: 4,
    zoomControl: true,//缩放控件
    zoomControlOptions:{
        //益在左下角
        position:google.maps.ControlPosition.LEFT_BOTTOM
    },
    mapTypeControl: true,//地图类型控件
    scaleControl: true, //比例控件
    streetViewControl: false, //是否显示街景 因为大部分是离线，所以不需要显示
    mapTypeControlOptions: {
        mapTypeIds: ['google_map','google_offline'],
        //位置在右上角
        position:google.maps.ControlPosition.TOP_RIGHT,
        //样式为下拉样式
        style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
    }
};

//初始化map对象
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
//向map对象中添加离线地图
map.mapTypes.set('google_offline',offline_map);
//向map对象中添加在线地图
map.mapTypes.set('google_map', google_map);
//设置map对象默认显示 google 在地图
map.setMapTypeId('google_map');