<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>百度地图</title>
<script type="text/javascript">
function initialize() {
//---------------------------------------------基础示例---------------------------------------------
var map = new BMap.Map("allmap",{minZoom:12,maxZoom:20}); // 创建Map实例
//map.centerAndZoom(new BMap.Point(116.4035,39.915),15); //初始化时，即可设置中心点和地图缩放级别。
map.centerAndZoom("成都",13); // 初始化地图,设置中心点坐标和地图级别。
map.enableScrollWheelZoom(true);//鼠标滑动轮子可以滚动
map.addEventListener("click", function(e){
document.getElementById("r-result").innerHTML = e.point.lng + ", " + e.point.lat;
});
//---------------------------------------------遮盖物---------------------------------------------
var point = new BMap.Point(104.117287, 30.685906);//默认
// 创建标注对象并添加到地图
var marker = new BMap.Marker(point);
map.addOverlay(marker);
var point = new BMap.Point(104.057287, 30.685906);//图片
var myIcon = new BMap.Icon("http://t3.baidu.com/it/u=1119318591,884730191&fm=0&gp=0.jpg", new BMap.Size(55, 55));
// 创建标注对象并添加到地图
var marker = new BMap.Marker(point, {icon: myIcon});
map.addOverlay(marker);
//自定义遮盖物
// 定义自定义覆盖物的构造函数
var point = new BMap.Point(104.117287, 30.695906);//自定义遮盖物
function SquareOverlay(point, length, color){
this._point = point;
this._length = length;
this._color = color;
}
// 继承API的BMap.Overlay
SquareOverlay.prototype = new BMap.Overlay();
// 实现初始化方法
SquareOverlay.prototype.initialize = function(map){
// 保存map对象实例
this._map = map;
// 创建div元素，作为自定义覆盖物的容器
var div = document.createElement("div");
div.style.position = "absolute";
// 可以根据参数设置元素外观
div.style.width = this._length + "px";
div.style.height = this._length + "px";
div.style.background = this._color;
// 将div添加到覆盖物容器中
map.getPanes().markerPane.appendChild(div);
// 保存div实例
this._div = div;
// 需要将div元素作为方法的返回值，当调用该覆盖物的show、
// hide方法，或者对覆盖物进行移除时，API都将操作此元素。
return div;
}
// 实现绘制方法 （您需要在draw方法中设置覆盖物的位置，每当地图状态发生变化（比如：位置移动、级别变化）时，API都会调用覆盖物的draw方法，用于重新计算覆盖物的位置）
SquareOverlay.prototype.draw = function(){
var position = map.pointToOverlayPixel(this._point);
this._div.style.left = position.x - this._length / 2 + "px";
this._div.style.top = position.y - this._length / 2 + "px";
}
// 实现显示方法
SquareOverlay.prototype.show = function(){
if (this._div){
this._div.style.display = "";
}
}
// 实现隐藏方法
SquareOverlay.prototype.hide = function(){
if (this._div){
this._div.style.display = "none";
}
}
// 添加自定义覆盖物
var mySquare = new SquareOverlay(point, 22, "red");
map.addOverlay(mySquare);
}
function loadScript() {
var script = document.createElement("script");
script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</head>
<body>
<div id="r-result" style="float:left;width:100px;">打印坐标</div>
<div id="allmap" style="width: 800px; height: 500px"></div>
</body>
</html>
<script type="text/javascript">
// 移动到某点 map.panTo(new BMap.Point(116.409, 39.918));
// map.setZoom(14); //放到到14级
</script>
分享到：
相关推荐
- **自定义组件**：通过继承API提供的基类，创建自定义的地图组件和控件。 - **服务端集成**：与ArcGIS Server或其他GIS服务端平台的深度集成。 总之，ArcGIS API for Flex 2.0是一个强大的GIS开发工具，它将Flex的...
《百度地图API开发指南》的PDF和PPT文件提供了详细的教程和示例，涵盖了从入门到进阶的所有知识点，对于想要涉足地图开发的程序员来说，是一份不可多得的参考资料。通过学习和实践，开发者可以轻松地将百度地图API...
这包括获取API密钥，添加地图权限，展示地图，以及如何实现定位、添加标注、绘制路线等功能。通过实战，开发者可以深入理解Android与第三方服务的集成技巧，增强实际开发能力。 4. HTTP协议编程： Android应用常常...
4. **覆盖物（Overlay）**：覆盖物是百度地图API中的一个重要概念，它允许开发者在地图上添加自定义的图标、标注或者动态效果，比如轨迹绘制、气泡提示等。相关教程详细介绍了如何创建和管理覆盖物。 5. **查询地址...
在Android开发中，集成...总的来说，这个项目涵盖了百度地图API的基本使用和进阶特性，对于初学者来说，是一个很好的实践案例。通过深入理解和实践，开发者可以掌握如何在Android应用中有效地集成和利用百度地图服务。
- **自定义样式**: 可以自定义地图的样式和外观，比如改变背景色或标注字体。 - **功能增强**: 增加搜索功能、路径规划等高级特性。 **3. 性能优化** - **减少请求**: 合理设计数据结构和加载策略，减少不必要的...
这个压缩包旨在为开发者提供关于如何在微信小程序中集成和利用百度地图服务的实践教程。下面我们将详细探讨这些知识点。 1. **小程序开发**： 微信小程序是一种轻量级的应用开发平台，它允许开发者在微信内创建...
1. **地图显示**：API允许开发者在应用中加载和展示百度地图，包括自定义地图样式、缩放、平移、旋转等操作。 2. **定位服务**：提供了获取设备当前位置的能力，包括GPS定位和网络定位，支持实时定位追踪。 3. **...
matplotlib是一个在Python编程环境中广泛使用的数据可视化库，它提供了一整套与MATLAB类似的API，使得用户能够轻松地创建各种高质量的图表，包括线图、散点图、条形图、直方图以及复杂的3D图形等。这个资源是...
百度地图Demo就是一个包含了基础和进阶功能的实例，帮助开发者快速上手并理解如何在自己的应用中集成百度地图服务。 1. **注册与获取API密钥** 在使用百度地图API之前，我们需要在百度地图开放平台注册一个账号，...
MapBar电子地图服务不仅提供了基础的地图展示，还支持自定义标注、地理编码、反地理编码、覆盖物叠加等多种高级功能，广泛应用于交通导航、生活服务、旅游出行等领域。 在给定的压缩包文件中，有两个关键文件： 1....
提供的`arcgis-runtime-sdk-android-guide-10.2.9.pdf`详细指导了如何使用ArcGIS Android API进行开发，包括基础功能的实现、示例代码、最佳实践等内容，是开发者入门和进阶的重要参考资料。 总的来说，ArcGIS ...
ArcGIS API for JavaScript是基于JavaScript语言的，它允许开发者在网页上创建交互式地图，包括添加图层、标注、地理编码、地理分析和空间查询等功能。V3.9版本主要关注性能优化和新特性的引入，比如3D地图支持、...
3. MBD API：对于需要进行三维几何公差标注和制造信息处理的项目，MBD API提供了丰富的接口，使得开发者能够创建符合GD&T（Geometric Dimensioning and Tolerancing）标准的模型。 4. 自定义插件开发：通过学习和...
Spring-data-jpa 是 Spring 家族中的一个重要成员，它主要用于简化基于 Java Persistence API (JPA) 的数据访问层（DAO）的开发工作。JPA 作为 Java 平台的一种标准，旨在为 Java 应用程序提供一种通用的对象关系...
Google Map API 是Google为全球开发者提供的一个强大工具，允许他们利用Google Maps的功能创建自定义的地图应用。这个API涵盖了从基础的地图展示到复杂的地理位置服务，如路线规划、地理编码、本地搜索等功能，极大...
这个API允许开发者通过编程方式访问和操作MapABC的地图数据，进而创建各种基于地理位置的应用和服务。 一、MapABC API基础 MapABC API的核心功能包括地图显示、地理编码、路线规划、位置标记等。它为开发者提供了...
3. **API接口**：库提供了简洁的API接口，使得开发者可以轻松地将事件提取集成到自己的应用中。例如，可以通过调用`extract_events()`函数来提取文本中的事件。 4. **自定义配置**：用户可以根据实际需求调整模型...