在require.js中加载百度地图

1.先导入百度地图的API

.

百度地图不支持amd模式加载，使用require.js加载必须设置异步async插件进行加载，否则会出错 not found BMap（好像地图的导入都需要异步加载）

若在require.js中采用

<script src="百度地图的api路径"></script>

导入地图的api实习上在导入过程中会转变成

document.write(’<script src=“api的路径”></script>’);

在普通的HTML页面中是可以直接导入src就行了，不过在require.js中不能直接引入，我所了解的必须要设置异步加载才能正常加载百度地图的api

设置异步加载：

1).async是为了支持百度地图API的js文件可以异步访问，需手动导入async.js至目录vendor/requirejs下

2).需要在require.config中配置async和BMap的路径

3).在mapdemo.js中使用require.js模块化加载

define(['text!pages/mapdemo/mapdemo.html','jquery','async!BMap','uuitree','uuigrid'],function(html){
	//百度地图不支持amd模式加载，使用require.js加载必须设置异步async插件进行加载，否则会出错 not found BMap
    var init = function (element) {
    	
    	$(element).html(html);//对element元素页面显示	
    }

    return {
        'template': html,
        init: init
    }
});//end define

async!BMap是表示异步加载BMap的js

2.在页面中展示地图

在HTML文件中创建地图实例

<script >
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	// 创建Map实例
	var pointm = new BMap.Point(120.2193, 30.2592);

	map.centerAndZoom(pointm, 11);
	// 初始化地图,设置中心点坐标和地图级别
	//添加地图类型控件
	map.setCurrentCity("杭州");
	// 设置地图显示的城市 此项是必须设置的
	map.enableScrollWheelZoom(true);
	//开启鼠标滚轮缩放
	var marker = {};
	var content={};
	//var infoWindowlist = [];
	//var pointinfo = [];
	//var mklist = [];
	var data_info = [];//多点信息窗口的内容数组
	
	//var myIcon = new BMap.Icon("/name/static/yellow15.gif", new BMap.Size(15,15));//自定义标注最好大小在15~20像素
	//var marker2 = new BMap.Marker(pt,{icon:myIcon});  // 创建标注

	//获取最新五个病害信息（）
		$.ajax({
			type : "get",
			url : "/hzlq/map/info",
			contentType : 'application/json;charset=utf-8',
			dataType : 'json',
			success : function(res) {
				if (res) {
					//alert(res.xjdzzb + ":" + res.xjdhzb);
					//var xjdzzb = res.xjdzzb;//获取后台解析的纵坐标列表
					//var xjdhzb = res.xjdhzb;//获取后台解析的行坐标列表
					for (var i = 0; i <res.length; i++) {
						//alert("xjdzzb"+xjdzzb.length);
						var tempinfo = [];//单个信息窗口的信息内容
						tempinfo.push(res[i].xjdzzb, res[i].xjdhzb, ""+i+"AddressInfo:"+res[i].xjdzzb+","+res[i].xjdhzb);
						data_info.push(tempinfo);
						 marker = new BMap.Marker(new BMap.Point(data_info[i][0], data_info[i][1]));
						 //marker = new BMap.Marker(new BMap.Point(data_info[i][0], data_info[i][1]),{icon:myIcon}); 后面的{icon:myIcon}是自定义标注的对象
						// 创建标注
						//alert("生成了第"+i+"一个");
						 content = data_info[i][2];
						//alert("poin:"+data_info[i][0]+","+data_info[i][1]);
						map.addOverlay(marker);
						// 将标注添加到地图中
						//marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画

						addClickHandler(content, marker);
					}
				} else {
					alert("no");
				}
			}
		});
	

	

	var opts = {
		width : 250, // 信息窗口宽度
		height : 80, // 信息窗口高度
		title : "信息窗口", // 信息窗口标题
		enableMessage : true//设置允许信息窗发送短息
	};
	
	function addClickHandler(content, marker) {
		//alert("addClickHandler");
		marker.addEventListener("click", function(e) {
			openInfo(content, e);
		});
	}

	function openInfo(content, e) {
		//alert("openInfo");
		var p = e.target;
		var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
		var infoWindow = new BMap.InfoWindow(content, opts);
		// 创建信息窗口对象
		map.openInfoWindow(infoWindow, point);
		//开启信息窗口
	}

	

</script>

具体对地图的操作具体见百度地图官方的API，这里就不多赘述了。

差不多就这些，有不对的地方还请各位指正一哈，哈哈哈，刚入门的博客，糙得很！