尧图网站建设 
简介这是一个Unity心电图ECG线波模拟效果项目Demo面向Unity开发者、游戏特效制作人员及相关专业学习者用于掌握实时波形渲染、动态动画控制和参数化交互设计。项目已实现心电图上下振幅模拟效果波线速度、颜色和振幅参数均可在界面中自定义调整代码结构完整可直接基于源码修改和二次开发。压缩包为RAR格式共6688个文件大小约39.19MB属于完整Unity项目工程。核心内容包括1066个C#脚本、575张PNG贴图、237个Markdown文档、5个Prefab预制体、31个Asset配置文件等覆盖脚本逻辑、图形资源、场景配置与阅读文档目录组织清晰便于按模块学习。已有330人学习/下载。借助该Demo可重点研究心电图波形的绘制逻辑学习Material颜色动态修改、Transform局部缩放控制振幅、Time.deltaTime驱动波线速度等Unity常用技术同时可参考Input.GetKeyDown键盘交互、Update/协程动画控制及脚本组件化封装等实践思路为游戏UI特效、医疗模拟类互动内容的开发提供直接参考。1. Unity模拟心电图线波demo它到底解决什么问题做医疗训练模拟、数字孪生大屏、驾驶舱状态可视化的时候最常被要求加的一个效果就是“看起来像是监护仪在跳”的动态波形一条线按固定节奏左右扫过上下起伏模拟心跳颜色和速度还得能随时改。Unity里做这种模拟心电图线波效果常见做法不是去引入第三方插件或者用Shader硬算而是直接用LineRenderer配合一个可调参数脚本把波形采样点算出来再赋值给顶点数组。这套方案的好处是轻量、不改渲染管线、不依赖特定Shader在Built-in管线、URP下都能跑也方便后续把真实数据接到同一个波形组件上。这个demo适合这么用UI上做状态提示、后台设备“活着”的呼吸感、数字孪生场景里把抽象数据变成视觉心跳。如果你手里也有类似“要一条会动的线波但不想为此引一个大插件”的需求下面从选型到参数到踩坑按可以照抄的顺序写清楚。2. 用LineRenderer还是自定义Shader先把线波渲染方案定下来2.1 LineRenderer为什么是默认选择拉一条会动的曲线在Unity里有好几条路UGUI的Image加自定义绘制、Mesh动态更新、Shader程序化生成、LineRenderer。实际做下来LineRenderer是最省事的选择。原因有三点第一它是引擎内建组件不需要额外引包也不依赖UGUI的Layout和Canvas刷新机制第二它自带宽度曲线和梯度颜色模拟监护仪的荧光色渐变不用自己写着色器第三它的position数组支持直接写入每帧更新几百个顶点在移动端也完全没有压力。缺点是它的几何体在CPU侧生成顶点数量很大时才需要考虑优化。但模拟心电图这类波形采样点给到200到500个已经是肉眼平滑的极限离性能瓶颈还很远。另一个容易被忽略的点是LineRenderer在Built-in管线和URP下的材质兼容性如果只改了颜色和宽度直接用默认的Sprites/Default材质和线渲染管线就行如果开了URP但没升级材质波形会显示成洋红色出现这个情况去材质面板重新选URP/Lit或Sprites/Default即可。2.2 波形不是纯正弦模拟心电图的合成公式标题里说“模拟心电图上下振幅”很多第一次做的人会直接写一个Mathf.Sin(time)就交差。出来的效果虽然也在跳但和监护仪上的波形比明显“太假”。真实心电图的单周期有P波、QRS波群、T波特征是不对称的有个高尖刺、一个圆润的主峰、一个平缓的小鼓包。做demo不需要还原医学波形但至少要让视觉上“像”。常见做法是用多段正弦加一小组基函数合成波形。我在这个方案里用的是三层叠加// 心电图合成波形主波动 高频细节 特征尖峰 float wave ampMain * Mathf.Sin(2f * Mathf.PI * freq * phase); wave ampDetail * Mathf.Sin(2f * Mathf.PI * freq * 3f * phase 0.8f); wave ampSpike * Mathf.Exp(-Mathf.Pow((phase % 1f - 0.2f) * 8f, 2f));主波动负责打底高频细节让线在运动时有一点“锯齿感”尖峰项用高斯函数模拟QRS波群的陡升陡降。phase取值0到1之间循环这样每一轮心跳是完整周期。选择这种合成方式而不是直接采样一段真实心电数据是因为合成波的每个参数都能映射到自定义项振幅、速度、颜色在Inspector上改完立刻能看到反馈而真实采样数据做不了这种灵活动态调整。2.3 为什么不推荐用Shader写全部效果Shader方案理论上效率更高波形计算放到GPU上还能省掉每帧CPU更新顶点数组的开销。但实际维护成本高要处理Uniform更新、不同管线的兼容性、UI遮罩和本地坐标变换而且后续如果想对接串口或网络来的真实心电数据Shader里不好做数据缓冲。关键问题是Shader做出的波形适合“一路滑过”的展示型效果不适合“波形可以暂停、变速、回放”的交互型效果。demo的价值在于给后续项目留修改空间所以CPU生成顶点、组件属性暴露给Inspector这个方向更合适。3. 从空场景跑通心电图线波搭建步骤与核心脚本3.1 场景搭建空物体挂LineRenderer关键参数一次设对新建场景后创建一个空物体命名为ECG_Line。给这个物体添加LineRenderer组件然后先做四件事把Loop勾选去掉Use World Space关掉Position设置成0Material选择Sprites/Default。关Use World Space的原因是把生成的采样点当作局部坐标处理后续移动整个容器不会被坐标空间弄晕开Loop会画出一圈闭合线和“从底边出发扫过的直线波形”不符。// 初始化LineRenderer基础参数 LineRenderer lr GetComponentLineRenderer(); lr.loop false; lr.useWorldSpace false; lr.positionCount segments; lr.widthCurve AnimationCurve.Linear(0f, lineWidth, 1f, lineWidth); lr.widthMultiplier 1f; lr.material new Material(Shader.Find(Sprites/Default));尺寸方面建议让LineRenderer的原点位于屏幕下半部波形整体向上凸。摄像机的Projection选择OrthographicSize设为5时LineRenderer的Y向跨度在正负2.5之间最合适既不会顶到屏幕边缘也不会因为振幅太小缺乏“心跳感”。3.2 核心脚本振幅、波速、颜色全部暴露到Inspector这一步直接把核心脚本贴出来这是整个demo的基础。脚本做的事情是每帧把phase累加一个偏移量然后把采样点的x坐标均匀分布在水平范围里y坐标用合成波形函数计算最后把颜色梯度写进LineRenderer。using UnityEngine; public class ECGLineWave : MonoBehaviour { [Header(波形参数)] public float scrollSpeed 1.2f; // 水平滚动速度1.0时每秒完成一个完整周期 public float mainAmplitude 1.8f; // 主波振幅 public float detailAmplitude 0.6f; // 高频细节振幅 public float spikeAmplitude 1.2f; // 尖峰振幅 public float frequency 1.0f; // 波形主频率 public int segments 512; // 采样点数量 [Header(颜色设置)] public Gradient lineGradient; // 线渐变颜色 public float lineWidth 0.08f; // 线宽World单位 [Header(水平范围)] public float length 8f; // 波形占据的水平长度 private LineRenderer lr; private float phase 0f; void Start() { lr GetComponentLineRenderer(); if (lineGradient null || lineGradient.colorKeys.Length 0) { lineGradient new Gradient(); lineGradient.SetKeys( new GradientColorKey[] { new GradientColorKey(new Color(0.2f, 1f, 0.4f), 0f), new GradientColorKey(new Color(0.1f, 0.8f, 1f), 0.5f), new GradientColorKey(new Color(0.2f, 1f, 0.4f), 1f) }, new GradientAlphaKey[] { new GradientAlphaKey(1f, 0f), new GradientAlphaKey(1f, 1f) } ); } lr.colorGradient lineGradient; lr.startWidth lineWidth; lr.endWidth lineWidth; } void Update() { phase scrollSpeed * Time.deltaTime; if (phase 1f) phase - 1f; Vector3[] positions new Vector3[segments]; for (int i 0; i segments; i) { float t (float)i / (segments - 1); float x t * length - length * 0.5f; float y CalculateY(phase t * 0.6f); positions[i] new Vector3(x, y, 0f); } lr.positionCount segments; lr.SetPositions(positions); } float CalculateY(float ph) { float phWrapped ph - Mathf.Floor(ph); float wave mainAmplitude * Mathf.Sin(2f * Mathf.PI * frequency * phWrapped); wave detailAmplitude * Mathf.Sin(2f * Mathf.PI * frequency * 3f * phWrapped 0.8f); float spike Mathf.Exp(-Mathf.Pow((phWrapped - 0.2f) * 8f, 2f)); wave spikeAmplitude * spike; return wave; } }代码逻辑说明Update里累加phase作为时间滚动量CalculateY接收一个0到1之间的相位值先取小数部分保证每周期连续然后叠加主波、三次谐波和高斯尖峰。segment从0到segments-1映射x坐标t乘以0.6让整条线的相位沿水平方向错开形成“波从左向右传播”的视觉。position数组每帧重建这是一个内存分配点后面避坑章节会专门说怎么优化。参数说明scrollSpeed的单位是“每秒经过的周期数”不是像素速度这样在不同分辨率下节奏一致。mainAmplitude控制在1.5到2.5之间视觉最像心率曲线detailAmplitude不宜超过0.8否则波形变成毛刺spikeAmplitude给到1.0到1.5能模拟QRS波群的尖锐感太小会被主波吞掉。segments在真机上建议不要低于200低了曲线出现折线感高于800后肉眼无明显提升但要占用更大顶点缓冲。4. 振幅、波速与颜色自定义参数怎么设才像真的监护仪4.1 振幅和速度的控制边界标题里说“上下振幅和波线速度都可以自定义调整”这个“可调”如果只是把参数暴露出来实际用的时候很容易翻车。振幅要给上下限限制速度要和业务节奏匹配而不是随手拖。振幅的上限取决于你放波形的容器高度。我一般按“波形最高点不超过屏幕可用高度的35%”来约束。如果容器是屏幕下方的一个状态条高度只有4个Unity单位那mainAmplitude给到3.0必然穿出区域。速度方面模拟心电图的视觉节奏约在“1秒到1.2秒完成一个周期”对应scrollSpeed在0.8到1.2之间。低于0.5感觉像是在慢放高于2.0则失去了心跳感像电源波纹。一个可用参数表参数推荐范围作用scrollSpeed0.8 ~ 1.2每秒完成的波形周期数mainAmplitude0.8 ~ 2.5基础波形高度detailAmplitude0.2 ~ 0.8波形毛刺和细节颗粒感spikeAmplitude0.8 ~ 1.5QRS尖峰的高度frequency0.8 ~ 1.2生成波形的基础频率segments256 ~ 512单条线的顶点数量需要注意的是修改mainAmplitude会影响整条线的显示范围如果同时改了摄像机Orthographic大小这两处是关联的。建议在代码里把振幅最大值与原点位置写一个联动约束当振幅超过边界时在Inspector里给出黄色警告避免调出一个波形飞出屏幕却找不到原因的尴尬。具体做法是在OnValidate回调里动态检查振幅并重新赋值。4.2 颜色自定义LineRenderer的Gradient设置颜色自定义有三个层面整条线单色、按位置渐变色、按时间闪烁。监护仪最常见的是荧光绿到浅蓝渐变把第3章脚本里的lineGradient换成下面这组参数即可得到这个效果。// 荧光绿渐变适合黑色或深色背景 GradientColorKey[] colorKeys new GradientColorKey[] { new GradientColorKey(new Color(0.1f, 1f, 0.3f), 0f), new GradientColorKey(new Color(0.2f, 0.9f, 0.7f), 0.5f), new GradientColorKey(new Color(0.1f, 1f, 0.3f), 1f) };LineRenderer的Gradient是按顶点位置插值还是按整条线的长度插值取决于Gradient的模式。默认是Fixed较短的线渐变过渡看起来很快改成Blend模式后过渡更平滑。屏幕上如果嫌颜色发灰多半是材质没有关闭雾效或者颜色空间不对把项目从Gamma切换成Linear后荧光色会更亮代价是画面整体对比度提升需要重新调整背景色。颜色还要注意和背景的关系。深色底配荧光绿是监护仪的经典组合但如果你把背景换成白色面板荧光绿的对比度会下降得非常明显这时候建议主颜色换成深蓝色或者墨绿色线宽也可以从0.08加到0.12让波形更有存在感。4.3 把自定义参数做成运行时接口在demo阶段参数放Inspector手调没问题但真要接到业务系统里就得把参数暴露成公开方法或者做成ScriptableObject配置。常见做法是单独建一个配置类把颜色、速度、振幅、线宽存成一整个Profile切换不同场景状态时直接换配置[System.Serializable] public class ECGStyleProfile { public string profileName; public float speed 1f; public float amplitude 1.8f; public Gradient gradient; public float width 0.08f; }public void ApplyProfile(ECGStyleProfile profile) { scrollSpeed profile.speed; mainAmplitude profile.amplitude; lineGradient profile.gradient; lineWidth profile.width; }这样外部系统调用ApplyProfile就能切换不同风格而不需要深入到波形生成逻辑里。如果你做的是数字孪生类项目这一步几乎必然会用到——不同设备、不同告警级别对应不同心跳频率和颜色可能性非常多。5. 心电图线波效果最容易翻车的5个坑现象、原因与处理办法5.1 波形左右移动但上下完全不动现象线是滚动了但y方向始终平得像一根直线只有尖峰偶尔出现。原因是phase的累积方向和水平偏移的方向叠加出了问题——phase滚动时t * 0.6的水平相位偏移把滚动量抵消或者错开了。解决办法是别把水平偏移写在CalculateY内部而是直接给x坐标加滚动偏移波形参数里单独保留一个speed。5.2 线宽在屏幕上忽粗忽细现象波形左右移动过程中线宽看起来在变。原因是LineRenderer的widthCurve默认不是平的或者相机离LineRenderer太近、屏幕比例不同导致投影缩放不一致。解决方法是先把widthCurve拉成线性0到1再检查widthMultiplier是否为1。如果用的是透视相机距离越远线越细是正常透视效果要么把相机调成正交要么把LineRenderer的对齐模式改成View。5.3 波形在UGUI上面显示不出来现象在Canvas里创建一个RawImage或者用Graphic组件包住LineRenderer什么都看不到。原因是LineRenderer本身是3D空间物体UI渲染在Canvas的覆盖层二者不在同一渲染顺序里。正确做法是不要在UICanvas里放LineRenderer应该把波形做成相机拍摄的画面投射到RawImage上或者用RenderTexture把线波渲染到一张贴图上再显示给UI后者是项目中更实用的方案。5.4 波形一顿一顿帧率骤降现象编辑器里很流畅打包到手机上波形的移动不连续Profile显示CPU占用高。原因是每帧new出来的positions数组触发GC以及segments设置过大。第3章的代码每帧都创建一个512长度的Vector3数组在手机上就是无谓的GC压力。解决办法是预先分配好数组每帧只修改值不重新创建private Vector3[] positions; void Start() { positions new Vector3[segments]; } void Update() { // 复用数组不new新对象 for (int i 0; i segments; i) { // 直接修改positions[i] } lr.SetPositions(positions); }5.5 试用版Unity水印录屏时不希望被看到现象项目还没正式授权用试用版Unity跑demoGame窗口和录屏里左下角一直浮着Unity水印。原因是Unity对未激活或者试用版会在运行时叠加水印。处理办法是如果只是做效果演示把Game画面裁掉水印区域或者等授权就绪后再录屏。如果是在一体机上开发build出来的版本在启动时水印会显示给甲方展示之前确认授权状态这是最容易忽略的细节。5.6 OnValidate修改参数不生效现象改Inspector里的线条参数Game窗口没有实时重现。原因是LineRenderer的宽度和颜色只在Start里赋值了一次运行时修改字段但没调用LineRenderer的更新接口。解决方法是OverrideOnValidate在Inspector数值变化的瞬间重新赋值void OnValidate() { if (lr null) lr GetComponentLineRenderer(); lr.startWidth lineWidth; lr.endWidth lineWidth; lr.colorGradient lineGradient; }这样改完参数马上能看到效果不用每次进Play Mode重新验证调试效率会提升一大截。6. 把心电图线波做到能交付验证、优化与最后一个实用技巧6.1 用AnimationCurve直接手调单周期波形如果你不想和公式参数打交道还有一个更直观的做法把波形从代码合成改成AnimationCurve手绘。创建一个单周期波形曲线让x轴是0到1的相位y轴是振幅然后代码里直接Evaluate曲线得到采样值。这样做的好处是波形形状完全受控可以亲手画出想要的PQRST形态而且美术同事也能上手调整。public AnimationCurve waveShape AnimationCurve.Linear(0f, 0f, 1f, 0f); float CalculateYFromCurve(float ph) { return waveShape.Evaluate(Mathf.Repeat(ph, 1f)) * mainAmplitude; }用AnimationCurve的代价是振幅和速度分离得更明确曲线本身的y轴范围不建议写超出正负1的数值真正的振幅控制放到mainAmplitude统一管理。6.2 验证和优化让demo可以交付而不是只能跑在编辑器里交付前做两件事第一用Profiler跑一遍真机确认没有任何脚本在Update里分配堆内存波形动画的CPU占用低于1ms第二做参数回归验证——把scrollSpeed调到2.0持续跑5分钟再把mainAmplitude调到2.5跑5分钟确认没有波形穿模、颜色突变、线宽异常。我自己的习惯是所有波形相关参数固定到一个配置类里不同场景直接加载不同配置项同时保证波形组件即使在没有赋值的情况下也有默认参数不会在空引用上报错。最后说一个经验心电图线波这种效果越简单越可靠。不要为了追求炫酷往里面加粒子、加辉光、加动态模糊——加了这些以后在URP管线里就要引入后处理栈对移动端的开销和兼容性都是额外负担。把一条线的顶点、宽度、颜色、速度做到极致可信比叠加特效更能让对方信服。希望帮到你。本文还有配套的精品资源点击获取 Unity实现心电图线波效果：LineRenderer动态波形参数化方案
简介这是一个Unity心电图ECG线波模拟效果项目Demo面向Unity开发者、游戏特效制作人员及相关专业学习者用于掌握实时波形渲染、动态动画控制和参数化交互设计。项目已实现心电图上下振幅模拟效果波线速度、颜色和振幅参数均可在界面中自定义调整代码结构完整可直接基于源码修改和二次开发。压缩包为RAR格式共6688个文件大小约39.19MB属于完整Unity项目工程。核心内容包括1066个C#脚本、575张PNG贴图、237个Markdown文档、5个Prefab预制体、31个Asset配置文件等覆盖脚本逻辑、图形资源、场景配置与阅读文档目录组织清晰便于按模块学习。已有330人学习/下载。借助该Demo可重点研究心电图波形的绘制逻辑学习Material颜色动态修改、Transform局部缩放控制振幅、Time.deltaTime驱动波线速度等Unity常用技术同时可参考Input.GetKeyDown键盘交互、Update/协程动画控制及脚本组件化封装等实践思路为游戏UI特效、医疗模拟类互动内容的开发提供直接参考。1. Unity模拟心电图线波demo它到底解决什么问题做医疗训练模拟、数字孪生大屏、驾驶舱状态可视化的时候最常被要求加的一个效果就是“看起来像是监护仪在跳”的动态波形一条线按固定节奏左右扫过上下起伏模拟心跳颜色和速度还得能随时改。Unity里做这种模拟心电图线波效果常见做法不是去引入第三方插件或者用Shader硬算而是直接用LineRenderer配合一个可调参数脚本把波形采样点算出来再赋值给顶点数组。这套方案的好处是轻量、不改渲染管线、不依赖特定Shader在Built-in管线、URP下都能跑也方便后续把真实数据接到同一个波形组件上。这个demo适合这么用UI上做状态提示、后台设备“活着”的呼吸感、数字孪生场景里把抽象数据变成视觉心跳。如果你手里也有类似“要一条会动的线波但不想为此引一个大插件”的需求下面从选型到参数到踩坑按可以照抄的顺序写清楚。2. 用LineRenderer还是自定义Shader先把线波渲染方案定下来2.1 LineRenderer为什么是默认选择拉一条会动的曲线在Unity里有好几条路UGUI的Image加自定义绘制、Mesh动态更新、Shader程序化生成、LineRenderer。实际做下来LineRenderer是最省事的选择。原因有三点第一它是引擎内建组件不需要额外引包也不依赖UGUI的Layout和Canvas刷新机制第二它自带宽度曲线和梯度颜色模拟监护仪的荧光色渐变不用自己写着色器第三它的position数组支持直接写入每帧更新几百个顶点在移动端也完全没有压力。缺点是它的几何体在CPU侧生成顶点数量很大时才需要考虑优化。但模拟心电图这类波形采样点给到200到500个已经是肉眼平滑的极限离性能瓶颈还很远。另一个容易被忽略的点是LineRenderer在Built-in管线和URP下的材质兼容性如果只改了颜色和宽度直接用默认的Sprites/Default材质和线渲染管线就行如果开了URP但没升级材质波形会显示成洋红色出现这个情况去材质面板重新选URP/Lit或Sprites/Default即可。2.2 波形不是纯正弦模拟心电图的合成公式标题里说“模拟心电图上下振幅”很多第一次做的人会直接写一个Mathf.Sin(time)就交差。出来的效果虽然也在跳但和监护仪上的波形比明显“太假”。真实心电图的单周期有P波、QRS波群、T波特征是不对称的有个高尖刺、一个圆润的主峰、一个平缓的小鼓包。做demo不需要还原医学波形但至少要让视觉上“像”。常见做法是用多段正弦加一小组基函数合成波形。我在这个方案里用的是三层叠加// 心电图合成波形主波动 高频细节 特征尖峰 float wave ampMain * Mathf.Sin(2f * Mathf.PI * freq * phase); wave ampDetail * Mathf.Sin(2f * Mathf.PI * freq * 3f * phase 0.8f); wave ampSpike * Mathf.Exp(-Mathf.Pow((phase % 1f - 0.2f) * 8f, 2f));主波动负责打底高频细节让线在运动时有一点“锯齿感”尖峰项用高斯函数模拟QRS波群的陡升陡降。phase取值0到1之间循环这样每一轮心跳是完整周期。选择这种合成方式而不是直接采样一段真实心电数据是因为合成波的每个参数都能映射到自定义项振幅、速度、颜色在Inspector上改完立刻能看到反馈而真实采样数据做不了这种灵活动态调整。2.3 为什么不推荐用Shader写全部效果Shader方案理论上效率更高波形计算放到GPU上还能省掉每帧CPU更新顶点数组的开销。但实际维护成本高要处理Uniform更新、不同管线的兼容性、UI遮罩和本地坐标变换而且后续如果想对接串口或网络来的真实心电数据Shader里不好做数据缓冲。关键问题是Shader做出的波形适合“一路滑过”的展示型效果不适合“波形可以暂停、变速、回放”的交互型效果。demo的价值在于给后续项目留修改空间所以CPU生成顶点、组件属性暴露给Inspector这个方向更合适。3. 从空场景跑通心电图线波搭建步骤与核心脚本3.1 场景搭建空物体挂LineRenderer关键参数一次设对新建场景后创建一个空物体命名为ECG_Line。给这个物体添加LineRenderer组件然后先做四件事把Loop勾选去掉Use World Space关掉Position设置成0Material选择Sprites/Default。关Use World Space的原因是把生成的采样点当作局部坐标处理后续移动整个容器不会被坐标空间弄晕开Loop会画出一圈闭合线和“从底边出发扫过的直线波形”不符。// 初始化LineRenderer基础参数 LineRenderer lr GetComponentLineRenderer(); lr.loop false; lr.useWorldSpace false; lr.positionCount segments; lr.widthCurve AnimationCurve.Linear(0f, lineWidth, 1f, lineWidth); lr.widthMultiplier 1f; lr.material new Material(Shader.Find(Sprites/Default));尺寸方面建议让LineRenderer的原点位于屏幕下半部波形整体向上凸。摄像机的Projection选择OrthographicSize设为5时LineRenderer的Y向跨度在正负2.5之间最合适既不会顶到屏幕边缘也不会因为振幅太小缺乏“心跳感”。3.2 核心脚本振幅、波速、颜色全部暴露到Inspector这一步直接把核心脚本贴出来这是整个demo的基础。脚本做的事情是每帧把phase累加一个偏移量然后把采样点的x坐标均匀分布在水平范围里y坐标用合成波形函数计算最后把颜色梯度写进LineRenderer。using UnityEngine; public class ECGLineWave : MonoBehaviour { [Header(波形参数)] public float scrollSpeed 1.2f; // 水平滚动速度1.0时每秒完成一个完整周期 public float mainAmplitude 1.8f; // 主波振幅 public float detailAmplitude 0.6f; // 高频细节振幅 public float spikeAmplitude 1.2f; // 尖峰振幅 public float frequency 1.0f; // 波形主频率 public int segments 512; // 采样点数量 [Header(颜色设置)] public Gradient lineGradient; // 线渐变颜色 public float lineWidth 0.08f; // 线宽World单位 [Header(水平范围)] public float length 8f; // 波形占据的水平长度 private LineRenderer lr; private float phase 0f; void Start() { lr GetComponentLineRenderer(); if (lineGradient null || lineGradient.colorKeys.Length 0) { lineGradient new Gradient(); lineGradient.SetKeys( new GradientColorKey[] { new GradientColorKey(new Color(0.2f, 1f, 0.4f), 0f), new GradientColorKey(new Color(0.1f, 0.8f, 1f), 0.5f), new GradientColorKey(new Color(0.2f, 1f, 0.4f), 1f) }, new GradientAlphaKey[] { new GradientAlphaKey(1f, 0f), new GradientAlphaKey(1f, 1f) } ); } lr.colorGradient lineGradient; lr.startWidth lineWidth; lr.endWidth lineWidth; } void Update() { phase scrollSpeed * Time.deltaTime; if (phase 1f) phase - 1f; Vector3[] positions new Vector3[segments]; for (int i 0; i segments; i) { float t (float)i / (segments - 1); float x t * length - length * 0.5f; float y CalculateY(phase t * 0.6f); positions[i] new Vector3(x, y, 0f); } lr.positionCount segments; lr.SetPositions(positions); } float CalculateY(float ph) { float phWrapped ph - Mathf.Floor(ph); float wave mainAmplitude * Mathf.Sin(2f * Mathf.PI * frequency * phWrapped); wave detailAmplitude * Mathf.Sin(2f * Mathf.PI * frequency * 3f * phWrapped 0.8f); float spike Mathf.Exp(-Mathf.Pow((phWrapped - 0.2f) * 8f, 2f)); wave spikeAmplitude * spike; return wave; } }代码逻辑说明Update里累加phase作为时间滚动量CalculateY接收一个0到1之间的相位值先取小数部分保证每周期连续然后叠加主波、三次谐波和高斯尖峰。segment从0到segments-1映射x坐标t乘以0.6让整条线的相位沿水平方向错开形成“波从左向右传播”的视觉。position数组每帧重建这是一个内存分配点后面避坑章节会专门说怎么优化。参数说明scrollSpeed的单位是“每秒经过的周期数”不是像素速度这样在不同分辨率下节奏一致。mainAmplitude控制在1.5到2.5之间视觉最像心率曲线detailAmplitude不宜超过0.8否则波形变成毛刺spikeAmplitude给到1.0到1.5能模拟QRS波群的尖锐感太小会被主波吞掉。segments在真机上建议不要低于200低了曲线出现折线感高于800后肉眼无明显提升但要占用更大顶点缓冲。4. 振幅、波速与颜色自定义参数怎么设才像真的监护仪4.1 振幅和速度的控制边界标题里说“上下振幅和波线速度都可以自定义调整”这个“可调”如果只是把参数暴露出来实际用的时候很容易翻车。振幅要给上下限限制速度要和业务节奏匹配而不是随手拖。振幅的上限取决于你放波形的容器高度。我一般按“波形最高点不超过屏幕可用高度的35%”来约束。如果容器是屏幕下方的一个状态条高度只有4个Unity单位那mainAmplitude给到3.0必然穿出区域。速度方面模拟心电图的视觉节奏约在“1秒到1.2秒完成一个周期”对应scrollSpeed在0.8到1.2之间。低于0.5感觉像是在慢放高于2.0则失去了心跳感像电源波纹。一个可用参数表参数推荐范围作用scrollSpeed0.8 ~ 1.2每秒完成的波形周期数mainAmplitude0.8 ~ 2.5基础波形高度detailAmplitude0.2 ~ 0.8波形毛刺和细节颗粒感spikeAmplitude0.8 ~ 1.5QRS尖峰的高度frequency0.8 ~ 1.2生成波形的基础频率segments256 ~ 512单条线的顶点数量需要注意的是修改mainAmplitude会影响整条线的显示范围如果同时改了摄像机Orthographic大小这两处是关联的。建议在代码里把振幅最大值与原点位置写一个联动约束当振幅超过边界时在Inspector里给出黄色警告避免调出一个波形飞出屏幕却找不到原因的尴尬。具体做法是在OnValidate回调里动态检查振幅并重新赋值。4.2 颜色自定义LineRenderer的Gradient设置颜色自定义有三个层面整条线单色、按位置渐变色、按时间闪烁。监护仪最常见的是荧光绿到浅蓝渐变把第3章脚本里的lineGradient换成下面这组参数即可得到这个效果。// 荧光绿渐变适合黑色或深色背景 GradientColorKey[] colorKeys new GradientColorKey[] { new GradientColorKey(new Color(0.1f, 1f, 0.3f), 0f), new GradientColorKey(new Color(0.2f, 0.9f, 0.7f), 0.5f), new GradientColorKey(new Color(0.1f, 1f, 0.3f), 1f) };LineRenderer的Gradient是按顶点位置插值还是按整条线的长度插值取决于Gradient的模式。默认是Fixed较短的线渐变过渡看起来很快改成Blend模式后过渡更平滑。屏幕上如果嫌颜色发灰多半是材质没有关闭雾效或者颜色空间不对把项目从Gamma切换成Linear后荧光色会更亮代价是画面整体对比度提升需要重新调整背景色。颜色还要注意和背景的关系。深色底配荧光绿是监护仪的经典组合但如果你把背景换成白色面板荧光绿的对比度会下降得非常明显这时候建议主颜色换成深蓝色或者墨绿色线宽也可以从0.08加到0.12让波形更有存在感。4.3 把自定义参数做成运行时接口在demo阶段参数放Inspector手调没问题但真要接到业务系统里就得把参数暴露成公开方法或者做成ScriptableObject配置。常见做法是单独建一个配置类把颜色、速度、振幅、线宽存成一整个Profile切换不同场景状态时直接换配置[System.Serializable] public class ECGStyleProfile { public string profileName; public float speed 1f; public float amplitude 1.8f; public Gradient gradient; public float width 0.08f; }public void ApplyProfile(ECGStyleProfile profile) { scrollSpeed profile.speed; mainAmplitude profile.amplitude; lineGradient profile.gradient; lineWidth profile.width; }这样外部系统调用ApplyProfile就能切换不同风格而不需要深入到波形生成逻辑里。如果你做的是数字孪生类项目这一步几乎必然会用到——不同设备、不同告警级别对应不同心跳频率和颜色可能性非常多。5. 心电图线波效果最容易翻车的5个坑现象、原因与处理办法5.1 波形左右移动但上下完全不动现象线是滚动了但y方向始终平得像一根直线只有尖峰偶尔出现。原因是phase的累积方向和水平偏移的方向叠加出了问题——phase滚动时t * 0.6的水平相位偏移把滚动量抵消或者错开了。解决办法是别把水平偏移写在CalculateY内部而是直接给x坐标加滚动偏移波形参数里单独保留一个speed。5.2 线宽在屏幕上忽粗忽细现象波形左右移动过程中线宽看起来在变。原因是LineRenderer的widthCurve默认不是平的或者相机离LineRenderer太近、屏幕比例不同导致投影缩放不一致。解决方法是先把widthCurve拉成线性0到1再检查widthMultiplier是否为1。如果用的是透视相机距离越远线越细是正常透视效果要么把相机调成正交要么把LineRenderer的对齐模式改成View。5.3 波形在UGUI上面显示不出来现象在Canvas里创建一个RawImage或者用Graphic组件包住LineRenderer什么都看不到。原因是LineRenderer本身是3D空间物体UI渲染在Canvas的覆盖层二者不在同一渲染顺序里。正确做法是不要在UICanvas里放LineRenderer应该把波形做成相机拍摄的画面投射到RawImage上或者用RenderTexture把线波渲染到一张贴图上再显示给UI后者是项目中更实用的方案。5.4 波形一顿一顿帧率骤降现象编辑器里很流畅打包到手机上波形的移动不连续Profile显示CPU占用高。原因是每帧new出来的positions数组触发GC以及segments设置过大。第3章的代码每帧都创建一个512长度的Vector3数组在手机上就是无谓的GC压力。解决办法是预先分配好数组每帧只修改值不重新创建private Vector3[] positions; void Start() { positions new Vector3[segments]; } void Update() { // 复用数组不new新对象 for (int i 0; i segments; i) { // 直接修改positions[i] } lr.SetPositions(positions); }5.5 试用版Unity水印录屏时不希望被看到现象项目还没正式授权用试用版Unity跑demoGame窗口和录屏里左下角一直浮着Unity水印。原因是Unity对未激活或者试用版会在运行时叠加水印。处理办法是如果只是做效果演示把Game画面裁掉水印区域或者等授权就绪后再录屏。如果是在一体机上开发build出来的版本在启动时水印会显示给甲方展示之前确认授权状态这是最容易忽略的细节。5.6 OnValidate修改参数不生效现象改Inspector里的线条参数Game窗口没有实时重现。原因是LineRenderer的宽度和颜色只在Start里赋值了一次运行时修改字段但没调用LineRenderer的更新接口。解决方法是OverrideOnValidate在Inspector数值变化的瞬间重新赋值void OnValidate() { if (lr null) lr GetComponentLineRenderer(); lr.startWidth lineWidth; lr.endWidth lineWidth; lr.colorGradient lineGradient; }这样改完参数马上能看到效果不用每次进Play Mode重新验证调试效率会提升一大截。6. 把心电图线波做到能交付验证、优化与最后一个实用技巧6.1 用AnimationCurve直接手调单周期波形如果你不想和公式参数打交道还有一个更直观的做法把波形从代码合成改成AnimationCurve手绘。创建一个单周期波形曲线让x轴是0到1的相位y轴是振幅然后代码里直接Evaluate曲线得到采样值。这样做的好处是波形形状完全受控可以亲手画出想要的PQRST形态而且美术同事也能上手调整。public AnimationCurve waveShape AnimationCurve.Linear(0f, 0f, 1f, 0f); float CalculateYFromCurve(float ph) { return waveShape.Evaluate(Mathf.Repeat(ph, 1f)) * mainAmplitude; }用AnimationCurve的代价是振幅和速度分离得更明确曲线本身的y轴范围不建议写超出正负1的数值真正的振幅控制放到mainAmplitude统一管理。6.2 验证和优化让demo可以交付而不是只能跑在编辑器里交付前做两件事第一用Profiler跑一遍真机确认没有任何脚本在Update里分配堆内存波形动画的CPU占用低于1ms第二做参数回归验证——把scrollSpeed调到2.0持续跑5分钟再把mainAmplitude调到2.5跑5分钟确认没有波形穿模、颜色突变、线宽异常。我自己的习惯是所有波形相关参数固定到一个配置类里不同场景直接加载不同配置项同时保证波形组件即使在没有赋值的情况下也有默认参数不会在空引用上报错。最后说一个经验心电图线波这种效果越简单越可靠。不要为了追求炫酷往里面加粒子、加辉光、加动态模糊——加了这些以后在URP管线里就要引入后处理栈对移动端的开销和兼容性都是额外负担。把一条线的顶点、宽度、颜色、速度做到极致可信比叠加特效更能让对方信服。希望帮到你。本文还有配套的精品资源点击获取