百度地图

暂无

by l xk

HTML

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=A4749739227af1618f7b0d1b588c0e85"></script>

<!--百度地图容器-->
<div style="width:100%;border:#ccc solid 1px;font-size:12px" id="map"></div>
<!-- <br> -->
<input type="button" name="" value="点击获取你当前的位置" onclick="getLocation()">

CSS

* {
  margin: 0;
  padding: 0;
}

input[type=button] {
  -webkit-appearance: none;
  outline: none;
  border: 0 none;
  background: #f69c00;
  width: 50%;
  height: 42px;
  margin-left: 25%;
  line-height: 42px;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
  border-radius: 4px;
}

@media screen and (min-width: 414px) {
  /*当屏幕尺寸大于413px时，应用下面的CSS样式*/
  div {
    height: 610px;
  }
}

@media screen and (min-width:375px) and (max-width: 413px) {
  /*当屏幕尺寸大于375px,小于413px时，应用下面的CSS样式*/
  div {
    height: 530px;
  }
}

@media screen and (min-width:320px) and (max-width: 374px) {
  /*当屏幕尺寸大于320px;小于413px时，应用下面的CSS样式*/
  div {
    height: 450px;
  }
}

JavaScript

function getLocation() {
  if (!navigator.geolocation) {
    alert("Sorry, browser does not support geolocation!");
    return;
  }

  function geo_success(position) {
    var latitude;
    var longitude;
    // 经度 113°
    longitude = position.coords.longitude;
    // 维度 23°
    latitude = position.coords.latitude;

    createBaiduMap(longitude, latitude)

  }

  function geo_error(err) {
    if (err.code == 1) {
      alert("Error: Access is denied!");
    } else if (err.code == 2) {
      alert("Error: Position is unavailable!");
    }
  }

  var geo_options = {
    enableHighAccuracy: true,
    maximumAge: 30000,
    timeout: 27000
  };


  navigator.geolocation.getCurrentPosition(geo_success, geo_error, geo_options);
}

function createBaiduMap(Longi, Lati) {

  //创建和初始化地图函数：
  function initMap() {
    createMap(); //创建地图
    setMapEvent(); //设置地图事件
    addMapControl(); //向地图添加控件
    addMapOverlay(); //向地图添加覆盖物
  }

  function createMap() {

    map = new BMap.Map("map");

    if (!Longi && !Lati) {
      // 默认北京
      map.centerAndZoom(new BMap.Point(116.413677, 39.910873), 15);
    } else {
      map.centerAndZoom(new BMap.Point(Longi, Lati), 15);
    }

  }

  function setMapEvent() {
    map.enableScrollWheelZoom();
    map.enableKeyboard();
    map.enableDragging();
    map.enableDoubleClickZoom()
  }

  function addClickHandler(target, window) {
    target.addEventListener("click", function() {
      target.openInfoWindow(window);
    });
  }

  function addMapOverlay() {

  }
  //向地图添加控件
  function addMapControl() {
    // 地图比例尺 scaleControl
    var scaleControl = new BMap.ScaleControl({
      anchor: BMAP_ANCHOR_BOTTOM_LEFT
    });
    scaleControl.setUnit(BMAP_UNIT_IMPERIAL);
    map.addControl(scaleControl);


    var navControl = new BMap.NavigationControl({
      anchor: BMAP_ANCHOR_TOP_LEFT,
      type: BMAP_NAVIGATION_CONTROL_LARGE
    });
    map.addControl(navControl);


    //地图缩略图  overviewControl
    var overviewControl = new...