window.onload = function() {
var map = new amap.map('form-right', {
resizeenable: true,
zoom: 12,
center: [102.730793, 25.053864]
});
//地图内容
map.setfeatures(['bg', 'building', 'road', 'point'])
//地图空间
amap.plugin(['amap.toolbar', 'amap.scale', 'amap.maptype'],
function() {
map.addcontrol(new amap.toolbar());
map.addcontrol(new amap.scale());
});
//覆盖物
var marker = new amap.marker({
position: [102.730793, 25.053864]
});
marker.setmap(map);
var circle = new amap.circle({
center: [102.730793, 25.053864],
radius: 100,
fillopacity: 0.2,
strokeweight: 1
})
circle.setmap(map);
//自定义窗体
var infowindow;
var infowindowcontent = '
欢迎下载本地图
基于高德地图api
(此处文字可修改) ';
map.plugin('amap.advancedinfowindow', function() {
infowindow = new amap.advancedinfowindow({
panel: 'panel',
placesearch: true,
asorigin: true,
asdestination: true,
content: infowindowcontent
});
infowindow.open(map, [102.730793, 25.053864]);
});
//汽车路线规划
$('#car').on('click', function() {
$('.pageshow').slidetoggle();
clearmarker()
amap.plugin('amap.driving', function() {
var drving = new amap.driving({
map: map,
panel: "panel"
})
drving.search([
{ keyword: $('#star').val() },
{ keyword: $('#end').val() }
]);
})
})
//步行路线规划
$("#riding").on('click', function() {
$('.pageshow').slidetoggle();
clearmarker()
var walking = new amap.walking({
map: map,
panel: "panel"
});
walking.search([
{ keyword: $('#cstar').val() },
{ keyword: $('#cend').val() }
]);
})
//骑行路线规划
$('#walk').on('click', function() {
$('.pageshow').slidetoggle();
clearmarker()
var riding = new amap.riding({
map: map,
panel: "panel"
});
riding.search([
{ keyword: $('#wstar').val() },
{ keyword: $('#wend').val() }
]);
})
function clearmarker() {
if (marker) {
marker.setmap(null);
marker = null;
}
if (infowindow) {
infowindow.close()
}
}
//输入提示
var autooptions = new amap.autocomplete({
input: "tipinput"
});
//城市搜索
var auto = new amap.autocomplete(autooptions);
var placesearch = new amap.placesearch({
map: map
}); //构造地点查询类
amap.event.addlistener(auto, "select", select); //注册监听,当选中某条记录时会触发
function select(e) {
placesearch.setcity(e.poi.adcode);
placesearch.search(e.poi.name); //关键字查询查询
}
$('#show').on('click', function() {
clearmarker()
$('.pageshow').slidetoggle();
})
$('#box').on('click', function() {
clearmarker()
$('.pageshow').slidetoggle();
var rectoptions = {
strokestyle: "dashed",
strokecolor: "#333",
fillcolor: "#333",
fillopacity: 0.3,
strokeopacity: 1,
strokeweight: 1
};
map.plugin(["amap.mousetool"], function() {
var mousetool = new amap.mousetool(map);
//通过rectoptions更改拉框放大时鼠标绘制的矩形框样式
mousetool.rectzoomin(rectoptions);
});
})
$('#meter').on('click', function() {
$('.pageshow').slidetoggle();
map.plugin(["amap.rangingtool"], function() {
ruler1 = new amap.rangingtool(map);
amap.event.addlistener(ruler1, "end", function(e) {
ruler1.turnoff();
});
var smarker = {
icon: new amap.icon({
size: new amap.size(19, 31), //图标大小
image: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b1.png"
})
};
var emarker = {
icon: new amap.icon({
size: new amap.size(19, 31), //图标大小
image: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b2.png"
}),
offset: new amap.pixel(-9, -31)
};
var loptions = {
strokestyle: "solid",
strokecolor: "#ff33ff",
strokeopacity: 1,
strokeweight: 2
};
var ruleroptions = { startmarkeroptions: smarker, endmarkeroptions: emarker, lineoptions: loptions };
ruler2 = new amap.rangingtool(map, ruleroptions);
});
//启用自定义样式测距
ruler1.turnoff();
ruler2.turnon();
})
}