等待是最痛苦的事，有时候真的很迷茫，这学上的怀疑人生，这辈子遇见对的人真的很关键，唉，废话不说了开车，开车
一、图层探查是一个功能型的小插件，当map加载多个图层的时候，有的图层被覆盖掉了，我们如果想看到图层就可以通过探查图层小插件，相当于将上面的图层裁剪一块。
二、实现思路主要的运用图层的事件（precompose: 准备渲染，未渲染。postrender: 渲染全部结束。）
三、图层代码
//天地图底图
var source =new ol.source.XYZ({
url: "http://t4.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}"
});
var tileLayer =new ol.layer.Tile({
title:"天地图",
source:source
});
//标注图层
var sourceMark = new ol.source.XYZ({ url: 'http://t3.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}' });
var tileMark = new ol.layer.Tile({
title:"标注图层",
source: sourceMark,
});
//卫星图像
var sourceSatellite = new ol.source.XYZ({ url: 'http://t3.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}' });
var tileSatellite = new ol.layer.Tile({
title: "卫星图",
source:sourceSatellite
});
map = new ol.Map({
layers: [
tileLayer,
tileMark,
tileSatellite
],
view: new ol.View({
zoom: 11,
center:ol.proj.transform( [116.40769, 39.89945], 'EPSG:4326', 'EPSG:3857')
}),
四、事件驱动（注意是给那个图层添加的事件，这里ttileLayer在最上层，tileSatellite被覆盖）
//图层探查
var radius = 75;//圆的半径
//通过keydown 事件实现在键盘上通过Up和Down按键改变圆的半径
$(document).keydown(function (evt) {
//按键事件无论，元素是否得到焦点都会被触发
if (evt.which==38) {
//指示按了那个键，或按钮，当按下Up键时半径扩大五个像素,最大半径150
radius = Math.min(radius + 5, 150);
map.render();//渲染地图
}
if (evt.which == 40) {
//指示按了那个键，或按钮，当按下Down键时半径减小五个像素，最小半径25
radius = Math.min(radius -5, 25);
map.render();//渲染地图（重新刷新的意思）
}
});
//在每次鼠标发生移动时获取当前像素的位置
var mousePosition = null;
//通过on方法为地图视图绑定mousemove与mouseout事件
$(map.getViewport()).on('mousemove', function (evt) {
//获取当前鼠标位置的像素
mousePosition = map.getEventPixel(evt.originalEvent);
map.render();
}).on('mouseout', function () {
mousePosition = null;//鼠标移走将该点的坐标清零
map.render();
});
//在影像图层绘制（渲染）前进行一部分裁剪
tileSatellite.on('precompose', function (event) {
var ctx = event.context;//影像图层画布
var pixelRatio = event.frameState.pixelRatio; //像素比
ctx.save();
ctx.beginPath();
if (mousePosition) {
// 只显示以鼠标当前位置为圆心的一个圆圈
ctx.arc(mousePosition[0] * pixelRatio, mousePosition[1] * pixelRatio,
radius * pixelRatio, 0, 2 * Math.PI); //设置画布区域为一个圆
ctx.lineWidth = 5 * pixelRatio; //圆边框的宽，设置为5个像素单位
ctx.strokeStyle = 'rgba(0,0,0,0.5)'; // 圆边框样式（颜色）
ctx.stroke();
}
ctx.clip();//裁剪画布
});
// 影像图层绘制后还原画布背景（ the canvas context）
tileSatellite.on('postcompose', function (event) {
var ctx = event.context;
ctx.restore();//还原画布
//postcompose：地图渲染中。
//precompose: 准备渲染，未渲染。
//postrender: 渲染全部结束。
})至于那个画布问题，看不懂的可以看看HTML5中的canvas特性标签
五、效果
六、总结，代码很少，也很简单，参考了郭明强的书，生命不息，学习不止