使用百度地图API按照分类扎不同颜色的点

最近接手一个任务，要求对不同分类的元素以不同的颜色呈现在地图上。

一开始思考通过热力图的形式。

通过设置MAX和 区间颜色来进行。

				 heatmapOverlay = new BMapLib.HeatmapOverlay({"radius": 5, "opacity": 0});
                    map.addOverlay(heatmapOverlay);
                    heatmapOverlay.setDataSet({data: points, max: 2});
                  
                    heatmapOverlay.setOptions({
                        "gradient": {
                            0:"rgb(255,0,0,)"
			                1: "rgb(0,128,0)"
                        }
                    });
					  heatmapOverlay.show();

但通过上述方式，当进行缩放时，颜色也随之变化；方案不可取；

第二种，通过marker方式：

var redIcon = new BMap.Icon("img/marker_red_sprite.png",new BMap.Size(25,10));
	   var greenIcon = new BMap.Icon("img/marker_green_sprite.png",new BMap.Size(25,10));
	   var yellowIcon = new BMap.Icon("img/marker_yellow_sprite.png",new BMap.Size(25,10));
	   var qingluIcon = new BMap.Icon("img/marker_qinglu_sprite.png",new BMap.Size(25,10));
	   var goldIcon = new BMap.Icon("img/marker_gold_sprite.png",new BMap.Size(25,10));
	   var ziIcon = new BMap.Icon("img/marker_zi_sprite.png",new BMap.Size(25,10));
       var points = datapoints;
                var map = new BMap.Map("container");          // 创建地图实例
				map.centerAndZoom('大连市', 12);
                var point = map.getCenter();
                map.centerAndZoom(point, 12);
                map.enableScrollWheelZoom(); // 允许滚轮缩放
                var points = points;
                if(points.length == 0 ){
                    return ;
                }
				for(var i = 0;i< points.length;i++){
					var point = new BMap.Point(points[i].lng, points[i].lat);
					var marker;
					 switch(points[i].count){
						case 1:
							marker = new BMap.Marker(point,{'icon':redIcon});
							break;
						case 2:
							marker = new BMap.Marker(point,{'icon':greenIcon});
							break;
						case 3:
							marker = new BMap.Marker(point,{'icon':yellowIcon});
							break;
						case 4:
							marker = new BMap.Marker(point,{'icon':qingluIcon});
							break;
						case 5:
							marker = new BMap.Marker(point,{'icon':goldIcon});
							break;		
						case 6:
							marker = new BMap.Marker(point,{'icon':ziIcon});
							break;							
					}
					//var marker = new BMap.Marker(point);
					map.addOverlay(marker);

可以实现，当时当数据超过2000时，加载时间过长。体验不好；放弃

第三种，通过PointCollection

		var points1 = [],points2 = [],points3 = [],points4 = [],points5 = [],points6 = [];  // 添加海量点数据
				for (var i = 0; i < points.length; i++) {
					switch(points[i].count){
						case 1:
						points1.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
						case 2:
						points2.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
						case 3:
						points3.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
						case 4:
						points4.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
						case 5:
						points5.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
						case 6:
						points6.push(new BMap.Point(points[i].lng, points[i].lat));
						break;						
					}
					
				}
				var options = {
					size: BMAP_POINT_SIZE_SMALL,
					shape: BMAP_POINT_SHAPE_RHOMBUS,
					
				}
				
				switch(type){
					case 1:
					   addCollection(map,points1,options,'#ED2D2D');
					   break;
					case 2:
					   addCollection(map,points2,options,'#FFC80C');
					   break;   
				    case 3:
					   addCollection(map,points3,options,'#22B110');
					   break;
					case 4:
					   addCollection(map,points4,options,'#00A2E8');
					   break;
					case 5:
					   addCollection(map,points5,options,'#FFF200');
					   break;
					case 6:
					   addCollection(map,points6,options,'#A349A4');
					   break;
					default:
					   addCollection(map,points1,options,'#ED2D2D');
				       addCollection(map,points2,options,'#FFC80C');
				       addCollection(map,points3,options,'#22B110');
				       addCollection(map,points4,options,'#00A2E8');
				       addCollection(map,points5,options,'FFF200');
				       addCollection(map,points6,options,'#A349A4');
						break;
				}
				

    });
	function addCollection(map,points,options,color){
		options.color =color;
		if(points.length >0){
		var pointCollection = new BMap.PointCollection(points, options);  // 初始化PointCollection
		map.addOverlay(pointCollection);  // 添加Overlay
		}
	}

可以实现目标，不过这个图片行政目前不支持水滴样式。需要注意。