百度地图三维效果实现

之前用百度地图都是用的二维地图,现在发现百度地图支持三维效果,欲实现三维效果只需添加如下两句代码即可:

    map.setMapType(BMAP_PERSPECTIVE_MAP);     //修改地图类型为3D地图
    map.setCurrentCity("北京市");  //设置当前城市

,整体代码如下:

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
		body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
		#allmap{width:100%;height:500px;}
		#r-result{width:100%;margin-top:5px;}
		p{margin:5px; font-size:14px;}
	</style>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=5qnG3inG4VhPZOcjNwj4ycZN"></script>
	<title>百度三维地图</title>
</head>
<body>
	<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	var point = new BMap.Point(116.404, 39.915);
	map.centerAndZoom( point,18);

	// 将标注添加到地图中
	//marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
	//marker.enableDragging();
	map.setMapType(BMAP_PERSPECTIVE_MAP);     //修改地图类型为3D地图
    map.setCurrentCity("北京市");  //设置当前城市
</script>

时间: 2024-11-03 11:25:29

百度地图三维效果实现的相关文章

你可能用到的百度地图效果

这段时间需要实现百度地图的一些展示效果,虽然最终效果做出来了,可是这中间也走了很多的弯路,希望有用到的可以直接拿来用,少走一些弯路.百度地图为开发者提供了一系列的接口,点百度接口去百度接口.本文主要用到了以下几个效果: 1.热力图显示 2.自定义图标的聚合显示 3.云麻点显示 热力图显示 百度地图热力图是通过设置热力图半径.颜色.透明度等参数直观展示数据分布情况,而我这段时间所做的,就是通过一段时间内的订单数量,再结合经纬度,在地图上显示热力分布图.百度地图官方的API给的示例很Easy,创建地

百度地图~保留地图的定位效果,但是下面的地图不需要保留!

问题描述 百度地图~保留地图的定位效果,但是下面的地图不需要保留! 怎么隐藏百度地图的地图 ,定位效果还是要的.求大牛指点! 保留地图的定位效果,但是下面的地图不需要保留! 解决方案 什么意思?是只要定位好的地图,不能拖拽[放大]别的?有属性,不可方法,,不可拖拽啊... 解决方案二: 只留BMap.Marker?地图里面的图片全部隐藏起来?..那你还用百度地图干嘛,图片隐藏起来了.还不如直接写个浮动层就行了

你可能用到的百度地图效果(附源码)

原文:你可能用到的百度地图效果(附源码)      这段时间需要实现百度地图的一些展示效果,虽然最终效果做出来了,可是这中间也走了很多的弯路,希望有用到的可以直接拿来用,少走一些弯路.百度地图为开发者提供了一系列的接口,点百度接口去百度接口.本文主要用到了以下几个效果: 1.热力图显示 2.自定义图标的聚合显示 3.云麻点显示       热力图显示       百度地图热力图是通过设置热力图半径.颜色.透明度等参数直观展示数据分布情况,而我这段时间所做的,就是通过一段时间内的订单数量,再结合经

android-google地图或者百度地图,详情拖动的效果

问题描述 google地图或者百度地图,详情拖动的效果 有谁有类似google地图详情拖动出来的效果或者百度地图详情拖动出来的效果吗?Meterial design效果版的喔,有哪位大神知道吗

基于OL2实现百度地图ABCD marker的效果_javascript技巧

本文概述: 上文中提到了在Arcgis for JS中实现百度地图ABCD的marker效果,在本文,讲述如何在OpenLayers2中实现类似的效果. 效果图展示如下: 为直观期间,先将效果贴出来. 联动展示 思路: 1.列表与地图的互动 鼠标经过列表时,修改列表图标,并根据列表返回的值在地图上绘蓝色的marker:鼠标移出,修改列表图标为红色,清空地图marker图层. 关键代码: title.on("mouseover",function(){ var i = $(this).a

js实现百度地图同时显示多个路书效果_JSP编程

本文介绍了js实现百度地图同时显示多个路书效果,主要是以自行车的还车地点作为实例,具体代码如下: 启动路书: <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=自己的ak"></script> <script type="text/javascript" src="js/lushu.js"&g

基于Arcgis for javascript实现百度地图ABCD marker的效果_javascript技巧

先给大家展示实现后效果: 为直观期间,先贴出来我做的效果 列表展示和地图展示以及联动 显示信息 实现思路: 1.列表与地图的互动 鼠标经过列表时,修改列表图标,并根据列表返回的值在地图上绘蓝色的marker:鼠标移出,修改列表图标为红色,清空地图marker图层. 关键代码: title.on("mouseover",function(){ var attr = $(this).data("attr"); $("#icon"+attr.id).c

ArcGIS JS 学习笔记1 用ArcGIS JS 实现仿百度地图的距离量测和面积量测

原文:ArcGIS JS 学习笔记1 用ArcGIS JS 实现仿百度地图的距离量测和面积量测 一.开篇      在博客注册了三年,今天才决定写第一篇博客,警告自己不要懒!!! 二.关于ArcGIS JS 版本选择      在写这篇博客时ArcGIS JS 4.0正式版已经发布.它和3.x版本的不同是,Map不在是一个控件,而真的只是一张"图",Map(4.0版本)需要在一个View里面来展示,在MapView里面就是一张平面图,在SceneView里面就一张三维地图.同一张地图在

【百度地图API】百度API卫星图使用方法和卫星图对比工具

原文:[百度地图API]百度API卫星图使用方法和卫星图对比工具 百度地图API推出卫星图接口也有一个月啦~   本文除了介绍如何使用百度地图API来操作卫星图外,还顺带制作了个卫星图对比工具.   一.百度地图API卫星图 调用百度卫星图有两种方式,一是地图类型控件,一是地图底图设置.下面分别介绍这两种方法:   1.利用控件 使用控件有一大优势,就是地图类型控件上,有百度全部的地图类型,比如二维.三维.卫星等. 而且,只需要一句话,就能简单加上这个控件. map.addControl(new