给场景中的设备描边关键代码

import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer'let composer = null
let outlinePassRing = null // 光圈composer = new EffectComposer(renderer)
outlinePassRing = new OutlinePass(new THREE.Vector2(div3D.clientWidth, div3D.clientHeight), scene, camera)
let paramsRing = {edgeStrength: 3.0, // 强度edgeGlow: 1, // 边缘明暗度edgeThickness: 2.0, // 边缘雾化度pulsePeriod: 3, // 闪烁 值越大频率越低rotate: false,usePatternTexture: false // 是否使用皮肤
}
outlinePassRing.visibleEdgeColor.set('#ff0000')
outlinePassRing.edgeStrength = paramsRing.edgeStrength
outlinePassRing.edgeGlow = paramsRing.edgeGlow
outlinePassRing.pulsePeriod = paramsRing.pulsePeriod
outlinePassRing.edgeThickness = paramsRing.edgeThickness
outlinePassRing.renderToScreen = true
composer.addPass(outlinePassRing)let dev = scene.getObjectByName(`设备名称`)
outlinePassRing.selectedObjects.push(dev) // 将当前设备描红色边框

问题一：

重复放了同一个设备到outlinePassRing.selectedObjects，其内部组件会变得不可见。

console.log(dev.name, dev.children[0].name, dev.children[0].visible, i)

打印内容如下：
1#DLB Geometry.001_0 true 0
2#DLB Geometry.002_0 true 1
1#DLB Geometry.001_0 true 2
1#QYB Geometry.002_0 true 3
1#QYB Geometry.002_0 true 4
第一三个设备是相同的，第四五个设备是相同的。

继续将这些设备放入outlinePassRing.selectedObjects有：

for (let i = 0; i < outlinePassRing.selectedObjects.length; i++) {let newobj = outlinePassRing.selectedObjects[i]setTimeout(() => {console.log(newobj.name, newobj.children[0].name, newobj.children[0].visible, i)}, 3000)
}

打印内容如下：
1#DLB Geometry.001_0 undefined 0
2#DLB Geometry.002_0 true 1
1#DLB Geometry.001_0 undefined 2
1#QYB Geometry.002_0 undefined 3
1#QYB Geometry.002_0 undefined 4

原本都可见的子组件，现在都不可见了。所以去重很重要！！！

去重方法如下：

方法1：

let val = ['1#DLB', '2#DLB', '1#DLB', '1#QYB', '1#QYB']
let devArr = [...new Set(val)]

方法2：

let val = ['1#DLB', '2#DLB', '1#DLB', '1#QYB', '1#QYB']
let devArr = []
for (let i = 0; i < val.length; i++) {let devStr = val[i]if (devArr.indexOf(devStr) === -1) {devArr.push(devStr)}
}

问题二：

当CSS2DRenderer的文字渲染器和EffectComposer的特效渲染同时出现时，时不时卡到爆。
怀疑是场景中动态加载删除的对象清理不够彻底，参考他人所说的删除对象时要清除缓存，调用如下方法。

// 清除当前mesh对象的缓存
function clearCache (mesh) {if (mesh.type === 'Mesh') {mesh.geometry.dispose()mesh.material.dispose()} else if (mesh.children && mesh.children.length > 0) {for (let i = 0; i < mesh.children.length; i++) {clearCache(mesh.children[i])}}
}

毛线用都没有，依旧时不时卡到爆！！！
发现只有改回renderer渲染不用composer就好了。

// 每一帧都重新渲染界面 去掉才能添加边框发光效果
renderer.render(scene, camera)
// 效果组合器渲染
// composer.render()

这……

EffectComposer、OutlinePass特效引发的问题和卡顿相关推荐

mysql 设置时区_MySQL实战干货 | 如何处理由时区设置引发的 SQL 执行“卡顿”？...
作者:田杰,阿里云数据库高级运维专家查询执行时间长引发应用感知 "卡顿" 的场景在数据库的日常支持和使用中并不少见,但由于时区设置引发的 SQL 执行"卡顿" ...
android gridview滑动卡,ViewPager嵌套GridView引发的一系列UI卡顿不顺畅的问题
由于项目要求,需要做一个日历的页面,做法采用ViewPgaer+GridView来做,初步过程很顺利,成型以后,出现UI现象有(1)Acitivity加载时间过长 (2)滑动Viewpager出现卡顿 ...
【系统优化】解决windows11桌面切换卡顿（非重装以及关闭特效）
[系统优化]解决windows11桌面切换卡顿(非重装以及关闭特效) 问题:最近使用win11系统的时候会经常使用触摸板切换桌面,然后每次切换桌面的时候任务栏图标会闪烁,然后系统会卡住一下,体验嫉妒不 ...
2018最新4k超高清视频编辑，解码，编码，数据压缩，特效合成，调色，影视后期，卡顿慢问题分析
2018最新4k超高清视频编辑,解码,编码,数据压缩,特效合成,调色,视频渲染输出,影视后期,卡顿慢问题分析 4K视频时代到来,影视后期制作的各个环节(如视频剪辑.特效合成.视频调色.视频输出等 ...
粒子特效卡顿问题记录
最近某个系统重新包装,把对应模型全部换了,之后发现某几个模型在切换页签的时候会卡1-2秒才出来,根据反馈我开始去查怎么回事. 1.首先排除代码问题,因为只是重新包装,代码没改. 2.接着用unity的 ...
打开word2007总是出现配置进度_电脑玩《原神》出现掉帧延迟卡顿内存不足等问题教你三步搞定_游戏369...
全新开放世界RPG<原神>自正式公测以来,凭借丰富的剧情.细腻的建模.多彩的游戏世界,受到了大量玩家的热捧.但是也有一些玩家吐槽说,自己玩原神的时候总是会出现卡顿.延迟等问题,游戏体验极差 ...
android 加载h5页面部分机型滑动卡顿回弹_网易爆款H5 的交互方法参考
在早些年,H5其实更像是手机上的PPT,只支持点击.滑动这些基础手势操作.以内容展示为主,交互形式为辅. 但到了今天,H5的玩法已经有了质的突破.不仅交互形式超多,形式与内容也能紧密结合,产生1+1大 ...
修改电脑开机时间记录6005_这些优化步骤，让你的电脑远离卡顿！
随着更新换代,电脑的性能越来越强劲.但无论是普通电脑,亦或是旗舰机,用得久了总逃不脱"卡顿"的烦恼!快节奏的生活,让我们都变成了急性子.遇到卡顿问题,真的容易抓狂! 小微整理了一篇 ...
Android性能优化 - 消除卡顿
性能优化系列阅读 Android性能优化性能优化 - 消除卡顿性能优化 - 内存优化性能分析工具 - TraceView Android性能分析工具消除卡顿什么是卡顿及卡顿的衡量标准产生卡 ...

EffectComposer、OutlinePass特效引发的问题和卡顿