html 灯泡 菜鸟,cainiaoyizhan.html

本文介绍了一个使用百度地图API的应用实例,演示了如何通过JavaScript实现地点搜索、自动填充地址及地图定位等功能。代码中详细展示了如何设置地图中心点、监听地址变更及确认选择的地址。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

body, html {

width: 100%;

height: 100%;

margin: 0;

font-family: "微软雅黑";

font-size: 14px;

}

#l-map {

height: 300px;

width: 100%;

}

#r-result {

width: 100%;

}

关键字输入提示词条
请输入:

function G(id) {

return document.getElementById(id);

}

var map = new BMap.Map("l-map");

map.centerAndZoom("成都", 12);

var ac = new BMap.Autocomplete(

{

"input": "suggestId"

, "location": map

});

ac.addEventListener("onhighlight", function (e) {

var str = "";

var _value = e.fromitem.value;

var value = "";

if (e.fromitem.index > -1) {

value = _value.province + _value.city + _value.district + _value.street + _value.business;

}

str = "FromItem
index = " + e.fromitem.index + "
value = " + value;

value = "";

if (e.toitem.index > -1) {

_value = e.toitem.value;

value = _value.province + _value.city + _value.district + _value.street + _value.business;

}

str += "
ToItem
index = " + e.toitem.index + "
value = " + value;

G("searchResultPanel").innerHTML = str;

});

var myValue;

ac.addEventListener("onconfirm", function (e) {

var _value = e.item.value;

myValue = _value.province + _value.city + _value.district + _value.street + _value.business;

G("searchResultPanel").innerHTML = "onconfirm
index = " + e.item.index + "
myValue = " + myValue;

setPlace();

});

function setPlace() {

map.clearOverlays();

function myFun() {

var pp = local.getResults().getPoi(0).point;

map.centerAndZoom(pp, 18);

map.addOverlay(new BMap.Marker(pp));

}

var local = new BMap.LocalSearch(map, {

onSearchComplete: myFun

});

local.search(myValue);

}

一键复制

编辑

Web IDE

原始数据

按行查看

历史

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值