Unity 画折线图

本文链接： https://blog.csdn.net/CC_childe/article/details/79551705

此处的 unity 版本为 5.6 ，不同的的版本，有些API可能不一样

Unity 在不使用第三方插件的前提下画折线图，目前比较好用的方法是用 Unity 自带的 LineRenderer 组件，别的不说，先上代码：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class TestLine : MonoBehaviour
{
    private LineRenderer lineRenderer;


    void Start()
    {
        lineRenderer = gameObject.GetComponent<LineRenderer>();

        lineRenderer.startColor = Color.red;    //折线开始时的颜色
        lineRenderer.endColor = Color.red;      //折现结束时的颜色
        lineRenderer.startWidth = 3f;        //折线开始时的宽度
        lineRenderer.endWidth = 3f;          //折线结束时的宽度
        lineRenderer.useWorldSpace = false;     //使用世界坐标还是本地坐标

        lineRenderer.positionCount = 5;
        lineRenderer.SetPosition(0, new Vector3(-300, 0));
        lineRenderer.SetPosition(1, new Vector3(-200, 60));
        lineRenderer.SetPosition(2, new Vector3(-100, -100));
        lineRenderer.SetPosition(3, new Vector3(0, -60));
        lineRenderer.SetPosition(4, new Vector3(100, -120));

        AddPosition(new Vector3(200, 20));
        AddPosition(new Vector3(300, 0));
    }

    // 此处需要注意的是，使用此方法前必须得保证前面至少已经有了一条直线，也就是说已经设置了两个点，不然
    // 系统会默认前两个点的位置为 Vector3.zero
    public void AddPosition(Vector3 v3)
    {   
        lineRenderer.positionCount++;
        lineRenderer.SetPosition(lineRenderer.positionCount - 1, v3);
    }

    public void ResetPosition(int index, Vector3 v3)
    {
        if (0 <= index && index <= lineRenderer.positionCount)
        {
            lineRenderer.SetPosition(index, v3);
        }
    }

    // 重新绘制一条折线，会替换原有的折线
    public void ResetPositions(Vector3[] v3s)
    {
        lineRenderer.SetPositions(v3s);
    }
}

当然，要想在屏幕上看到绘制的直线还要多走几步：

1、新建一个空的 gameObject，在这个 gameObject 上填加 LineRenderer 组件，设置好一个合适的 Materials，一张白色的图片生成的材质就好，然后将上述脚本同样挂在这个 gameObject 上面；

2、LineRenderer 使用的是空间坐标，不是屏幕坐标，所以他的本质就是一张空间的图片，我们要想在屏幕上显示得让摄像机照到，所以移动摄像机到一个合适的位置，运行，我们就能看到了；

3、以上是在 UGUI 的层面实现的，NGUI 同样能实现，只是需要动态设置好渲染层级。

以上是在摄像机设置成正交模式，size = 667，屏幕分辨率设置为 750 * 1334 下的效果。

猜你喜欢