operlayer3.5 实现聚合，最大比例尺下，单个显示的例子

先上效果图，这个是我用高德地图做的聚合效果，因客户需要，做离线地图，这里用openlayer 做。

用openlayer 3.5 写与高德地图效果一样的功能。

我用openlayer 中也是遇到很多坑，很多百度也查不到，所以我在这里分享一下。

第一步，先让地图加载出来 

<div id="mapContainer" style="height:96.5%;"></div>    

        var overlayGroup = new ol.layer.Group({
            title: 'Overlays',
            layers: [
            ]
        });

        var projection = ol.proj.get('EPSG:4326');
        var resolutions = [0.703125, 0.3515625, 0.17578125, 0.087890625, 0.0439453125, 0.02197265625, 0.010986328125, 0.0054931640625, 0.00274658203125, 0.001373291015625, 6.866455078125E-4, 3.4332275390625E-4, 1.71661376953125E-4, 8.58306884765625E-5, 4.291534423828125E-5, 2.1457672119140625E-5, 1.0728836059570312E-5, 5.364418029785156E-6, 2.682209014892578E-6, 1.341104507446289E-6, 6.705522537231445E-7, 3.3527612686157227E-7];
        var gridNames = ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10', 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18', 'EPSG:4326:19', 'EPSG:4326:20', 'EPSG:4326:21'];

        var projection3857 = ol.proj.get('EPSG:900913');
        var projectionExtent = projection3857.getExtent();
        var size = ol.extent.getWidth(projectionExtent) / 256;
        var resolutions3857 = new Array(18);
        var matrixIds = new Array(18);
        for (var z = 1; z < 19; ++z) {
            // generate resolutions and matrixIds arrays for this WMTS
            resolutions3857[z] = size / Math.pow(2, z);
            matrixIds[z] = 'EPSG:900913:'+z;
        }
        var resolutions900913 = new Array(18);
        var matrixIds900913 = new Array(18);

        for (var z = 1; z < 19; ++z) {
            // generate resolutions and matrixIds arrays for this WMTS
            resolutions900913[z] = size / Math.pow(2, z);
            matrixIds900913[z] = 'EPSG:900913:'+z;
        }
        
        var mapUrl = getCenter().offlineMapAddr;

   
        /* 初始化地图 */
        var map = new ol.Map({
            target: 'mapContainer',
            controls: ol.control.defaults({
                attribution:true,
                rotate:true,
                zoomOptions:false,
                zoom:false,
                attributionOptions: ({ collapsible: false }),              
                }),
                layers: [           
                    new ol.layer.Group({
                          title: '电子地图',
                          type: 'base',
                          layers: [
                             new ol.layer.Tile({
                             title: 'OSM',
                             source: new ol.source.WMTS({
                                    //服务地址
                                    url: mapUrl,    
                &n