根据当前用户的公网IP展示当前城市服务网点 Laravel5
控制器方面(用户坐标自己获取):
use socket;
function get_onlineip() {
$socket = socket_create(AF_INET, SOCK_STREAM, 6);
$ret = socket_connect($socket,'ns1.dnspod.net',6666);
$buf = socket_read($socket, 16);
socket_close($socket);
return $buf;
}
public function serviceMap(Request $request)
{
//获取当前用户的IP
//$request->setTrustedProxies(array('10.32.0.1/16'));
$ip = $this->get_onlineip();
//调用淘宝IP地址库
$url = "http://ip.taobao.com/service/getIpInfo.php?ip=".$ip;
$city = json_decode(file_get_contents($url),true);
$data = DB::table('gwMap')->where('m_city',$city['city'])->get();
$citys = json_decode(json_encode($data),true);
$jsonxy = json_encode($data);
return view('home.service.serviceMap',['citys'=>$citys,'jsonxy'=>$jsonxy]);
}
视图页面:
<!--样式(根据需求定义)-->
<style type="text/css">#allmap {width: 100%;height: 800px;overflow: hidden;margin:0;font-family:"微软雅黑";}</style>
<div id="allmap"></div>
<input type="hidden" id="jsondata" value="{{$jsonxy}}">
<!-- 当前用户所在坐标(变活) -->
<input type="hidden" id="ids1" value="116.640272">
<input type="hidden" id="ids2" value="40.015802">
<!-- 百度地图off -->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=bQoUT35nqPLzxybLHX6T7UiDS9QrpPlER"></script>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
//获取我的坐标
var id1=$("#ids1").val();
var id2=$("#ids2").val();
var jsonxy = $("#jsondata").val();
var ll = eval(jsonxy);//对象转换成对象数组
map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(id1,id2), 13);//地图刚开始展示的位置(用户坐标)
var opts = {
width : 250, // 信息窗口宽度
height: 80, // 信息窗口高度
title : "经销商店名" , // 信息窗口标题
enableMessage:true//设置允许信息窗发送短息
};
for(var i=0;i<ll.length;i++){
var marker = new BMap.Marker(new BMap.Point(ll[i]['m_x'],ll[i]['m_y'])); // 创建标注(XY轴)
var content = ll[i]['m_site'];
//var content2 = data_info[i][3];
map.addOverlay(marker); // 将标注添加到地图中
addClickHandler(content,marker); // 标注下的信息
}
function addClickHandler(content,marker){
marker.addEventListener("click",function(e){
openInfo(content,e)}
);
}
function openInfo(content,e){
var p = e.target;
var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
var infoWindow = new BMap.InfoWindow(content,opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow,point); //开启信息窗口
}
</script>
<!-- 百度地图on -->