百度地图JSSDK使用小实例
代码示例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script src="http://api.map.baidu.com/getscript?v=1.4&ak=&services=&t=20150522093217"></script>
<script src="http://ditu.google.cn/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false&_=20150522093217"></script>
<title>百度地图API使用示例</title>
<style>
#mapContainer{
height:600px;
width:600px;
border:1px solid #eee;
}
div.top{
margin-bottom:10px;
}
#btn{
border:0px;
background-color:66B3FF;
height:30px;
color:#FFF;
}
</style>
</head>
<body>
<div class="top">
<span>输入地点：</span><input type="text" id="keyword" />
<button onclick="searchAddress()" id="btn">搜索地址</button>
</div>
<div id="mapContainer">
</div>
</body>
<script>
var map;//百度地图实例
var local;
//创建经纬度方法
function createpoint(lon,lat){
return new BMap.Point(lon,lat);
};
function initMap(dom,point){
map = new BMap.Map(dom);
map.centerAndZoom(point,15);
map.enableScrollWheelZoom();
local = new BMap.LocalSearch(map,{renderOptions:{map: map}});
}
function searchAddress(){
var keyAddress = $("#keyword").val();
local.search(keyAddress);
}
$(function(){
var point = createpoint(116.404,39.915);
initMap("mapContainer",point); });
</script>
</html>
官方参考文档： http://lbsyun.baidu.com/index.php?title=jspopular
百度地图JSSDK使用小实例的更多相关文章
- 解决Vue引入百度地图JSSDK：BMap is undefined 问题
百度地图官网文档介绍使用JSSDK时,仅提供了2种引入方式: script引入 异步加载 解决跨域问题,实例调用百度地图 但vue项目中仅某一两个页面需要用到百度地图,所以不想在 index.html ...
- 百度地图Api进阶教程-实例高级操作8.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 百度地图和echarts结合实例
1.由echart对象(bmapChart)获取百度地图对象(bdMap),echart对象(bmapChart)适用于所有的echart的操作和接口,百度地图对象(bdMap)适用于百度地图的所有接 ...
- 百度地图API 级别自动缩放
今天做一个基于百度地图API的小项目 查了很长时间apid都没有找到地图呈现出来的时候地图按坐标的多少自动缩放显示的等级比例,特此记录笔记!var points = [point1, point2,p ...
- 百度地图 JavaScript API
最近有点懒 项目结尾了 完了好长时间 没有去总结项目中的问题 想了下还是写写吧 这是一个关于百度地图的 网页展示 <!DOCTYPE html><html><head ...
- HTML5 调用百度地图API地理定位
<!DOCTYPE html> <html> <title>HTML5 HTML5 调用百度地图API地理定位实例</title> <head&g ...
- JavaScript动态加载script方式引用百度地图API，Uncaught ReferenceError: BMap is not defined
百度地图官网文档介绍使用JSSDK时,仅提供了2种引入方式: script引入 异步加载 实际工作场景中仅某一两个页面或者只是单纯有功能需要用到百度地图,所以没有必要在 index.html 中全局引 ...
- 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 [源码下载]
相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修正版[ZMap.js] 实例源码! ZMap.js 本类方法功能大多使用 ...
- 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例
百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修 ...
随机推荐
- 51nod 1101 换零钱 （完全背包）
N元钱换为零钱,有多少不同的换法?币值包括1 2 5分,1 2 5角,1 2 5 10 20 50 100元. 例如:5分钱换为零钱,有以下4种换法: 1.5个1分 2.1个2分3个1分 3.2个2分 ...
- 【2.0】SpringBoot连接MySql 8.0的url设置
jdbc:mysql://localhost:3306/enterprise?useUnicode=true&&useSSL=false&&characte ...
- 如何在基于Bytom开发过程中集成IPFS
本文介绍了基于Bytom开发过程中集成IPFS. step1: 搭建bytom节点 比原相关资料:https://github.com/Bytom-Community/Bytom_Docs 搭建byt ...
- GPU并行的基础知识
- E: Unable to locate package git
git can’t install 报错信息: root@281eef85bb5d:~# apt-get install git Reading package lists... Done Build ...
- windows上使用foremost
做CTF题需要这工具来提取文件里的隐藏文件, 网上大部分是linux版本,之前好不容易找了一个exe文件结果还不能用.找了很长时间终于找到了: https://github.com/raddyfiy/ ...
- 放大镜js实现效果
今天我想写一个放大镜因为毕竟在做网页的时候,特别是一些电商的详情页放大镜是必不可少的.什么都不说了上代码 1,html代码 <div id='small'><img src=&quo ...
- synchronized同步方法《二》
1.synchronized方法和锁对象 (1).验证线程锁的是对象 代码如下: 1.1创建一个MyObject类: package edu.ymm.about_thread4; public cla ...
- 一个二维码如何自动识别是安卓（Android）还是苹果(IOS)
思考问题: 通常,我们开发一个APP,有Android版本.IOS版本. 但是只有一个二维码?怎么办呢? 怎么让IOS用户扫描二维码下载IOS版本,Android用户扫描二维码下载到Android版本 ...
- Java中如何设置表格处于不可编辑状态
代码片段如下: 这样的话就可以将表格设置为不可编辑状态