Unity3D制作属性雷达图

代码生成雷达图的mesh。动态调整属性变化。自定义材质。

首先看看Demo效果：

• 点击Random Value按钮修改属性数值。
• 点击加减按钮修属性数量。

生成mesh的方式可以看Unity的官方help文档。

• 首先计算好所有顶点的坐标（vertices）。这一步里坐标Id尽量按顺序排列，方便后续工作。
• 然后计算出三角面的数组（triangles）。对应之前的顶点Id。顺时针是正面，逆时针是背面。三个数字一组。这两个搞定就能显示模型了。
• 最后可以加UV和顶点色。他们数组顺序跟顶点一致，所以一开始要想好顶点如何排列比较方便后面的计算。

为了方便动态修改雷达数据，我用了简单讨巧的方式。

• 首先生成容器列表，再生成点的列表。360度除以点的数量就是间隔角度，旋转容器角度就能获得每个点的位置。

• 之后动态调整数值就是通过修改点的Transform的本地坐标即可，不需要计算三角函数。
• 注意：动态修改mesh的时候只需要改已有参数即可，例如顶点坐标，uv，顶点色。而triangles没有改变所以不需要重设。

雷达图材质

• Demo里面我把背景图也用代码生成了。其实正式项目里一般都会用个画好的图片当背景的。所以只要制作雷达属性图的材质就好了。
• 一种是贴图片纹理：需要计算一下UV坐标，一般就是把贴图居中。
• 一种是直接填顶点色，这种就不用算uv坐标了。直接按照每个属性点与中心点的距离来算颜色。Demo里用的顶点色做法。

雷达图最终应用方式

camera渲染到RT

• camera设成depth模式，渲染到一张render texture。把render texture贴到material上，再填到UI的image里。
• 这个做法缺点是增加了渲染面积。优点是可以在RT里方便的设置抗锯齿。Demo里用的是RT的做法。

canvas设成camera模式

• 这个做法下只能用shader实现雷达图的抗锯齿效果了。

本文只介绍个大致做法，后续可以按项目需求继续细化。