百度地图商家标注，查询附近3000米内的商家并标到地图上

效果图

这是JS ，其它部分源码需要的朋友可联系

您现在的位置




请选择省份


请选择城市


请选择地区







  

  

CSS

/* CSS Document */
.bai_Map { width: 1200px; height: 600px; margin: 0 auto; margin-top: 15px; overflow: hidden; position: relative; }
.bai_Map h2 { height: 35px; text-align: center; color: #FFF; font-size: 18px; font-weight: normal; line-height: 35px; background: #03ada4; }
.map_search { position: absolute; left: 100px; top: 50px; z-index: 1000; }
.map_search input { border: 1px solid #dfdfdf; padding: 6px 10px; float: left; font-size: 14px; color: #666; font-family: 'Microsoft Yahei'; box-shadow: #dfdfdf 0 0 4px; }
.map_search select { height: 35px; min-width: 140px; float: left; margin-right: 5px; font-size: 14px; border: 1px solid #dfdfdf; color: #666; box-shadow: #dfdfdf 0 0 4px; font-family: 'Microsoft Yahei' }
.map_search .map_text { padding: 3px 10px; border: 1px solid #dfdfdf; height: 27px; width: 250px; }
.map_search .map_btn { background: url(../images/mapsbtn.png) no-repeat; color: #FFF; border: 0px; font-size: 16px; border-radius: 3px; width: 70px; height: 35px; margin-left: 5px; cursor: pointer; }
.mapstorelist { border-radius: 5px; }
.mapstorelist dt { float: left; margin-right: 10px; }
.enterstore { padding: 5px 10px; background: url(../images/mapsbtn.png) no-repeat; color: #FFF; font-size: 14px; display: inline-block; margin-top: 10px; }
.enterstore:hover { color: #FFF; }
.maploading { display:none; width: 100%; height: 100%; background:url(../images/tm25.png); position: absolute; left: 0px; top:35px; }
.maploading .spinner { margin: 250px auto; width: 90px; height: 90px; position: relative; text-align: center; -webkit-animation: rotate 2.0s infinite linear; animation: rotate 2.0s infinite linear; }
.maploading .dot1, .dot2 { width: 60%; height: 60%; display: inline-block; position: absolute; top: 0; background-color: #e71e80; border-radius: 100%; -webkit-animation: bounce 2.0s infinite ease-in-out; animation: bounce 2.0s infinite ease-in-out; }
.maploading .dot2 { top: auto; bottom: 0px; -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }
 @-webkit-keyframes rotate { 100% {
-webkit-transform: rotate(360deg)
}
}
@keyframes rotate { 100% {
transform: rotate(360deg);
-webkit-transform: rotate(360deg)
}
}
 @-webkit-keyframes bounce {  0%, 100% {
-webkit-transform: scale(0.0)
}
 50% {
-webkit-transform: scale(1.0)
}
}
 @keyframes bounce {  0%, 100% {
 transform: scale(0.0);
 -webkit-transform: scale(0.0);
}
50% {
 transform: scale(1.0);
 -webkit-transform: scale(1.0);
}
}