美文网首页
Unity大屏化展示图表

Unity大屏化展示图表

作者: 玄策丶 | 来源:发表于2021-05-12 11:44 被阅读0次

公司前端不够用了,就用Unity帮忙做的WebGL网页大屏展示
Unity大屏化展示图表 ,包括饼状图、折线图、柱状图等很多好东西。

使用插件:XCharts
GitHub:https://github.com/monitor1394/unity-ugui-XCharts

1、柱状图

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using XCharts;
public class ViewServiceLength : SingletonMono<ViewServiceLength>
{
    BarChart barChart;

    string name = "服役人数";
    public void SetData(Dictionary<string, int> data)
    {
        barChart = GetComponent<BarChart>();

        //清除原有数据
        barChart.RemoveData();

        int maxIndex = 0;
        //添加横向轴
        foreach (var item in data)
        {
            barChart.AddXAxisData(item.Key);

            maxIndex = maxIndex > item.Value ? maxIndex : item.Value;
        }
        if (maxIndex > 10)
        {
            barChart.yAxis0.minMaxType = Axis.AxisMinMaxType.Default;
        }
        else
        {
            barChart.yAxis0.minMaxType = Axis.AxisMinMaxType.Custom;
            barChart.yAxes[0].max = 10;
        }


        barChart.xAxes[0].splitNumber = data.Count;
        barChart.xAxes[0].boundaryGap = true;
        barChart.yAxes[0].splitNumber = 5;
        barChart.yAxes[0].boundaryGap = false;

        barChart.AddSerie(SerieType.Bar, name);

        //样式
        barChart.series.GetSerie(0).barWidth = 0.2f;
        barChart.series.GetSerie(0).label.show = true;
        barChart.series.GetSerie(0).label.offset = new Vector3(0, 20, 0);
        barChart.series.GetSerie(0).itemStyle.toColor = new Color(255 / 255f, 184 / 255f, 0 / 255f, 1);
        barChart.series.GetSerie(0).itemStyle.color = new Color(255 / 255f, 139 / 255f, 0 / 255f, 1);

        barChart.series.GetSerie(0).label.textStyle.font = HttpGetMessage.Instance.defaultFont;
        barChart.series.GetSerie(0).label.textStyle.color = new Color(1, 1, 1, 1);

        foreach (int item in data.Values)
        {
            barChart.AddData(name, item);
        }
    }
}

2、折线图

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using XCharts;
public class ViewVacation : SingletonMono<ViewVacation>
{
    LineChart lineChart;

    string name = "人次";
    public void SetData(Dictionary<string, int> data)
    {
        lineChart = GetComponent<LineChart>();

        //清除所有数据
        lineChart.RemoveData();

        int maxIndex = 0;
        foreach (var item in data)
        {
            lineChart.AddXAxisData(item.Key);

            maxIndex = maxIndex > item.Value ? maxIndex : item.Value;

        }
        if (maxIndex > 10)
        {
            lineChart.yAxis0.minMaxType = Axis.AxisMinMaxType.Default;
        }
        else
        {
            lineChart.yAxis0.minMaxType = Axis.AxisMinMaxType.Custom;
            lineChart.yAxes[0].max = 10;
        }

        lineChart.xAxes[0].splitNumber = data.Count;
        lineChart.xAxes[0].boundaryGap = true;
        lineChart.yAxes[0].splitNumber = 5;
        lineChart.yAxes[0].boundaryGap = false;

        lineChart.AddSerie(SerieType.Line, name);

        lineChart.series.GetSerie(0).label.show = true;
        lineChart.series.GetSerie(0).label.offset = new Vector3(0, 20, 0);
        lineChart.series.GetSerie(0).itemStyle.color = new Color(102 / 255f, 233 / 255f, 198 / 255f, 1);

        lineChart.series.GetSerie(0).label.textStyle.font = HttpGetMessage.Instance.defaultFont;
        lineChart.series.GetSerie(0).label.textStyle.color = new Color(1, 1, 1, 1);

        lineChart.series.GetSerie(0).lineType = LineType.Smooth;

        foreach (int item in data.Values)
        {
            lineChart.AddData(name, item);
        }
    }
}

3、饼状图

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using XCharts;
public class ViewEducation : SingletonMono<ViewEducation>
{
    PieChart pieChart;

    string name = "人员学历";
    public void SetData(Dictionary<string, int> data)
    {
        pieChart = GetComponent<PieChart>();

        //清除原有数据
        pieChart.RemoveData();

        //pieChart.xAxes[0].splitNumber = data.Count;
        //pieChart.xAxes[0].boundaryGap = true;
        //pieChart.yAxes[0].splitNumber = 5;
        //pieChart.yAxes[0].boundaryGap = false;

        pieChart.AddSerie(SerieType.Pie, name);

        //样式
        pieChart.series.GetSerie(0).center = new float[2] { 0.5f, 0.3f };
        pieChart.series.GetSerie(0).radius = new float[2] { 0.1f, 80 };
        pieChart.series.GetSerie(0).label.show = true;
        pieChart.series.GetSerie(0).label.formatter = "{c}人   {d:f1}%/n {b}";
        //pieChart.series.GetSerie(0).label.offset = new Vector3(0, 20, 0);
        //pieChart.series.GetSerie(0).itemStyle.toColor = new Color(255 / 255f, 184 / 255f, 0 / 255f, 1);
        //pieChart.series.GetSerie(0).itemStyle.color = new Color(255 / 255f, 139 / 255f, 0 / 255f, 1);

        pieChart.series.GetSerie(0).label.textStyle.font = HttpGetMessage.Instance.defaultFont;
        pieChart.series.GetSerie(0).label.textStyle.color = new Color(1, 1, 1, 1);

        pieChart.series.GetSerie(0).label.lineLength2 = 40;

        foreach (var item in data)
        {
            pieChart.AddData(0, item.Value, item.Key);
        }
    }
}

4、列表

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class ViewOrganization : SingletonMono<ViewOrganization>
{
    GameObject Item;
    GameObject Content;
    Dictionary<string, GameObject> items;

    private void Start()
    {
        Content = transform.Find("Viewport/Content").gameObject;
        Item = transform.Find("Viewport/Content/Item").gameObject;
        items = new Dictionary<string, GameObject>();
    }

    public void SetData(Dictionary<string, int> data)
    {
        foreach (var item in items)
        {
            GameObject.Destroy(item.Value);
        }
        items.Clear();

        int index = 0;
        foreach (var item in data)
        {
            GameObject obj = GameObject.Instantiate(Item);
            items.Add(item.Key, obj);
            //obj.transform.parent = Content.transform;
            obj.transform.SetParent(Content.transform);
            obj.GetComponent<RectTransform>().localPosition = new Vector3(0, 0, 0);
            obj.transform.localScale = new Vector3(1, 1, 1);
            int color = index % 2 == 1 ? 0 : 1;
            SetItem(obj, item.Key, item.Value, color);
            index++;
        }
    }

    void SetItem(GameObject obj,string key,int value,int color)
    {
        Image bg = obj.GetComponent<Image>();
        Text textKey = obj.transform.Find("Text_Key").GetComponent<Text>();
        Text textValue = obj.transform.Find("Text_Value").GetComponent<Text>();
        textKey.text = key;
        textValue.text = value.ToString();
        bg.color = new Color(1, 1, 1, color);
        obj.SetActive(true);
    }
}

相关文章

网友评论

      本文标题:Unity大屏化展示图表

      本文链接:https://www.haomeiwen.com/subject/xlcadltx.html