现在需求有一堆外卖客户坐标,需要显示到百度地图的中,并显示出,相同坐标有几个,及其地址。
比如:
效果图如上所示,下面我们开始:
第一步:创建jsp
我的是zuobiao.jsp
页面引入jquery即可文件:
源码如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="utf-8"%>
后台数据格式如下:
[{point:"116.488880,40.007684","title":"订单数:4个",address:"梅赛德斯-奔驰乘用车中国研发中心 (美团网)"},{point:"116.466928,39.996468","title":"订单数:1个",address:"夏都家园 (1号楼B单元401)"},{point:"116.480872,39.997200","title":"订单数:1个",address:"望京SOHO中心T1 (c座0707)"},{point:"116.469278,39.997421","title":"订单数:2个",address:"望京西园4区(A门) (426号楼2106)"},{point:"116.472630,39.992189","title":"订单数:2个",address:"北京市朝阳区东亚望京中心B座1808 (北京市朝阳区东亚望京中心B座1808)"},{point:"116.489176,40.007724","title":"订单数:3个",address:"望京东路6号 (望京国际研发园F座美团网)"},{point:"116.481175,39.996748","title":"订单数:4个",address:"望京SOHO中心T1 (C座511)"},{point:"116.480728,39.995960","title":"订单数:4个",address:"望京SOHO中心T3-办公(入口) (45层 海马玩)"},{point:"116.478784,39.989812","title":"订单数:3个",address:"悠乐汇E座 (2106室)"},{point:"116.483780,40.006722","title":"订单数:3个",address:"摩托罗拉大厦"},{point:"116.488400,40.006508","title":"订单数:8个",address:"望京国际研发园C座 (望京国际研发园C座)"},{point:"116.474442,39.983986","title":"订单数:1个",address:"北京经济管理职业学院 (北京经济管理职业学院)"},{point:"116.488400,40.006508","title":"订单数:8个",address:"望京国际研发园C座 (望京国际研发园C座)"},{point:"116.483664,39.998340","title":"订单数:4个",address:"融科望京中心A座 (1906)"},{point:"116.469278,39.997421","title":"订单数:2个",address:"望京西园4区(A门) (426号楼2106)"},{point:"116.478336,40.001324","title":"订单数:2个",address:"望京西园(三区) (311号楼2206)"},{point:"116.470166,39.996368","title":"订单数:3个",address:"望京西园421号楼 (421号楼708)"},{point:"116.488124,40.006465","title":"订单数:3个",address:"望京国际研发园C座(正门) (东门bc座)"},{point:"116.472630,39.992189","title":"订单数:2个",address:"北京市朝阳区东亚望京中心B座1808 (北京市朝阳区东亚望京中心B座1808)"},{point:"116.479934,39.985504","title":"订单数:1个",address:"渤海银行(望京支行)"},{point:"116.483242,39.997772","title":"订单数:1个",address:"融科望京中心B座 (16层)"},{point:"116.472249,39.991946","title":"订单数:1个",address:"东亚·望京中心A座-出入口2 (A座1115)"},{point:"116.488456,40.006784","title":"订单数:5个",address:"望京国际研发园 (望京东路6号望京国际研发园三期)"},{point:"116.489440,39.997024","title":"订单数:2个",address:"保利中央公园艺林园(北门) (望京保利中央公园麦田房产)"},{point:"116.483520,39.998496","title":"订单数:1个",address:"融科望京中心A座(正门) (1906)"},{point:"116.483664,39.998340","title":"订单数:4个",address:"融科望京中心A座 (1906)"},{point:"116.483664,39.998340","title":"订单数:4个",address:"融科望京中心A座 (1906)"},{point:"116.472936,40.000448","title":"订单数:1个",address:"望京西园329号楼 (608)"},{point:"116.489342,39.995872","title":"订单数:1个",address:"保利·中央公园艺林园15号楼1单元301 (保利·中央公园艺林园15号楼1单元301)"},{point:"116.485904,39.994984","title":"订单数:1个",address:"国风北京 (606栋2104室)"},{point:"116.476364,40.001495","title":"订单数:1个",address:"望京西园(三区)303号楼304 (望京西园(三区)303号楼304)"},{point:"116.488880,40.007684","title":"订单数:4个",address:"梅赛德斯-奔驰乘用车中国研发中心"},{point:"116.478784,39.989812","title":"订单数:3个",address:"悠乐汇E座 (2106室)"},{point:"116.479936,39.985504","title":"订单数:2个",address:"渤海银行(望京支行) (1F)"},{point:"116.492104,40.005364","title":"订单数:2个",address:"中轻大厦B座 (1单元2701)"},{point:"116.473025,39.986368","title":"订单数:2个",address:"金兴路2号院2号楼 (二单元501)"},{point:"116.483780,40.006722","title":"订单数:3个",address:"摩托罗拉大厦"},{point:"116.469672,39.994568","title":"订单数:1个",address:"望京西园426号楼 (二楼201)"},{point:"116.471088,39.990212","title":"订单数:1个",address:"望花路西里5号楼-二单元 (402)"},{point:"116.473025,39.986368","title":"订单数:2个",address:"金兴路2号院2号楼 (1单元702)"},{point:"116.490792,40.005400","title":"订单数:2个",address:"中轻大厦(溪阳东路)"},{point:"0,0","title":"订单数:2个",address:"望京星源国际"},{point:"116.483780,40.006722","title":"订单数:3个",address:"摩托罗拉大厦"},{point:"116.477487,40.004156","title":"订单数:1个",address:"望京西园102号楼-四单元 (601)"},{point:"116.489616,39.996540","title":"订单数:1个",address:"保利·中央公园艺林园 (13号楼 2单元 201)"},{point:"116.474216,40.007792","title":"订单数:1个",address:"望京花园(东区) (203号楼2603室)"},{point:"116.480088,40.003452","title":"订单数:1个",address:"慧谷阳光 (206号楼5单元302室)"},{point:"116.480192,40.003400","title":"订单数:2个",address:"慧谷阳光207号楼 (4单元702)"},{point:"116.481888,40.001740","title":"订单数:1个",address:"宝星园(北门) (104号16C)"},{point:"116.478336,40.001324","title":"订单数:2个",address:"望京西园(三区) (311号楼2206)"},{point:"116.472768,39.992288","title":"订单数:1个",address:"东亚·望京中心B座 (8楼820)"},{point:"116.480250,40.003424","title":"订单数:1个",address:"慧谷阳光 (朝阳区阜安西路慧谷阳光2021单元403室)"},{point:"116.475664,40.000036","title":"订单数:1个",address:"望京西园3区 (302号楼104室)"},{point:"116.466872,39.988748","title":"订单数:1个",address:"阜通西大街18号院2号楼 (1单元908)"},{point:"116.488788,40.006086","title":"订单数:1个",address:"望京国际研发园(东南门) (FG座美团网)"},{point:"116.470776,39.989420","title":"订单数:2个",address:"望花路西里社区 (20号楼20层7号门)"},{point:"116.466528,39.996812","title":"订单数:1个",address:"广顺北大街31号院1号楼-B单元 (夏都家园1号楼B单元1405)"},{point:"116.481175,39.996748","title":"订单数:4个",address:"望京SOHO中心T1 (1047鲁艺十三)"},{point:"116.489388,40.006859","title":"订单数:3个",address:"望京国际研发园E座 (施耐德北门,美团网)"},{point:"116.489384,40.006860","title":"订单数:8个",address:"望京国际研发园E座 (望京国际研发园美团网)"},{point:"116.481776,39.990888","title":"订单数:1个",address:"方恒国际中心C座 (3-310)"},{point:"116.490834,40.005123","title":"订单数:1个",address:"中轻大厦A座(正门) (15层)"},{point:"116.479936,39.985504","title":"订单数:2个",address:"渤海银行(望京支行)"},{point:"116.473256,39.987216","title":"订单数:1个",address:"点击未来沁居(东南门) (410)"},{point:"116.470776,39.989420","title":"订单数:2个",address:"望花路西里社区 (20号楼20层7号门)"},{point:"116.478684,39.985421","title":"订单数:1个",address:"嘉润花园D座 (108室)"},{point:"116.489112,40.007700","title":"订单数:2个",address:"美团网 (望京国际研发园美团网北门)"},{point:"116.488241,40.006215","title":"订单数:1个",address:"望京国际研发园B座 (4层)"},{point:"116.468610,39.995296","title":"订单数:2个",address:"望京西园4区(西一门) (424楼 1009)"},{point:"116.468838,39.995108","title":"订单数:2个",address:"望京西园424号楼 (1009)"},{point:"116.468616,39.995296","title":"订单数:1个",address:"望京西园4区(西一门) (424楼1009)"},{point:"116.482504,39.996492","title":"订单数:1个",address:"望京SOHO-P1区 (2楼)"},{point:"116.489176,40.007724","title":"订单数:3个",address:"望京东路6号 (望京国际研发园F座美团网)"},{point:"116.481080,39.990492","title":"订单数:3个",address:"方恒国际中心B座(正门) (1001)"},{point:"116.470166,39.996368","title":"订单数:3个",address:"望京西园421号楼 (421号楼708)"},{point:"116.487720,40.006224","title":"订单数:1个",address:"望京国际研发园(正门) (F座北门)"},{point:"116.473184,39.987712","title":"订单数:1个",address:"点击未来沁居 (16号楼9层906)"},{point:"116.468610,39.995296","title":"订单数:2个",address:"望京西园4区(西一门) (424楼1009)"},{point:"116.489112,40.007700","title":"订单数:2个",address:"美团网 (望京国际研发园美团网北门)"},{point:"116.476158,40.000293","title":"订单数:1个",address:"望京西园3区 (308号楼304室)"},{point:"116.488256,40.007024","title":"订单数:2个",address:"望京国际研发园A座(正门) (美团网)"},{point:"116.489248,39.998181","title":"订单数:1个",address:"望京东园7区8号楼 (8-37)"},{point:"116.470239,39.993570","title":"订单数:3个",address:"里外里公寓 (广顺北大街429号里外里3-602)"},{point:"116.480728,39.995960","title":"订单数:4个",address:"望京SOHO中心T3-办公(入口) (望京SOHO中心T3-办公(入口))"},{point:"116.470166,39.996368","title":"订单数:3个",address:"望京西园421号楼 (421号楼708)"},{point:"116.472648,39.997516","title":"订单数:1个",address:"望京西园411号楼 (411~2111)"},{point:"116.488256,40.007024","title":"订单数:2个",address:"望京国际研发园A座(正门) (美团网)"},{point:"116.489438,39.997026","title":"订单数:1个",address:"保利中央公园艺林园(北门) (保利中央公园艺林园(北门)麦田房产)"},{point:"116.488124,40.006465","title":"订单数:3个",address:"望京国际研发园C座(正门)"},{point:"116.485949,39.990174","title":"订单数:1个",address:"望京国际商业中心(东北门) (大中电器四层)"},{point:"116.473685,39.993112","title":"订单数:1个",address:"首开广场 (4层)"},{point:"116.483776,40.006720","title":"订单数:1个",address:"摩托罗拉大厦"},{point:"116.472646,39.997515","title":"订单数:2个",address:"望京西园411号楼 (望京西园四区411号楼1701室)"},{point:"116.488560,40.007084","title":"订单数:2个",address:"施耐德电气 (望京国际研发园-美团网)"},{point:"116.488240,40.006216","title":"订单数:5个",address:"望京国际研发园B座 (东门)"},{point:"116.488456,40.006784","title":"订单数:5个",address:"望京国际研发园 (望京国际研发园F/G座)"},{point:"116.481133,39.996727","title":"订单数:1个",address:"望京soho塔1B座 (2309)"},{point:"116.476798,39.997340","title":"订单数:1个",address:"合生麒麟社3号楼 (3号楼1505)"},{point:"116.488576,40.007592","title":"订单数:2个",address:"戴姆勒大中华区投资有限公司 (研发园北门)"},{point:"116.488124,40.006465","title":"订单数:3个",address:"望京国际研发园C座(正门) (东门bc座)"},{point:"116.488584,40.006424","title":"订单数:1个",address:"望京东路6号 (望京国际研发园C座)"},{point:"116.488120,40.006464","title":"订单数:4个",address:"望京国际研发园C座(正门) (美团)"},{point:"116.488880,40.007684","title":"订单数:4个",address:"梅赛德斯-奔驰乘用车中国研发中心"},{point:"116.485920,40.008468","title":"订单数:4个",address:"锐创国际中心A座"},{point:"116.473354,39.992215","title":"订单数:1个",address:"朝阳区广顺南大街401号号 (东亚望京中心写字楼B座3309)"},{point:"116.489384,40.006860","title":"订单数:8个",address:"望京国际研发园F座 (美团网北门)"},{point:"116.488400,40.006508","title":"订单数:8个",address:"望京国际研发园C座 (望京国际研发园C座)"},{point:"116.484110,39.998904","title":"订单数:1个",address:"望京东园503号楼 (望京东园五区融科橄榄城502号楼底商顺丰速运)"},{point:"116.489440,39.997024","title":"订单数:2个",address:"保利中央公园艺林园(北门) (望京保利中央公园麦田房产)"},{point:"116.483664,39.998340","title":"订单数:4个",address:"融科望京中心A座 (融科望京中心A座506)"},{point:"116.488760,39.998920","title":"订单数:1个",address:"浦项中心B座 (10层)"},{point:"116.480040,39.997264","title":"订单数:1个",address:"望京SOHO中心T2 (b座803)"},{point:"116.489388,40.006859","title":"订单数:3个",address:"望京国际研发园E座"},{point:"116.483668,39.998339","title":"订单数:1个",address:"融科望京中心A座 (2008)"},{point:"116.489388,40.006859","title":"订单数:3个",address:"望京国际研发园E座 (北门)"},{point:"116.488400,40.006509","title":"订单数:4个",address:"望京国际研发园C座 (施耐德电气大厦东门)"},{point:"116.490794,40.005401","title":"订单数:1个",address:"中轻大厦(溪阳东路) (16楼)"},{point:"116.480567,39.996138","title":"订单数:3个",address:"望京SOHO中心T3 (A座3楼)"},{point:"116.480568,39.996140","title":"订单数:3个",address:"望京SOHO中心T3 (北京朝阳区望京soho T3 A座22层)"},{point:"116.488560,40.007084","title":"订单数:2个",address:"施耐德电气 (望京国际研发园(东门))"},{point:"116.490792,40.005400","title":"订单数:2个",address:"中轻大厦(溪阳东路) (中轻大厦A座)"},{point:"116.481426,39.999017","title":"订单数:1个",address:"宝星华庭公寓(东门) (东田造型)"},{point:"116.468838,39.995108","title":"订单数:2个",address:"望京西园424号楼 (2211)"},{point:"116.472646,39.997515","title":"订单数:2个",address:"望京西园411号楼 (望京西园四区411号楼1701室)"},{point:"116.477044,40.002995","title":"订单数:1个",address:"望京西园111号楼-二单元 (6层601)"},{point:"116.480202,39.997849","title":"订单数:1个",address:"望京SOHO中心T2-商业(北入口) (大堂)"},{point:"116.481608,39.996140","title":"订单数:1个",address:"望京SOHO中心T1-商业(东入口) (大堂)"}];
这里注意 先是经度,再是维度。
另外,推荐酸奶小妹的博客,非常好,写的:
http://www.cnblogs.com/milkmap/archive/2011/03/22/1991577.html?lo
作者:图里斯歌
2015年12月26日 22:49:14 笔