地图找房（一）——业务分析 & 百度地图基本用法 & 页面跳转写法

地图找房——业务分析 & 百度地图基本用法 & 页面跳转写法

地图找房业务分析

• 点击地图找房图表跳转到地图找房页面
• 该页面会呈现出房源的聚合效果
• 点击聚合按钮，会打开二级区域
• 点击二级区域，会进入相应的三级区域
• 点击三级区域的方形图标，打开对应的房源列表
• 点击列表的条目，跳转到房源的详情页面

地图示例

百度地图基本用法

  // 跳转到地图找房页面
this.props.history.push('/map')

• 根据地理定位显示地图中心

  地址：https://lbsyun.baidu.com/jsdemo.htm#aCreateMap

initMap = () => {
  // 初始化地图
  let map = new window.BMap.Map("mymap"); 
  let myCity = new window.BMap.LocalCity();
  myCity.get((result) => {
    let { lng, lat } = result.center
    map.centerAndZoom(new window.BMap.Point(lng, lat), 12)
  })
}

引入地图