`

百度地图

    博客分类:
  • web
 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>百度地图</title>
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
</head>

<body>
<div id="container"></div>
<script type="text/javascript">
localSearch();
//deploySearch();
//rimSearch();
//boundsSearch();
//busLine();
//drivingLine();

//根据关键这搜索区域
function localSearch(){
var map = new BMap.Map("container"); // 创建地图实例
map.addControl(new BMap.NavigationControl());//地图控制插件,该插件可以控制地图的位置地图的显示比例
map.addControl(new BMap.ScaleControl());//显示在地图下方,告诉你地图上1cm对应的真实距离
//map.addControl(new BMap.OverviewMapControl());
map.addControl(new BMap.MapTypeControl());//地图的显示类型:包括地图和卫星
//确定搜索对象
var local=new BMap.LocalSearch(map,{
renderOptions:{map:map}
});
//根据关键字定义到相应的区域
local.search("南京");
}

//搜索北京市里的中关村,只显示8个结果
function deploySearch(){
var map=new BMap.Map("container");
map.addControl(new BMap.NavigationControl());
var local=new BMap.LocalSearch("北京市",{
renderOptions:{
map:map,
autoViewport:true,
selectFirstResult:true
},
pageCapacity:8
});
local.search("中关村");
}

//在南京玄武湖附近搜索小吃
function rimSearch(){
var map = new BMap.Map("container"); 
var point = new BMap.Point(118.783557,32.053502); // 创建点坐标
map.centerAndZoom(point,15); // 初始化地图,设置初始点为南京
map.addControl(new BMap.NavigationControl()); 
var local = new BMap.LocalSearch(map, { 
renderOptions:{map: map, autoViewport: true} 
}); 
local.searchNearby("小吃", "玄武湖"); 
}

//当前地图视野范围内搜索银行
function boundsSearch(){
var map = new BMap.Map("container"); 
//地点为北京
map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); 
map.addControl(new BMap.NavigationControl());
var local = new BMap.LocalSearch(map, { 
renderOptions:{map: map} 
}); 
//搜索地图视野内的银行
local.searchInBounds("银行", map.getBounds()); 
}

//公交导航的区域范围只能是市,下面是南京市天隆寺到玄武湖的公交路线
function busLine(){
var map = new BMap.Map("container"); 
//地点为南京
map.centerAndZoom(new BMap.Point(118.783557,32.053502), 14); 
map.addControl(new BMap.NavigationControl());
var transit = new BMap.TransitRoute(map, { 
renderOptions: {map: map} 
}); 
transit.search("天隆寺", "玄武湖"); 
}

//南京从天隆寺到玄武湖驾车路线
function drivingLine(){
var map = new BMap.Map("container"); 
//地点为南京
map.centerAndZoom(new BMap.Point(118.783557,32.053502), 14); 
map.addControl(new BMap.NavigationControl());
var driving = new BMap.DrivingRoute(map, { 
renderOptions: { 
map: map, 
autoViewport: true 
} 
}); 
driving.search("天隆寺", "玄武湖");
}
</script>
</body>
</html>
分享到:
评论

相关推荐

    leaflet加载百度地图

    然而,由于百度地图使用的是自己的坐标系统(BD-09),与常见的WGS84坐标系不同,所以在使用Leaflet时直接加载百度地图会遇到兼容性问题。本教程将详细讲解如何通过Leaflet成功加载并显示百度地图。 首先,我们需要...

    BaiduMap.zip_baiduMap_地图 附近_百度地图_百度地图 路线_路线

    在本项目中,我们主要关注的是“BaiduMap.zip”这个压缩包,它包含了与百度地图相关的功能,如地图查询、附近的地点搜索、路径规划以及经纬度转换。下面将详细阐述这些功能及其在实际应用中的重要性。 首先,我们要...

    百度地图H5地图选址

    【百度地图H5地图选址】是一项利用JavaScript和jQuery技术在H5页面中实现类似饿了么地址选择的功能。这项技术可以让用户在网页上方便地进行地理位置的筛选和选择,为在线服务提供更精确的配送或服务范围设定。下面将...

    cesium加载百度地图

    要将百度地图与Cesium结合,我们主要需要处理两个关键步骤:获取百度地图的瓦片服务URL和在Cesium中添加这个自定义的地图源。 百度地图提供了瓦片服务API,我们可以根据API的规则构建瓦片请求URL。通常,这些URL会...

    百度地图+echarts地图扩展

    "百度地图+echarts地图扩展"是一个将百度地图与ECharts图表库相结合的解决方案,它提供了丰富的地图绘制和交互功能,适用于各种业务场景,如城市规划、交通分析、商业选址等。下面我们将深入探讨这个主题。 首先,...

    百度地图街获取

    【标题】:“百度地图街景获取” 在当前的数字化时代,地图已经成为我们日常生活和工作中不可或缺的工具,尤其是在城市导航和位置服务中。其中,百度地图作为国内领先的在线地图服务平台,提供了丰富的地图数据和...

    openlayers 调用百度地图

    在OpenLayers中调用百度地图是一项常见的需求,特别是在构建Web GIS应用时,用户可能希望结合OpenLayers的强大功能和百度地图的丰富数据。OpenLayers是一个开源JavaScript库,用于创建交互式的地图应用,而百度地图...

    ArcGIS 加载百度地图算法

    在本教程中,我们将探讨如何在ArcGIS中加载百度地图算法,以便利用百度地图的数据和功能增强ArcGIS的性能。这个过程涉及到几个关键的技术点,包括地图投影、数据接口和API调用。 首先,我们需要了解地图投影的概念...

    百度地图瓦片下载无水印

    "百度地图瓦片下载无水印"是指一种工具或技术,能够从百度地图服务中获取地图图像,并且这些图像不包含百度地图通常显示的版权水印。这意味着用户可以更自由地使用这些地图数据,例如在制作自定义地图、GIS应用或者...

    cesium接入百度地图.rar

    百度地图API是一组面向开发者的工具,允许开发者在自己的网站或应用中嵌入百度地图服务,如地图展示、定位、路线规划等。它提供了JavaScript API、RESTful服务等多种接口,方便开发者调用地图服务。 3. **接入步骤...

    VC MFC调用百度地图API

    而调用百度地图API,可以让我们的应用与百度地图服务进行交互,实现如定位、地图显示、路线规划等功能。本篇文章将深入探讨如何在MFC项目中集成并使用百度地图API。 首先,了解百度地图API的基本概念是至关重要的。...

    最新百度地图离线API

    标题:“最新百度地图离线API” 百度地图离线API是开发者们在无网络环境下,仍能实现地图展示、定位、路径规划等功能的重要工具。这个“最新百度地图离线API”提供了一套完整的解决方案,使开发者能够在本地环境中...

    c# 调用百度地图API

    将百度地图嵌入c# cs窗体中,cs后台控制百度地图: 1)用WebBrower控件加载本地的一个html文件,在html中实现加载百度地图 2)动态添加覆盖物 3)动态添加标签 4)动态添加点击小气球提示 5)经纬度提取详细地址 查...

    c# 调用百度地图API 代码示例

    将百度地图嵌入c# cs窗体中,cs后台控制百度地图: 1)用WebBrower控件加载本地的一个html文件,在html中实现加载百度地图 2)动态添加覆盖物 3)动态添加标签 4)动态添加点击小气球提示 5)经纬度提取详细地址 查...

    百度地图生成器

    【百度地图生成器】是一种工具,专为SEO(搜索引擎优化)设计,它的主要功能是帮助网站管理员生成适用于百度搜索引擎的地图。这种地图,通常被称为站点地图(Sitemap),是一种XML文件,列出了网站上的所有重要页面...

    vue用BMap百度地图实现即时搜索功能

    在这个过程中,我们首先需要理解百度地图API的使用,以及如何在Vue项目中集成BMap百度地图API来实现即时搜索功能。以下是详细知识点: 1. 百度地图API的申请和使用 要使用百度地图的即时搜索功能,开发者需要先在...

    leaflet加载百度地图底图

    在本文中,我们将深入探讨如何将百度地图底图与Leaflet JavaScript库进行融合,以便在Web应用程序中创建交互式地图。Leaflet是一个轻量级、高性能的开源JavaScript库,广泛用于构建地图应用。而百度地图是中国领先的...

    老罗android 百度地图开发源码

    在Android开发中,百度地图API是一个非常常用的工具,它提供了丰富的地图展示、定位、路径规划等功能,极大地便利了开发者在构建地理位置相关应用时的工作。"老罗android 百度地图开发源码"是一个示例项目,它展示了...

    WinForm与百度地图交互

    在本文中,我们将深入探讨如何在Windows Forms(WinForm)应用程序中集成百度地图,并实现单点定位、多点定位以及线路规划等高级功能。WinForm是.NET Framework中的一个用户界面框架,它允许开发者创建桌面应用。而...

Global site tag (gtag.js) - Google Analytics