Appearance
第九章 拾取和选择
目录
第一节 单选
先来介绍下图层单选,图层单选就是图层的点击事件。首先,我们需要注册图层点击事件,我们使用“onLandmarkLayerClick”方法添加事件监听,任何图层只要开启了图层的单选,都可以在监听里识别到,这也是一个通用的方法。接下来,当我们添加完成某一图层之后,需要使用“pickOverlay”这个方法开启图层的单选。如果要取消图层的单选,可以使用“endPickOverlay”方法。
以上这三个方法是图层单选需要用到的。
下面来看图层单选的操作流程,如果我们要实现一个图层的单选,首先我们要添加图层。在当前代码范例中,使用的是“addLandmarkLayer”方法添加了一个地标图,地标图中包含两个点位。之后使用“onLandmarkLayerClick”方法注册图层的点击事件。此时我们需要注意,定义完前面的添加图层和注册点击事件,此时场景中的图层还无法单选,因为默认图层没有开启点击事件。
所以,需要在添加完图层的回调函数里调用 “pickOverlay”方法,来开启图层的单选,只有开启了图层的单选,在点击图层的时候,才会得到“onLandmarkLayerClick”这个方法的回调。所以,图层单选的正确流程是 “添加图层”——“开启图层的单选”——“注册点击事件”,之后我们就可以实现点击图层并获取回调信息。
当然,在我们编写代码时,“onLandmarkLayerClick”这个方法也可以先注册,这里只是代表是事件监听的一种方式。
停止单选
停止单选使用的是“clearOverlaySelected”方法,我们把代码拆解来看一下
首先使用“addLandmarkLayer”方法添加一个地标图层,点击执行之后,清除“事件日志”,这时,点击图层是没有任何反应的。之后需要注册地标图的点击事件,使用“onLandmarkLayerClick”这个方法,注册点击事件监听,点击执行,此时点击图层也不会有任何反应,只是在代码中显示注册成功。
接下来需要开启图层的点击,需要调用“pickOverlay”方法:
overlayType——图层对象类别;
idLayer——当前场景定义的是“cameraLayer”;
type 为“click”点击选中,注意“allowMultiple”(只支持端渲染)为是否支持多选,因为当前操作的是单选,所以我们写“false”。
isShowDecorator——是否显示选中的高亮装饰,选择“true”的时候,点击图标,会出现一个选中的状态,改为“false”就没有选中状态的效果了。
点击执行,就开启了图层的点击事件,之前已经注册过了,此时点击图层,就可以在“事件日志”里看到“onLandmarkLayerClick”方法的回调信息,每次点击图标,“事件日志”都会打印图层的信息。
这个信息里有一些参数,idObj 代表子图层 id 为 2;图层对象的 idLayer 为“cameraLayer”,“selected”为是否选中,这里是“true”;type 为“摄像头”,当再次点击相同图标,此时点击事件就取消了,可以在下方事件日志中看到,“selected”为“false”。通过这个方法,我们可以在**“onLandmarkLayerClick”方法的回调信息里判别图层的类型来实现各类应用,也就是交互**。
当图层被选中以后,会有一个选中的样式,如果不想要这个样式,也是可以通过“clearOverlaySelected”方法清除图层的选中状态,当调用这个方法之后会清除全部图层对象选中状态,点击执行,可以看到场景中的图层选中状态就消除了。
最后关闭图层的点击事件“endPickOverlay”方法。我们需要传入 OverlayType 覆盖物的类型、idLayer 为图层的 id、type 为“click”,点击执行,我们再次点击场景中的地标图,可以看到图标不再被选中了。如果需要再实现点击选中,只需要再次开启事件的点击事件,通过 “pickOverlay”方法即可。这里要讲一下,因为之前我们通过“onLandmarkLayerClick”方法统一注册过地标点的点击事件,所以只需要再次开启“pickOverlay”就可以了,执行之后点击图标,就可以被选中,并且“事件日志”中就出现了对应图层的信息。
第二节 图层框选
图层框选是指可以在场景里拉取一个矩形的选框,框选在矩形中的地表点或者其他图层都可以识别到,并且以回调的形式返回回来
我们已经添加了一个地标图层,里面有包含 4 个点位。“addLandmarkLayer”是添加地标图层,之后我们需要注册点击图层效果,这里我们没有用“onLandmarkLayerClick”;“onClickOverlayResult”此方法可以在我们框选图层之后,会给我们返回图层信息;“endSelectedOverlay”是取消图层单选。
接下来我们需要开启图层的框选,使用的方法是“selectOverlay”方法。overlayType 为图层对象类别;idLayer 为要框选的图层对象;type 为“rect”矩形选框,也可以使用“circle”圆形选框。如果想要停止框选,需要使用“endSelectOverlay”方法,传入相关的参数就可以。
点击执行,我们可以看到在场景里我们添加了 4 个图标并且可以进行框选,通过拉取矩形选框,可以选中矩形区域内的图层对象,回调信息会出现在“事件日志”中,可以看到有图层的类型 type、图层的 id、框选住的子图层的 ids 会以数组的形式返回。
接下来我们来拆解一下这些代码。首先清除不需要的代码,第一步是添加图层,使用“addLandmarkLayer”方法,点击执行,可以看到场景中出现了我们添加的图层,此时的场景是可以操控摄像机进行拖拽的。下一步需要注册事件,使用的是“onClickOverlayResult” 方法,并且会打印回调信息。点击执行之后,场景中不会发生变化,只是注册成功了。
之后需要开启图层的框选,使用“selectOverlay”方法,点击执行,可以看到,此时场景无法被拖动,因为此时默认进入框选状态。所以此时来进行框选,选中了一个图层对象,再次框选,这次选中了三个图层对象,我们还可以任意调整选框的大小。当我们框选全部 4 个图层对象时,可以来看下“事件日志”中的信息,在事件日志中,4 个选中的图层对象的回调信息全部返回回来了。这里还要说明的是,在事件日志中,带星号的信息是图观注册的,下面的信息是我们自己注册的,可以看到当前回调信息中的 selected 为 true。
如果不想框选,想拖动地图,我们需要使用“endSelectOverlay”方法,点击执行之后,我们就可以正常的拖拽场景、交互场景、并且没有框选的效果了,如果想要再次框选,需要使用“selectOverlay”方法继续执行。