老师帮我看下
虽然可以执行，但是会一直报错Uncaught RangeError: Maximum call stack size exceeded
at Object.g.c.add.g.BuryPoint.add
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>高德地图</title>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
#container {
width: 100%;
height: 100%;
position: absolute;
left: 0;
right: 0;
}
#searchNode {
position: absolute;
left: 10px;
top: 10px;
background-color: dodgerblue;
padding: 10px 30px;
opacity: .8;
height: 130px;
}
input {
width: 200px;
height: 25px;
border: none;
outline: none;
background-color: #4682B4;
display: block;
margin-top: 10px;
text-indent: 10px;
}
.icon i {
margin-left: 35px;
color: #fff;
opacity: .5;
}
.icon .active{
opacity: 1;
}
#searchBtn{
border: none;
outline: none;
color: #fff;
background-color: #00BFFF;
padding: 5px 20px;
margin-top: 10px;
float: right;
}
.cf::after{
content: ' ';
display: block;
clear: both;
}
#panel{
position: absolute;
top:160px;
left: 10px;
}
</style>
</head>
<body>
<div id="container"></div>
<div id="searchNode" class="cf">
<div class="icon"><i class="fa fa-car active"></i><i class="fa fa-bus"></i><i class="fa fa-bicycle"></i></div>
<input type="text" id="inputStart">
<input type="text" id="inputEnd">
<button id="searchBtn"></button>
</div>
<div id="panel"></div>
</body>
<script>
window.onload = function () {
var map = new AMap.Map('container', {
zoom: 10,//初始地图级别 越大越清晰
center: [116.65918, 39.878151]//中心位置
});
var $icon=$('.fa');
var $searchBtn=$('#searchBtn');
var $inputStart=$('#inputStart');
var $inputEnd=$('#inputEnd');
var searcheData = [{
type: '驾车',
tool:'Driving'
}, {
type: '公交',
tool:'Transfer'
}, {
type: '骑行',
tool:'Riding'
}]
function init(i) {
$icon.removeClass('active');
$icon.eq(i).addClass('active');
$searchBtn.text(searcheData[i].type);
$searchBtn.data('search-tool',searcheData[i].tool);
}
//初始化
init(0);
//确定方案
$icon.on('click',function () {
var currentIndex=$(this).index();
init(currentIndex);
$searchBtn.data('search-tool',searcheData[currentIndex].tool);
})
console.log( $searchBtn.data('search-tool'))
//查询
$searchBtn.on('click',function () {
if ($inputStart.val()===""||$inputEnd.val()==="") return;
map.clearMap();
var tool= $(this).data('search-tool')
new AMap[tool]({
map:map,
panel:'panel',
city:'beijing',//城市
size:1 //大小
}).search([
{keyword:$inputStart.val(),city:'北京'},
{keyword:$inputEnd.val(),city:'北京'}
],function(status,data){
console.log(data);
})
})
}
var js_Map = document.createElement('script');
js_Map.src = "https://webapi.amap.com/maps?v=1.4.15&key=403c2522da6c56b5d0d07dd7889dbaa6&callback=onload&plugin=AMap.Driving,AMap.Transfer,AMap.Riding";
document.head.appendChild(js_Map)
</script>
</html>
正在回答 回答被采纳积分+1
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 622 份
- 解答问题 6815 个
微信带火了小程序，也让前端工程师有了更多的展现机会，本阶段带你从移动基础知识的学习到webAPP开发，及小程序开发，让你PC端与移动端两端通吃。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星