百度地图页面

<div id="map_div" style="width:600px;height:600px"></div>
<script type="text/javascript">
function initialize() {
    var mp = new BMap.Map('map_div');
    mp.centerAndZoom(new BMap.Point(121.551842,38.890243), 11);
    mp.addControl(new BMap.NavigationControl());
    mp.addControl(new BMap.OverviewMapControl());
    mp.addControl(new BMap.ScaleControl());
    mp.addControl(new BMap.MapTypeControl());
    //mp.setCurrentCity("大连"); // 仅当设置城市信息时，MapTypeControl的切换功能才能可用
    /*
    Control：控件的抽象基类，所有控件均继承此类的方法、属性。通过此类您可实现自定义控件。
    NavigationControl：地图平移缩放控件，PC端默认位于地图左上方，它包含控制地图的平移和缩放的功能。移动端提供缩放控件，默认位于地图右下方。
    OverviewMapControl：缩略地图控件，默认位于地图右下方，是一个可折叠的缩略地图。
    ScaleControl：比例尺控件，默认位于地图左下方，显示地图的比例关系。
    MapTypeControl：地图类型控件，默认位于地图右上方。
    */
}

function loadScript() {
    var script = document.createElement("script");
    script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize";
    document.body.appendChild(script);
}

window.onload = loadScript;
</script>