从google map api导入商家信息

2013年 13月 05日 22:39

最近着手做o2o项目
需要用到很多商户信息,关键是还需要商家的经纬度
起初,手动添加,然后通过GOOGLEMAPAPI 标记位置存储到数据库
可是这样添加效率太低了,决定从GOOGLE这边获取信息导入

参考GOOGLE MAP开发手册

https://developers.google.com/maps/documentation/javascript/places?hl=zh-CN

应用场景

  1. 使用地方搜索,拖动MARKER后获取附近商家列表
  2. 点击列表,使用地方详情请求,获取商家信息,名称,地址,电话,坐标
  3. 添加表单提交到数据库
3AA68C3A-FBD9-4485-B51E-1376870D1850.png

加载地方信息库
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>

以下代码改造自官方实例,我对JS不擅长,代码比较喳喳,有点混乱..在行GOOGLE API的用户欢迎指出

function initialize() {
  var pyrmont = new google.maps.LatLng(31.150681,121.124178);

  map = new google.maps.Map(document.getElementById('map'), {
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: pyrmont,
      zoom: 16
    });
 var marker = new google.maps.Marker({
    position: map.getCenter(),
    map: map,
    draggable: true
  });
google.maps.event.addListener(marker, 'dragend', function() {
     $("#gglist").html('');//返回的列表,拖动时清空下
var custPoint = marker.getPosition();
var newloc=new google.maps.LatLng(custPoint.lat().toFixed(6),custPoint.lng().toFixed(6));
var request = {
    location: newloc,
    radius: '500'
  //  query: $("#maptp").val()  这行如果使用文本搜索,比如输入关键字 青浦 这样的
  };

  service = new google.maps.places.PlacesService(map);
  service.search(request, get_list);//textSearch 使用文本搜索
  });
}

function get_list(results, status) {// 返回的商家列表
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      var place = results[i];
      //showlist(results[i]);
      $("#gglist").append('<li><span onclick="addthis(\''+place.reference+'\');">'+place.name+'</span></li>');
    }
  }
}

返回的数据主要是名字,一定要记得 reference,查询详情需要传递这个参数
详情中也有评论..不过GOOGLE 的评论太少了..

function addthis(ggref){ //根据传递reference 获取商家信息
var request = {reference:ggref};
service = new google.maps.places.PlacesService(map);
service.getDetails(request, get_gg_detail);
    }
function get_gg_detail(place, status){//返回后添加到表单


    }