cesium鼠标移入实体动态加亮

最新推荐文章于 2023-09-18 16:30:31 发布

原创最新推荐文章于 2023-09-18 16:30:31 发布 · 2.9k 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#gis #cesium #web #html

本文介绍如何使用Cesium JavaScript库实现当鼠标悬停在3D模型上时，模型颜色高亮显示的功能。通过ScreenSpaceEventHandler监听鼠标移动事件，并利用pickPositionSupported判断和获取被选中实体，调整其透明度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
                    handler.setInputAction(function(movement){
                        var haveEn = viewer.scene.pick(movement.endPosition);
                        if(viewer.scene.pickPositionSupported && Cesium.defined(haveEn) && haveEn.id !== ' '){
                            clearAlpha();
                            if(haveEn.id.polygon !== undefined){
                               var haveEnsNow = haveEn.id.polygon._material._color.getValue();
                               haveEnsNow.alpha = 1;
                               haveEn.id.polygon._material._color.setValue(haveEnsNow);
                            }
                        }else if(haveEn == undefined){
                            clearAlpha();
                        }
                    },Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                    function clearAlpha(){
                        for(var i=0;i<viewer.entities.values.length;i++){
                            if(viewer.entities.values[i].name == "yanse"){
                                var haveEnsLast=viewer.entities.values[i]._polygon._material._color.getValue();
                                haveEnsLast.alpha = 0.2;
                                viewer.entities.values[i]._polygon._material._color.setValue(haveEnsLast)
                            }
                        }
                    }