调整代码结构

Scripts/UI/Component/Main/Axis.cs

@@ -0,0 +1,788 @@
+using System.Net.Mime;
+using System;
+using System.Collections.Generic;
+using UnityEngine;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// The axis in rectangular coordinate.
+    /// 直角坐标系的坐标轴组件。
+    /// </summary>
+    [System.Serializable]
+    public class Axis : JsonDataSupport, IEquatable<Axis>
+    {
+        /// <summary>
+        /// the type of axis.
+        /// 坐标轴类型。
+        /// </summary>
+        public enum AxisType
+        {
+            /// <summary>
+            /// Numerical axis, suitable for continuous data.
+            /// 数值轴，适用于连续数据。
+            /// </summary>
+            Value,
+            /// <summary>
+            /// Category axis, suitable for discrete category data. Data should only be set via data for this type.
+            /// 类目轴，适用于离散的类目数据，为该类型时必须通过 data 设置类目数据。
+            /// </summary>
+            Category
+        }
+
+        /// <summary>
+        /// the type of axis min and max value.
+        /// 坐标轴最大最小刻度显示类型。
+        /// </summary>
+        public enum AxisMinMaxType
+        {
+            /// <summary>
+            /// 0 - maximum.
+            /// 0-最大值。
+            /// </summary>
+            Default,
+            /// <summary>
+            /// minimum - maximum.
+            /// 最小值-最大值。
+            /// </summary>
+            MinMax,
+            /// <summary>
+            /// Customize the minimum and maximum.
+            /// 自定义最小值最大值。
+            /// </summary>
+            Custom
+        }
+
+        /// <summary>
+        /// the type of split line. 
+        /// 分割线类型
+        /// </summary>
+        public enum SplitLineType
+        {
+            /// <summary>
+            /// 不显示分割线
+            /// </summary>
+            None,
+            /// <summary>
+            /// 实线
+            /// </summary>
+            Solid,
+            /// <summary>
+            /// 虚线
+            /// </summary>
+            Dashed,
+            /// <summary>
+            /// 点线
+            /// </summary>
+            Dotted,
+            /// <summary>
+            /// 点划线
+            /// </summary>
+            DashDot,
+            /// <summary>
+            /// 双点划线
+            /// </summary>
+            DashDotDot
+        }
+
+        [SerializeField] protected bool m_Show = true;
+        [SerializeField] protected AxisType m_Type;
+        [SerializeField] protected AxisMinMaxType m_MinMaxType;
+        [SerializeField] protected int m_Min;
+        [SerializeField] protected int m_Max;
+        [SerializeField] protected int m_SplitNumber = 5;
+        [SerializeField] protected float m_Interval = 0;
+        [SerializeField] protected bool m_ShowSplitLine = false;
+        [SerializeField] protected SplitLineType m_SplitLineType = SplitLineType.Dashed;
+        [SerializeField] protected bool m_BoundaryGap = true;
+        [SerializeField] protected int m_MaxCache = 0;
+        [SerializeField] protected List<string> m_Data = new List<string>();
+        [SerializeField] protected AxisLine m_AxisLine = AxisLine.defaultAxisLine;
+        [SerializeField] protected AxisName m_AxisName = AxisName.defaultAxisName;
+        [SerializeField] protected AxisTick m_AxisTick = AxisTick.defaultTick;
+        [SerializeField] protected AxisLabel m_AxisLabel = AxisLabel.defaultAxisLabel;
+        [SerializeField] protected AxisSplitArea m_SplitArea = AxisSplitArea.defaultSplitArea;
+
+        [NonSerialized] private float m_ValueRange;
+        [NonSerialized] private bool m_NeedUpdateFilterData;
+
+        /// <summary>
+        /// Set this to false to prevent the axis from showing.
+        /// 是否显示坐标轴。
+        /// </summary>
+        public bool show { get { return m_Show; } set { m_Show = value; } }
+        /// <summary>
+        /// the type of axis. 
+        /// 坐标轴类型。
+        /// </summary>
+        public AxisType type { get { return m_Type; } set { m_Type = value; } }
+        /// <summary>
+        /// the type of axis minmax.
+        /// 坐标轴刻度最大最小值显示类型。
+        /// </summary>
+        public AxisMinMaxType minMaxType { get { return m_MinMaxType; } set { m_MinMaxType = value; } }
+        /// <summary>
+        /// The minimun value of axis.
+        /// 设定的坐标轴刻度最小值，当minMaxType为Custom时有效。
+        /// </summary>
+        public int min { get { return m_Min; } set { m_Min = value; } }
+        /// <summary>
+        /// The maximum value of axis.
+        /// 设定的坐标轴刻度最大值，当minMaxType为Custom时有效。
+        /// </summary>
+        public int max { get { return m_Max; } set { m_Max = value; } }
+        /// <summary>
+        /// Number of segments that the axis is split into.
+        /// 坐标轴的分割段数。
+        /// </summary>
+        public int splitNumber { get { return m_SplitNumber; } set { m_SplitNumber = value; } }
+        /// <summary>
+        /// 强制设置坐标轴分割间隔。无法在类目轴中使用。
+        /// Compulsively set segmentation interval for axis.This is unavailable for category axis.
+        /// </summary>
+        public float interval { get { return m_Interval; } set { m_Interval = value; } }
+        /// <summary>
+        /// showSplitLineSet this to false to prevent the splitLine from showing. value type axes are shown by default, while category type axes are hidden.
+        /// 是否显示分隔线。默认数值轴显示，类目轴不显示。
+        /// </summary>
+        public bool showSplitLine { get { return m_ShowSplitLine; } set { m_ShowSplitLine = value; } }
+        /// <summary>
+        /// the type of split line. 
+        /// 分割线类型。
+        /// </summary>
+        public SplitLineType splitLineType { get { return m_SplitLineType; } set { m_SplitLineType = value; } }
+        /// <summary>
+        /// The boundary gap on both sides of a coordinate axis. 
+        /// 坐标轴两边是否留白。
+        /// </summary>
+        public bool boundaryGap { get { return m_BoundaryGap; } set { m_BoundaryGap = value; } }
+        /// <summary>
+        /// The max number of axis data cache.
+        /// The first data will be remove when the size of axis data is larger then maxCache.
+        /// 可缓存的最大数据量。默认为0没有限制，大于0时超过指定值会移除旧数据再插入新数据。
+        /// </summary>
+        public int maxCache { get { return m_MaxCache; } set { m_MaxCache = value < 0 ? 0 : value; } }
+        /// <summary>
+        /// Category data, available in type: 'Category' axis.
+        /// 类目数据，在类目轴（type: 'category'）中有效。
+        /// </summary>
+        public List<string> data { get { return m_Data; } set { if (value != null) m_Data = value; } }
+        /// <summary>
+        /// axis Line.
+        /// 坐标轴轴线。
+        /// </summary>
+        public AxisLine axisLine { get { return m_AxisLine; } set { m_AxisLine = value; } }
+        /// <summary>
+        /// axis name.
+        /// 坐标轴名称。
+        /// </summary>
+        public AxisName axisName { get { return m_AxisName; } set { m_AxisName = value; } }
+        /// <summary>
+        /// axis tick.
+        /// 坐标轴刻度。
+        /// </summary>
+        public AxisTick axisTick { get { return m_AxisTick; } set { m_AxisTick = value; } }
+        /// <summary>
+        /// axis label.
+        /// 坐标轴刻度标签。
+        /// </summary>
+        public AxisLabel axisLabel { get { return m_AxisLabel; } set { m_AxisLabel = value; } }
+        /// <summary>
+        /// axis split area.
+        /// 坐标轴分割区域。
+        /// </summary>
+        public AxisSplitArea splitArea { get { return m_SplitArea; } set { m_SplitArea = value; } }
+        /// <summary>
+        /// the axis label text list. 
+        /// 坐标轴刻度标签的Text列表。
+        /// </summary>
+        public List<Text> axisLabelTextList { get { return m_AxisLabelTextList; } set { m_AxisLabelTextList = value; } }
+        /// <summary>
+        /// the current minimun value.
+        /// 当前最小值。
+        /// </summary>
+        public float minValue { get; set; }
+        /// <summary>
+        /// the current maximum value.
+        /// 当前最大值。
+        /// </summary>
+        public float maxValue { get; set; }
+        /// <summary>
+        /// the x offset of zero position.
+        /// 坐标轴原点在X轴的偏移。
+        /// </summary>
+        public float zeroXOffset { get; set; }
+        /// <summary>
+        /// the y offset of zero position.
+        /// 坐标轴原点在Y轴的偏移。
+        /// </summary>
+        public float zeroYOffset { get; set; }
+
+        private int filterStart;
+        private int filterEnd;
+        private List<string> filterData;
+        private List<Text> m_AxisLabelTextList = new List<Text>();
+        private GameObject m_TooltipLabel;
+        private Text m_TooltipLabelText;
+        private RectTransform m_TooltipLabelRect;
+
+        public void Copy(Axis other)
+        {
+            m_Show = other.show;
+            m_Type = other.type;
+            m_Min = other.min;
+            m_Max = other.max;
+            m_SplitNumber = other.splitNumber;
+            m_Interval = other.interval;
+
+            m_ShowSplitLine = other.showSplitLine;
+            m_SplitLineType = other.splitLineType;
+            m_BoundaryGap = other.boundaryGap;
+            m_AxisName.Copy(other.axisName);
+            m_AxisLabel.Copy(other.axisLabel);
+            m_Data.Clear();
+            m_Data.Capacity = m_Data.Count;
+            foreach (var d in other.data) m_Data.Add(d);
+        }
+
+        /// <summary>
+        /// 清空类目数据
+        /// </summary>
+        public void ClearData()
+        {
+            m_Data.Clear();
+        }
+
+        /// <summary>
+        /// 当前坐标轴是否时类目轴
+        /// </summary>
+        /// <returns></returns>
+        public bool IsCategory()
+        {
+            return type == AxisType.Category;
+        }
+
+        /// <summary>
+        /// 当前坐标轴是否时数值轴
+        /// </summary>
+        /// <returns></returns>
+        public bool IsValue()
+        {
+            return type == AxisType.Value;
+        }
+
+        /// <summary>
+        /// 添加一个类目到类目数据列表
+        /// </summary>
+        /// <param name="category"></param>
+        public void AddData(string category)
+        {
+            if (maxCache > 0)
+            {
+                while (m_Data.Count > maxCache)
+                {
+                    m_NeedUpdateFilterData = true;
+                    m_Data.RemoveAt(0);
+                }
+            }
+            m_Data.Add(category);
+        }
+
+        /// <summary>
+        /// 获得在dataZoom范围内指定索引的类目数据
+        /// </summary>
+        /// <param name="index">类目数据索引</param>
+        /// <param name="dataZoom">区域缩放</param>
+        /// <returns></returns>
+        public string GetData(int index, DataZoom dataZoom)
+        {
+            var showData = GetDataList(dataZoom);
+            if (index >= 0 && index < showData.Count)
+                return showData[index];
+            else
+                return "";
+        }
+
+        /// <summary>
+        /// 获得指定区域缩放的类目数据列表
+        /// </summary>
+        /// <param name="dataZoom">区域缩放</param>
+        /// <returns></returns>
+        public List<string> GetDataList(DataZoom dataZoom)
+        {
+            if (dataZoom != null && dataZoom.enable)
+            {
+                var startIndex = (int)((data.Count - 1) * dataZoom.start / 100);
+                var endIndex = (int)((data.Count - 1) * dataZoom.end / 100);
+                var count = endIndex == startIndex ? 1 : endIndex - startIndex + 1;
+                UpdateFilterData(dataZoom);
+                return filterData;
+            }
+            else
+            {
+                return m_Data;
+            }
+        }
+
+        private List<string> emptyFliter = new List<string>();
+        /// <summary>
+        /// 更新dataZoom对应的类目数据列表
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        public void UpdateFilterData(DataZoom dataZoom)
+        {
+            if (dataZoom != null && dataZoom.enable)
+            {
+                var startIndex = (int)((data.Count - 1) * dataZoom.start / 100);
+                var endIndex = (int)((data.Count - 1) * dataZoom.end / 100);
+                if (startIndex != filterStart || endIndex != filterEnd || m_NeedUpdateFilterData)
+                {
+                    filterStart = startIndex;
+                    filterEnd = endIndex;
+                    m_NeedUpdateFilterData = false;
+                    if (m_Data.Count > 0)
+                    {
+                        var count = endIndex == startIndex ? 1 : endIndex - startIndex + 1;
+                        filterData = m_Data.GetRange(startIndex, count);
+                    }
+                    else
+                    {
+                        filterData = m_Data;
+                    }
+                }
+                else if (endIndex == 0)
+                {
+                    filterData = emptyFliter;
+                }
+            }
+        }
+
+        /// <summary>
+        /// 获得分割段数
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public int GetSplitNumber(float coordinateWid, DataZoom dataZoom)
+        {
+            if (type == AxisType.Value)
+            {
+                if (m_Interval > 0)
+                {
+                    if (coordinateWid <= 0) return 0;
+                    int num = Mathf.CeilToInt(m_ValueRange / m_Interval) + 1;
+                    int maxNum = Mathf.CeilToInt(coordinateWid / 15);
+                    if (num > maxNum)
+                    {
+                        m_Interval = m_ValueRange / (maxNum - 1);
+                        num = Mathf.CeilToInt(m_ValueRange / m_Interval) + 1;
+                    }
+                    return num;
+                }
+                else return m_SplitNumber;
+            }
+            int dataCount = GetDataList(dataZoom).Count;
+            if (m_SplitNumber <= 0) return dataCount;
+            if (dataCount > 2 * m_SplitNumber || dataCount <= 0)
+                return m_SplitNumber;
+            else
+                return dataCount;
+        }
+
+        /// <summary>
+        /// 获得分割段的宽度
+        /// </summary>
+        /// <param name="coordinateWidth"></param>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public float GetSplitWidth(float coordinateWidth, DataZoom dataZoom)
+        {
+            int split = GetSplitNumber(coordinateWidth, dataZoom);
+            int segment = (m_BoundaryGap ? split : split - 1);
+            segment = segment <= 0 ? 1 : segment;
+            return coordinateWidth / segment;
+        }
+
+        /// <summary>
+        /// 获得类目数据个数
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public int GetDataNumber(DataZoom dataZoom)
+        {
+            return GetDataList(dataZoom).Count;
+        }
+
+        /// <summary>
+        /// 获得一个类目数据在坐标系中代表的宽度
+        /// </summary>
+        /// <param name="coordinateWidth"></param>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public float GetDataWidth(float coordinateWidth, DataZoom dataZoom)
+        {
+            var dataCount = GetDataNumber(dataZoom);
+            int segment = (m_BoundaryGap ? dataCount : dataCount - 1);
+            segment = segment <= 0 ? 1 : segment;
+            return coordinateWidth / segment;
+        }
+
+        /// <summary>
+        /// 获得标签显示的名称
+        /// </summary>
+        /// <param name="index"></param>
+        /// <param name="minValue"></param>
+        /// <param name="maxValue"></param>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public string GetLabelName(float coordinateWidth, int index, float minValue, float maxValue, DataZoom dataZoom)
+        {
+            int split = GetSplitNumber(coordinateWidth, dataZoom);
+            if (m_Type == AxisType.Value)
+            {
+                float value = 0;
+                if (m_Interval > 0)
+                {
+                    if (index == split - 1) value = maxValue;
+                    else value = minValue + index * m_Interval;
+                }
+                else
+                {
+                    value = (minValue + (maxValue - minValue) * index / (split - 1));
+                }
+                return m_AxisLabel.GetFormatterContent(value);
+            }
+            var showData = GetDataList(dataZoom);
+            int dataCount = showData.Count;
+            if (dataCount <= 0) return "";
+
+            if (index == split - 1 && !m_BoundaryGap)
+            {
+                return m_AxisLabel.GetFormatterContent(showData[dataCount - 1]);
+            }
+            else
+            {
+                float rate = dataCount / split;
+                if (rate < 1) rate = 1;
+                int offset = m_BoundaryGap ? (int)(rate / 2) : 0;
+                int newIndex = (int)(index * rate >= dataCount - 1 ?
+                    dataCount - 1 : offset + index * rate);
+                return m_AxisLabel.GetFormatterContent(showData[newIndex]);
+            }
+        }
+
+        /// <summary>
+        /// 获得分割线条数
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public int GetScaleNumber(float coordinateWidth, DataZoom dataZoom)
+        {
+            if (type == AxisType.Value)
+            {
+                int splitNum = GetSplitNumber(coordinateWidth, dataZoom);
+                return m_BoundaryGap ? splitNum + 1 : splitNum;
+            }
+            else
+            {
+                var showData = GetDataList(dataZoom);
+                int dataCount = showData.Count;
+                if (m_SplitNumber <= 0) return m_BoundaryGap ? dataCount + 1 : dataCount;
+                if (dataCount > 2 * splitNumber || dataCount <= 0)
+                    return m_BoundaryGap ? m_SplitNumber + 1 : m_SplitNumber;
+                else
+                    return m_BoundaryGap ? dataCount + 1 : dataCount;
+            }
+        }
+
+        /// <summary>
+        /// 获得分割段宽度
+        /// </summary>
+        /// <param name="coordinateWidth"></param>
+        /// <param name="dataZoom"></param>
+        /// <returns></returns>
+        public float GetScaleWidth(float coordinateWidth, int index, DataZoom dataZoom)
+        {
+            int num = GetScaleNumber(coordinateWidth, dataZoom) - 1;
+            if (num <= 0) num = 1;
+            if (type == AxisType.Value && m_Interval > 0)
+            {
+                if (index == num - 1) return coordinateWidth - (num - 1) * m_Interval * coordinateWidth / m_ValueRange;
+                else return m_Interval * coordinateWidth / m_ValueRange;
+            }
+            else
+            {
+                return coordinateWidth / num;
+            }
+
+        }
+
+        /// <summary>
+        /// 更新刻度标签文字
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        public void UpdateLabelText(float coordinateWidth, DataZoom dataZoom)
+        {
+            for (int i = 0; i < axisLabelTextList.Count; i++)
+            {
+                if (axisLabelTextList[i] != null)
+                {
+                    axisLabelTextList[i].text = GetLabelName(coordinateWidth, i, minValue, maxValue, dataZoom);
+                }
+            }
+        }
+
+        public void SetTooltipLabel(GameObject label)
+        {
+            m_TooltipLabel = label;
+            m_TooltipLabelRect = label.GetComponent<RectTransform>();
+            m_TooltipLabelText = label.GetComponentInChildren<Text>();
+            m_TooltipLabel.SetActive(true);
+        }
+
+        public void SetTooltipLabelColor(Color bgColor, Color textColor)
+        {
+            m_TooltipLabel.GetComponent<Image>().color = bgColor;
+            m_TooltipLabelText.color = textColor;
+        }
+
+        public void SetTooltipLabelActive(bool flag)
+        {
+            if (m_TooltipLabel && m_TooltipLabel.activeInHierarchy != flag)
+            {
+                m_TooltipLabel.SetActive(flag);
+            }
+        }
+
+        public void UpdateTooptipLabelText(string text)
+        {
+            if (m_TooltipLabelText)
+            {
+                m_TooltipLabelText.text = text;
+                m_TooltipLabelRect.sizeDelta = new Vector2(m_TooltipLabelText.preferredWidth + 8,
+                    m_TooltipLabelText.preferredHeight + 8);
+            }
+        }
+
+        public void UpdateTooltipLabelPos(Vector2 pos)
+        {
+            if (m_TooltipLabel)
+            {
+                m_TooltipLabel.transform.localPosition = pos;
+            }
+        }
+
+        /// <summary>
+        /// 调整最大最小值
+        /// </summary>
+        /// <param name="minValue"></param>
+        /// <param name="maxValue"></param>
+        public void AdjustMinMaxValue(ref int minValue, ref int maxValue)
+        {
+            if (minMaxType == Axis.AxisMinMaxType.Custom)
+            {
+                if (min != 0 || max != 0)
+                {
+                    minValue = min;
+                    maxValue = max;
+                }
+            }
+            else
+            {
+                switch (minMaxType)
+                {
+                    case Axis.AxisMinMaxType.Default:
+                        if (minValue > 0 && maxValue > 0)
+                        {
+                            minValue = 0;
+                            maxValue = ChartHelper.GetMaxDivisibleValue(maxValue);
+                        }
+                        else if (minValue < 0 && maxValue < 0)
+                        {
+                            minValue = ChartHelper.GetMinDivisibleValue(minValue);
+                            maxValue = 0;
+                        }
+                        else
+                        {
+                            minValue = ChartHelper.GetMinDivisibleValue(minValue);
+                            maxValue = ChartHelper.GetMaxDivisibleValue(maxValue);
+                        }
+                        break;
+                    case Axis.AxisMinMaxType.MinMax:
+                        minValue = ChartHelper.GetMinDivisibleValue(minValue);
+                        maxValue = ChartHelper.GetMaxDivisibleValue(maxValue);
+                        break;
+                }
+            }
+            m_ValueRange = maxValue - minValue;
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is Axis)
+            {
+                return Equals((Axis)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(Axis other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return show == other.show &&
+                type == other.type &&
+                min == other.min &&
+                max == other.max &&
+                splitNumber == other.splitNumber &&
+                interval == other.interval &&
+                showSplitLine == other.showSplitLine &&
+                m_AxisLabel.Equals(other.axisLabel) &&
+                splitLineType == other.splitLineType &&
+                boundaryGap == other.boundaryGap &&
+                axisName.Equals(other.axisName) &&
+                ChartHelper.IsValueEqualsList<string>(m_Data, other.data);
+        }
+
+        public static bool operator ==(Axis left, Axis right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(Axis left, Axis right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+
+        public override void ParseJsonData(string jsonData)
+        {
+            if (string.IsNullOrEmpty(jsonData) || !m_DataFromJson) return;
+            m_Data = ChartHelper.ParseStringFromString(jsonData);
+        }
+    }
+
+    /// <summary>
+    /// The x axis in cartesian(rectangular) coordinate. a grid component can place at most 2 x axis, 
+    /// one on the bottom and another on the top.
+    /// <para>直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。</para>
+    /// </summary>
+    [System.Serializable]
+    public class XAxis : Axis
+    {
+        public XAxis Clone()
+        {
+            var axis = XAxisPool.Get();
+            axis.show = show;
+            axis.type = type;
+            axis.min = min;
+            axis.max = max;
+            axis.splitNumber = splitNumber;
+            axis.interval = interval;
+
+            axis.showSplitLine = showSplitLine;
+            axis.splitLineType = splitLineType;
+            axis.boundaryGap = boundaryGap;
+            axis.axisName.Copy(axisName);
+            axis.axisLabel.Copy(axisLabel);
+            axis.data.Clear();
+            if (axis.data.Capacity < data.Count) axis.data.Capacity = data.Count;
+            foreach (var d in data) axis.data.Add(d);
+            return axis;
+        }
+
+        public static XAxis defaultXAxis
+        {
+            get
+            {
+                var axis = new XAxis
+                {
+                    m_Show = true,
+                    m_Type = AxisType.Category,
+                    m_Min = 0,
+                    m_Max = 0,
+                    m_SplitNumber = 5,
+                    m_ShowSplitLine = false,
+                    m_SplitLineType = SplitLineType.Dashed,
+                    m_BoundaryGap = true,
+                    m_Data = new List<string>()
+                    {
+                        "x1","x2","x3","x4","x5"
+                    }
+                };
+                return axis;
+            }
+        }
+    }
+
+    /// <summary>
+    /// The x axis in cartesian(rectangular) coordinate. a grid component can place at most 2 x axis, 
+    /// one on the bottom and another on the top.
+    /// <para>直角坐标系 grid 中的 y 轴，单个 grid 组件最多只能放左右两个 y 轴</para>
+    /// </summary>
+    [System.Serializable]
+    public class YAxis : Axis
+    {
+        public YAxis Clone()
+        {
+            var axis = YAxisPool.Get();
+            axis.show = show;
+            axis.type = type;
+            axis.min = min;
+            axis.max = max;
+            axis.splitNumber = splitNumber;
+            axis.interval = interval;
+
+            axis.showSplitLine = showSplitLine;
+            axis.splitLineType = splitLineType;
+            axis.boundaryGap = boundaryGap;
+            axis.axisName.Copy(axisName);
+            axis.axisLabel.Copy(axisLabel);
+            axis.data.Clear();
+            if (axis.data.Capacity < data.Count) axis.data.Capacity = data.Count;
+            foreach (var d in data) axis.data.Add(d);
+            return axis;
+        }
+
+        public static YAxis defaultYAxis
+        {
+            get
+            {
+                var axis = new YAxis
+                {
+                    m_Show = true,
+                    m_Type = AxisType.Value,
+                    m_Min = 0,
+                    m_Max = 0,
+                    m_SplitNumber = 5,
+                    m_ShowSplitLine = true,
+                    m_SplitLineType = SplitLineType.Dashed,
+                    m_BoundaryGap = false,
+                    m_Data = new List<string>(5),
+                };
+                return axis;
+            }
+        }
+    }
+}

Scripts/UI/Component/Main/Axis.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: f4e87b6a821d94304af45b2955c293bb
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/DataZoom.cs

@@ -0,0 +1,339 @@
+using UnityEngine;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// DataZoom component is used for zooming a specific area,
+    /// which enables user to investigate data in detail,
+    /// or get an overview of the data, or get rid of outlier points.
+    /// <para>DataZoom 组件 用于区域缩放，从而能自由关注细节的数据信息，或者概览数据整体，或者去除离群点的影响。</para>
+    /// </summary>
+    [System.Serializable]
+    public class DataZoom
+    {
+        /// <summary>
+        /// Generally dataZoom component zoom or roam coordinate system through data filtering
+        /// and set the windows of axes internally.
+        /// Its behaviours vary according to filtering mode settings.
+        /// dataZoom 的运行原理是通过 数据过滤 来达到 数据窗口缩放 的效果。数据过滤模式的设置不同，效果也不同。
+        /// </summary>
+        public enum FilterMode
+        {
+            /// <summary>
+            /// data that outside the window will be filtered, which may lead to some changes of windows of other axes.
+            /// For each data item, it will be filtered if one of the relevant dimensions is out of the window.
+            /// 当前数据窗口外的数据，被 过滤掉。即 会 影响其他轴的数据范围。每个数据项，只要有一个维度在数据窗口外，整个数据项就会被过滤掉。
+            /// </summary>
+            Filter,
+            /// <summary>
+            /// data that outside the window will be filtered, which may lead to some changes of windows of other axes.
+            /// For each data item, it will be filtered only if all of the relevant dimensions are out of the same side of the window.
+            /// 当前数据窗口外的数据，被 过滤掉。即 会 影响其他轴的数据范围。每个数据项，只有当全部维度都在数据窗口同侧外部，整个数据项才会被过滤掉。
+            /// </summary>
+            WeakFilter,
+            /// <summary>
+            /// data that outside the window will be set to NaN, which will not lead to changes of windows of other axes. 
+            /// 当前数据窗口外的数据，被 设置为空。即 不会 影响其他轴的数据范围。
+            /// </summary>
+            Empty,
+            /// <summary>
+            /// Do not filter data.
+            /// 不过滤数据，只改变数轴范围。
+            /// </summary>
+            None
+        }
+        /// <summary>
+        /// The value type of start and end.取值类型
+        /// </summary>
+        public enum RangeMode
+        {
+            //Value,
+            /// <summary>
+            /// percent value. 百分比
+            /// </summary>
+            Percent
+        }
+        [SerializeField] private bool m_Enable;
+        [SerializeField] private FilterMode m_FilterMode;
+        [SerializeField] private int m_XAxisIndex;
+        [SerializeField] private int m_YAxisIndex;
+        [SerializeField] private bool m_SupportInside;
+        [SerializeField] private bool m_SupportSlider;
+        [SerializeField] private bool m_SupportSelect;
+        [SerializeField] private bool m_ShowDataShadow;
+        [SerializeField] private bool m_ShowDetail;
+        [SerializeField] private bool m_ZoomLock;
+        [SerializeField] private bool m_Realtime;
+        [SerializeField] private Color m_BackgroundColor;
+        [SerializeField] private float m_Height;
+        [SerializeField] private float m_Bottom;
+        [SerializeField] private RangeMode m_RangeMode;
+        [SerializeField] private float m_Start;
+        [SerializeField] private float m_End;
+        [SerializeField] private float m_StartValue;
+        [SerializeField] private float m_EndValue;
+        [Range(1f, 20f)]
+        [SerializeField] private float m_ScrollSensitivity = 1.1f;
+        [SerializeField] private int m_FontSize = 18;
+        [SerializeField] private FontStyle m_FontStyle;
+
+        /// <summary>
+        /// Whether to show dataZoom. 
+        /// 是否显示缩放区域。
+        /// </summary>
+        public bool enable { get { return m_Enable; } set { m_Enable = value; } }
+        /// <summary>
+        /// The mode of data filter. 
+        /// 数据过滤类型。
+        /// </summary>
+        public FilterMode filterMode { get { return m_FilterMode; } set { m_FilterMode = value; } }
+        /// <summary>
+        /// Specify which xAxis is controlled by the dataZoom. 
+        /// 控制哪一个 x 轴。
+        /// </summary>
+        public int xAxisIndex { get { return m_XAxisIndex; } set { m_XAxisIndex = value; } }
+        /// <summary>
+        /// Specify which yAxis is controlled by the dataZoom. 
+        /// 控制哪一个 y 轴。
+        /// </summary>
+        public int yAxisIndex { get { return m_YAxisIndex; } set { m_YAxisIndex = value; } }
+        /// <summary>
+        /// 是否支持内置。内置于坐标系中，使用户可以在坐标系上通过鼠标拖拽、鼠标滚轮、手指滑动（触屏上）来缩放或漫游坐标系。
+        /// </summary>
+        public bool supportInside { get { return m_SupportInside; } set { m_SupportInside = value; } }
+        /// <summary>
+        /// 是否支持滑动条。有单独的滑动条，用户在滑动条上进行缩放或漫游。
+        /// </summary>
+        public bool supportSlider { get { return m_SupportSlider; } set { m_SupportSlider = value; } }
+        /// <summary>
+        /// 是否支持框选。提供一个选框进行数据区域缩放。
+        /// </summary>
+        private bool supportSelect { get { return m_SupportSelect; } set { m_SupportSelect = value; } }
+        /// <summary>
+        /// Whether to show data shadow, to indicate the data tendency in brief.
+        /// default:true
+        /// 是否显示数据阴影。数据阴影可以简单地反应数据走势。
+        /// </summary>
+        public bool showDataShadow { get { return m_ShowDataShadow; } set { m_ShowDataShadow = value; } }
+        /// <summary>
+        /// Whether to show detail, that is, show the detailed data information when dragging.
+        /// 是否显示detail，即拖拽时候显示详细数值信息。
+        /// </summary>
+        public bool showDetail { get { return m_ShowDetail; } set { m_ShowDetail = value; } }
+        /// <summary>
+        /// Specify whether to lock the size of window (selected area).
+        /// default:false
+        /// 是否锁定选择区域（或叫做数据窗口）的大小。
+        /// 如果设置为 true 则锁定选择区域的大小，也就是说，只能平移，不能缩放。
+        /// </summary>
+        public bool zoomLock { get { return m_ZoomLock; } set { m_ZoomLock = value; } }
+        /// <summary>
+        /// Whether to show data shadow in dataZoom-silder component, to indicate the data tendency in brief.
+        /// default:true
+        /// 拖动时，是否实时更新系列的视图。如果设置为 false，则只在拖拽结束的时候更新。默认为true，暂不支持修改。
+        /// </summary>
+        public bool realtime { get { return true; } }
+        /// <summary>
+        /// The background color of the component.
+        /// 组件的背景颜色。
+        /// </summary>
+        private Color backgroundColor { get { return m_BackgroundColor; } set { m_BackgroundColor = value; } }
+        /// <summary>
+        /// Distance between dataZoom component and the bottom side of the container.
+        /// bottom value is a instant pixel value like 10.
+        /// default:10
+        /// 组件离容器下侧的距离。
+        /// </summary>
+        public float bottom { get { return m_Bottom; } set { m_Bottom = value; } }
+        /// <summary>
+        /// The height of dataZoom component.
+        /// height value is a instant pixel value like 10.
+        /// default:50
+        /// 组件高度。
+        /// </summary>
+        public float height { get { return m_Height; } set { m_Height = value; } }
+        /// <summary>
+        /// Use absolute value or percent value in DataZoom.start and DataZoom.end.
+        /// default:RangeMode.Percent.
+        /// 取绝对值还是百分比。
+        /// </summary>
+        public RangeMode rangeMode { get { return m_RangeMode; } set { m_RangeMode = value; } }
+        /// <summary>
+        /// The start percentage of the window out of the data extent, in the range of 0 ~ 100.
+        /// default:30
+        /// 数据窗口范围的起始百分比。范围是：0 ~ 100。
+        /// </summary>
+        public float start
+        {
+            get { return m_Start; }
+            set { m_Start = value; if (m_Start < 0) m_Start = 0; if (m_Start > 100) m_Start = 100; }
+        }
+        /// <summary>
+        /// The end percentage of the window out of the data extent, in the range of 0 ~ 100.
+        /// default:70
+        /// 数据窗口范围的结束百分比。范围是：0 ~ 100。
+        /// </summary>
+        public float end
+        {
+            get { return m_End; }
+            set { m_End = value; if (m_End < 0) m_End = 0; if (m_End > 100) m_End = 100; }
+        }
+        /// <summary>
+        /// The sensitivity of dataZoom scroll.
+        /// The larger the number, the more sensitive it is.
+        /// default:10
+        /// 缩放区域组件的敏感度。值越高每次缩放所代表的数据越多。
+        /// </summary>
+        public float scrollSensitivity { get { return m_ScrollSensitivity; } set { m_ScrollSensitivity = value; } }
+        /// <summary>
+        /// font size.
+        /// 文字的字体大小。
+        /// </summary>
+        public int fontSize { get { return m_FontSize; } set { m_FontSize = value; } }
+        /// <summary>
+        /// font style.
+        /// 文字字体的风格。
+        /// </summary>
+        public FontStyle fontStyle { get { return m_FontStyle; } set { m_FontStyle = value; } }
+
+        /// <summary>
+        /// The start label.
+        /// 组件的开始信息文本。
+        /// </summary>
+        public Text startLabel { get; set; }
+        /// <summary>
+        /// The end label.
+        /// 组件的结束信息文本。
+        /// </summary>
+        public Text endLabel { get; set; }
+
+        public static DataZoom defaultDataZoom
+        {
+            get
+            {
+                return new DataZoom()
+                {
+                    filterMode = FilterMode.None,
+                    xAxisIndex = 0,
+                    yAxisIndex = 0,
+                    showDataShadow = true,
+                    showDetail = false,
+                    zoomLock = false,
+                    m_Height = 0,
+                    m_Bottom = 10,
+                    rangeMode = RangeMode.Percent,
+                    start = 30,
+                    end = 70,
+                    m_ScrollSensitivity = 10,
+                };
+            }
+        }
+
+        /// <summary>
+        /// 给定的坐标是否在缩放区域内
+        /// </summary>
+        /// <param name="pos"></param>
+        /// <param name="startX"></param>
+        /// <param name="width"></param>
+        /// <returns></returns>
+        public bool IsInZoom(Vector2 pos, float startX, float width)
+        {
+            Rect rect = Rect.MinMaxRect(startX, m_Bottom, startX + width, m_Bottom + m_Height);
+            return rect.Contains(pos);
+        }
+
+        /// <summary>
+        /// 给定的坐标是否在选中区域内
+        /// </summary>
+        /// <param name="pos"></param>
+        /// <param name="startX"></param>
+        /// <param name="width"></param>
+        /// <returns></returns>
+        public bool IsInSelectedZoom(Vector2 pos, float startX, float width)
+        {
+            var start = startX + width * m_Start / 100;
+            var end = startX + width * m_End / 100;
+            Rect rect = Rect.MinMaxRect(start, m_Bottom, end, m_Bottom + m_Height);
+            return rect.Contains(pos);
+        }
+
+        /// <summary>
+        /// 给定的坐标是否在开始活动条触发区域内
+        /// </summary>
+        /// <param name="pos"></param>
+        /// <param name="startX"></param>
+        /// <param name="width"></param>
+        /// <returns></returns>
+        public bool IsInStartZoom(Vector2 pos, float startX, float width)
+        {
+            var start = startX + width * m_Start / 100;
+            Rect rect = Rect.MinMaxRect(start - 10, m_Bottom, start + 10, m_Bottom + m_Height);
+            return rect.Contains(pos);
+        }
+
+        /// <summary>
+        /// 给定的坐标是否在结束活动条触发区域内
+        /// </summary>
+        /// <param name="pos"></param>
+        /// <param name="startX"></param>
+        /// <param name="width"></param>
+        /// <returns></returns>
+        public bool IsInEndZoom(Vector2 pos, float startX, float width)
+        {
+            var end = startX + width * m_End / 100;
+            Rect rect = Rect.MinMaxRect(end - 10, m_Bottom, end + 10, m_Bottom + m_Height);
+            return rect.Contains(pos);
+        }
+
+        /// <summary>
+        /// 是否显示文本
+        /// </summary>
+        /// <param name="flag"></param>
+        public void SetLabelActive(bool flag)
+        {
+            if (startLabel && startLabel.gameObject.activeInHierarchy != flag)
+            {
+                startLabel.gameObject.SetActive(flag);
+            }
+            if (endLabel && endLabel.gameObject.activeInHierarchy != flag)
+            {
+                endLabel.gameObject.SetActive(flag);
+            }
+        }
+
+        /// <summary>
+        /// 设置开始文本内容
+        /// </summary>
+        /// <param name="text"></param>
+        public void SetStartLabelText(string text)
+        {
+            if (startLabel) startLabel.text = text;
+        }
+
+        /// <summary>
+        /// 设置结束文本内容
+        /// </summary>
+        /// <param name="text"></param>
+        public void SetEndLabelText(string text)
+        {
+            if (endLabel) endLabel.text = text;
+        }
+
+        /// <summary>
+        /// 获取DataZoom的高，当height设置为0时，自动计算合适的偏移。
+        /// </summary>
+        /// <param name="gridBottom"></param>
+        /// <returns></returns>
+        public float GetHeight(float gridBottom)
+        {
+            if (height <= 0)
+            {
+                height = gridBottom - bottom - 30;
+                if (height < 10) height = 10;
+                return height;
+            }
+            else return height;
+        }
+    }
+}

Scripts/UI/Component/Main/DataZoom.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: c2aa26f9acb5344a59c924a1f23f90d5
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Grid.cs

@@ -0,0 +1,136 @@
+using System;
+using UnityEngine;
+
+namespace XCharts
+{
+    /// <summary>
+    /// Grid component.
+    /// Drawing grid in rectangular coordinate. In a single grid, at most two X and Y axes each is allowed. 
+    /// Line chart, bar chart, and scatter chart can be drawn in grid.
+    /// There is only one single grid component at most in a single echarts instance.
+    /// <para>
+    /// 网格组件。
+    /// 直角坐标系内绘图网格，单个 grid 内最多可以放置上下两个 X 轴，左右两个 Y 轴。可以在网格上绘制折线图，柱状图，散点图。
+    /// 单个xcharts实例中只能存在一个grid组件。
+    /// </para>
+    /// </summary>
+    [Serializable]
+    public class Grid : IEquatable<Grid>
+    {
+        [SerializeField] private bool m_Show = true;
+        [SerializeField] private float m_Left;
+        [SerializeField] private float m_Right;
+        [SerializeField] private float m_Top;
+        [SerializeField] private float m_Bottom;
+        [SerializeField] private Color m_BackgroundColor;
+
+        /// <summary>
+        /// Whether to show the grid in rectangular coordinate.
+        /// 是否显示直角坐标系网格。
+        /// </summary>
+        public bool show { get { return m_Show; } set { m_Show = value; } }
+        /// <summary>
+        /// Distance between grid component and the left side of the container.
+        /// grid 组件离容器左侧的距离。
+        /// </summary>
+        public float left { get { return m_Left; } set { m_Left = value; } }
+        /// <summary>
+        /// Distance between grid component and the right side of the container.
+        /// grid 组件离容器右侧的距离。
+        /// </summary>
+        public float right { get { return m_Right; } set { m_Right = value; } }
+        /// <summary>
+        /// Distance between grid component and the top side of the container.
+        /// grid 组件离容器上侧的距离。
+        /// </summary>
+        public float top { get { return m_Top; } set { m_Top = value; } }
+        /// <summary>
+        /// Distance between grid component and the bottom side of the container.
+        /// grid 组件离容器下侧的距离。
+        /// </summary>
+        public float bottom { get { return m_Bottom; } set { m_Bottom = value; } }
+        /// <summary>
+        /// Background color of grid, which is transparent by default.
+        /// 网格背景色，默认透明。
+        /// </summary>
+        public Color backgroundColor { get { return m_BackgroundColor; } set { m_BackgroundColor = value; } }
+
+        public static Grid defaultGrid
+        {
+            get
+            {
+                var coordinate = new Grid
+                {
+                    m_Show = true,
+                    m_Left = 50,
+                    m_Right = 30,
+                    m_Top = 50,
+                    m_Bottom = 30
+                };
+                return coordinate;
+            }
+        }
+        public void Copy(Grid other)
+        {
+            m_Show = other.show;
+            m_Left = other.left;
+            m_Right = other.right;
+            m_Top = other.top;
+            m_Bottom = other.bottom;
+            m_BackgroundColor = other.backgroundColor;
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is Grid)
+            {
+                return Equals((Grid)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(Grid other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return m_Show == other.show &&
+                m_Left == other.left &&
+                m_Right == other.right &&
+                m_Top == other.top &&
+                m_Bottom == other.bottom &&
+                ChartHelper.IsValueEqualsColor(m_BackgroundColor, other.backgroundColor);
+        }
+
+        public static bool operator ==(Grid left, Grid right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(Grid left, Grid right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+    }
+}

Scripts/UI/Component/Main/Grid.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 5420ab107823641e49c2df9e3556ea30
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Legend.cs

@@ -0,0 +1,391 @@
+using System.Linq;
+using System;
+using System.Collections.Generic;
+using UnityEngine;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// 图例组件。
+    /// 图例组件展现了不同系列的标记，颜色和名字。可以通过点击图例控制哪些系列不显示。
+    /// </summary>
+    [System.Serializable]
+    public class Legend : JsonDataSupport, IPropertyChanged, IEquatable<Legend>
+    {
+        /// <summary>
+        /// Selected mode of legend, which controls whether series can be toggled displaying by clicking legends. 
+        /// It is enabled by default, and you may set it to be false to disabled it.
+        /// 图例选择的模式，控制是否可以通过点击图例改变系列的显示状态。默认开启图例选择，可以设成 None 关闭。
+        /// </summary>
+        public enum SelectedMode
+        {
+            /// <summary>
+            /// 多选。
+            /// </summary>
+            Multiple,
+            /// <summary>
+            /// 单选。
+            /// </summary>
+            Single,
+            /// <summary>
+            /// 无法选择。
+            /// </summary>
+            None
+        }
+        [SerializeField] private bool m_Show = true;
+        [SerializeField] private SelectedMode m_SelectedMode;
+        [SerializeField] private Orient m_Orient = Orient.Horizonal;
+        [SerializeField] private Location m_Location = Location.defaultRight;
+        [SerializeField] private float m_ItemWidth = 50.0f;
+        [SerializeField] private float m_ItemHeight = 20.0f;
+        [SerializeField] private float m_ItemGap = 5;
+        [SerializeField] private int m_ItemFontSize = 18;
+        [SerializeField] private string m_Formatter;
+        [SerializeField] private List<string> m_Data = new List<string>();
+
+        private Dictionary<string, Button> m_DataBtnList = new Dictionary<string, Button>();
+
+        /// <summary>
+        /// Whether to show legend component. 
+        /// 是否显示图例组件。
+        /// </summary>
+        public bool show { get { return m_Show; } set { m_Show = value; } }
+        /// <summary>
+        /// Selected mode of legend, which controls whether series can be toggled displaying by clicking legends. 
+        /// 选择模式。控制是否可以通过点击图例改变系列的显示状态。默认开启图例选择，可以设成 None 关闭。
+        /// </summary>
+        /// <value></value>
+        public SelectedMode selectedMode { get { return m_SelectedMode; } set { m_SelectedMode = value; } }
+        /// <summary>
+        /// Specify whether the layout of legend component is horizontal or vertical. 
+        /// 布局方式是横还是竖。
+        /// </summary>
+        public Orient orient { get { return m_Orient; } set { m_Orient = value; } }
+        /// <summary>
+        /// The location of legend.
+        /// 图例显示的位置。
+        /// </summary>
+        public Location location { get { return m_Location; } set { m_Location = value; } }
+        /// <summary>
+        /// the width of legend item.
+        /// 每个图例项的宽度。
+        /// </summary>
+        public float itemWidth { get { return m_ItemWidth; } set { m_ItemWidth = value; } }
+        /// <summary>
+        /// the height of legend item.
+        /// 每个图例项的高度。
+        /// </summary>
+        public float itemHeight { get { return m_ItemHeight; } set { m_ItemHeight = value; } }
+        /// <summary>
+        /// The distance between each legend, horizontal distance in horizontal layout, and vertical distance in vertical layout.
+        /// 图例每项之间的间隔。横向布局时为水平间隔，纵向布局时为纵向间隔。
+        /// </summary>
+        public float itemGap { get { return m_ItemGap; } set { m_ItemGap = value; } }
+        /// <summary>
+        /// font size of item text.
+        /// 图例项的字体大小。
+        /// </summary>
+        public int itemFontSize { get { return m_ItemFontSize; } set { m_ItemFontSize = value; } }
+        /// <summary>
+        /// 图例内容字符串模版格式器。支持用 \n 换行。
+        /// 模板变量为图例名称 {name}
+        /// </summary>
+        public string formatter { get { return m_Formatter; } set { m_Formatter = value; } }
+        /// <summary>
+        /// Data array of legend. An array item is usually a name representing string. (If it is a pie chart, 
+        /// it could also be the name of a single data in the pie chart) of a series. 
+        /// If data is not specified, it will be auto collected from series. 
+        /// 图例的数据数组。数组项通常为一个字符串，每一项代表一个系列的 name（如果是饼图，也可以是饼图单个数据的 name）。
+        /// 如果 data 没有被指定，会自动从当前系列中获取。指定data时里面的数据项和serie匹配时才会生效。
+        /// </summary>
+        public List<string> data { get { return m_Data; } }
+        /// <summary>
+        /// the button list of legend.
+        /// 图例按钮列表。
+        /// </summary>
+        /// <value></value>
+        public Dictionary<string, Button> buttonList { get { return m_DataBtnList; } }
+
+        /// <summary>
+        /// 一个在顶部居中显示的默认图例。
+        /// </summary>
+        public static Legend defaultLegend
+        {
+            get
+            {
+                var legend = new Legend
+                {
+                    m_Show = false,
+                    m_SelectedMode = SelectedMode.Multiple,
+                    m_Orient = Orient.Horizonal,
+                    m_Location = Location.defaultTop,
+                    m_ItemWidth = 60.0f,
+                    m_ItemHeight = 20.0f,
+                    m_ItemGap = 5,
+                    m_ItemFontSize = 16
+                };
+                legend.location.top = 30;
+                return legend;
+            }
+        }
+        public void Copy(Legend legend)
+        {
+            m_Show = legend.show;
+            m_SelectedMode = legend.selectedMode;
+            m_Orient = legend.orient;
+            m_Location.Copy(legend.location);
+            m_ItemWidth = legend.itemWidth;
+            m_ItemHeight = legend.itemHeight;
+            m_ItemGap = legend.itemGap;
+            m_ItemFontSize = legend.itemFontSize;
+            m_Data.Clear();
+            foreach (var d in legend.data) m_Data.Add(d);
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is Legend)
+            {
+                return Equals((Legend)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(Legend other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return show == other.show &&
+                selectedMode == other.selectedMode &&
+                orient == other.orient &&
+                location == other.location &&
+                itemWidth == other.itemWidth &&
+                itemHeight == other.itemHeight &&
+                itemGap == other.itemGap &&
+                itemFontSize == other.itemFontSize &&
+                ChartHelper.IsValueEqualsList<string>(m_Data, other.data);
+        }
+
+        public static bool operator ==(Legend left, Legend right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(Legend left, Legend right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+
+        /// <summary>
+        /// 清空
+        /// </summary>
+        public void ClearData()
+        {
+            m_Data.Clear();
+        }
+
+        /// <summary>
+        /// 是否包括由指定名字的图例
+        /// </summary>
+        /// <param name="name"></param>
+        /// <returns></returns>
+        public bool ContainsData(string name)
+        {
+            return m_Data.Contains(name);
+        }
+
+        /// <summary>
+        /// 移除指定名字的图例
+        /// </summary>
+        /// <param name="name"></param>
+        public void RemoveData(string name)
+        {
+            if (m_Data.Contains(name))
+            {
+                m_Data.Remove(name);
+            }
+        }
+
+        /// <summary>
+        /// 添加图例项
+        /// </summary>
+        /// <param name="name"></param>
+        public void AddData(string name)
+        {
+            if (!m_Data.Contains(name) && !string.IsNullOrEmpty(name))
+            {
+                m_Data.Add(name);
+            }
+        }
+
+        /// <summary>
+        /// 获得指定索引的图例
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public string GetData(int index)
+        {
+            if (index >= 0 && index < m_Data.Count)
+            {
+                return m_Data[index];
+            }
+            return null;
+        }
+
+        /// <summary>
+        /// 获得指定图例的索引
+        /// </summary>
+        /// <param name="legendName"></param>
+        /// <returns></returns>
+        public int GetIndex(string legendName)
+        {
+            return m_Data.IndexOf(legendName);
+        }
+
+        /// <summary>
+        /// 移除所有图例按钮
+        /// </summary>
+        public void RemoveButton()
+        {
+            m_DataBtnList.Clear();
+        }
+
+        /// <summary>
+        /// 给图例绑定按钮
+        /// </summary>
+        /// <param name="name"></param>
+        /// <param name="btn"></param>
+        /// <param name="total"></param>
+        public void SetButton(string name, Button btn, int total)
+        {
+            int index = m_DataBtnList.Values.Count;
+            btn.transform.localPosition = GetButtonLocationPosition(total, index);
+            m_DataBtnList[name] = btn;
+            btn.gameObject.SetActive(show);
+            btn.GetComponentInChildren<Text>().text = name;
+        }
+
+        /// <summary>
+        /// 更新图例按钮颜色
+        /// </summary>
+        /// <param name="name"></param>
+        /// <param name="color"></param>
+        public void UpdateButtonColor(string name, Color color)
+        {
+            if (m_DataBtnList.ContainsKey(name))
+            {
+                m_DataBtnList[name].GetComponent<Image>().color = color;
+            }
+        }
+
+        /// <summary>
+        /// 参数变更时的回调处理
+        /// </summary>
+        public void OnChanged()
+        {
+            m_Location.OnChanged();
+        }
+
+        /// <summary>
+        /// 根据图例的布局和位置类型获得具体位置
+        /// </summary>
+        /// <param name="size"></param>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        private Vector2 GetButtonLocationPosition(int size, int index)
+        {
+            switch (m_Orient)
+            {
+                case Orient.Vertical:
+                    switch (m_Location.align)
+                    {
+                        case Location.Align.TopCenter:
+                        case Location.Align.TopLeft:
+                        case Location.Align.TopRight:
+                            return new Vector2(0, -index * (itemHeight + itemGap));
+
+                        case Location.Align.Center:
+                        case Location.Align.CenterLeft:
+                        case Location.Align.CenterRight:
+                            float totalHeight = size * itemHeight + (size - 1) * itemGap;
+                            float startY = totalHeight / 2;
+                            return new Vector2(0, startY - index * (itemHeight + itemGap));
+
+                        case Location.Align.BottomCenter:
+                        case Location.Align.BottomLeft:
+                        case Location.Align.BottomRight:
+                            return new Vector2(0, (size - index - 1) * (itemHeight + itemGap));
+                    }
+                    return Vector2.zero;
+
+                case Orient.Horizonal:
+                    switch (m_Location.align)
+                    {
+                        case Location.Align.TopLeft:
+                        case Location.Align.CenterLeft:
+                        case Location.Align.BottomLeft:
+                            return new Vector2(index * (itemWidth + itemGap), 0);
+
+                        case Location.Align.TopCenter:
+                        case Location.Align.Center:
+                        case Location.Align.BottomCenter:
+                            float totalWidth = size * itemWidth + (size - 1) * itemGap;
+                            float startX = totalWidth / 2;
+                            return new Vector2(-startX + itemWidth / 2 + index * (itemWidth + itemGap), 0);
+                        case Location.Align.TopRight:
+                        case Location.Align.CenterRight:
+                        case Location.Align.BottomRight:
+                            return new Vector2(-(size - index - 1) * (itemWidth + itemGap), 0);
+                    }
+                    return Vector2.zero;
+            }
+            return Vector2.zero;
+        }
+
+        /// <summary>
+        /// 从json字符串解析数据，json格式如：['邮件营销','联盟广告','视频广告','直接访问','搜索引擎']
+        /// </summary>
+        /// <param name="jsonData"></param>
+        public override void ParseJsonData(string jsonData)
+        {
+            if (string.IsNullOrEmpty(jsonData) || !m_DataFromJson) return;
+            m_Data = ChartHelper.ParseStringFromString(jsonData);
+        }
+
+        public string GetFormatterContent(string category)
+        {
+            if (string.IsNullOrEmpty(m_Formatter))
+                return category;
+            else
+            {
+                var content = m_Formatter.Replace("{name}", category);
+                content = content.Replace("\\n", "\n");
+                content = content.Replace("<br/>", "\n");
+                return content;
+            }
+        }
+    }
+}

Scripts/UI/Component/Main/Legend.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 4a708805f5d8147b3b9a90b2f1d38e75
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Pie.cs

@@ -0,0 +1,38 @@
+using UnityEngine;
+
+namespace XCharts
+{
+    /// <summary>
+    /// the global setting of pie chart.
+    /// 饼图的全局设置。
+    /// </summary>
+    [System.Serializable]
+    public class Pie
+    {
+        [SerializeField] private float m_TooltipExtraRadius;
+        [SerializeField] private float m_SelectedOffset;
+        /// <summary>
+        /// the extra dadius of pie chart when the tooltip indicatored pie.
+        /// 提示框指示时的额外半径。
+        /// </summary>
+        public float tooltipExtraRadius { get { return m_TooltipExtraRadius; } set { m_TooltipExtraRadius = value; } }
+        /// <summary>
+        /// the offset of pie when the pie item is selected.
+        /// 饼图项被选中时的偏移。
+        /// </summary>
+        public float selectedOffset { get { return m_SelectedOffset; } set { m_SelectedOffset = value; } }
+
+        public static Pie defaultPie
+        {
+            get
+            {
+                var pie = new Pie
+                {
+                    m_TooltipExtraRadius = 10f,
+                    m_SelectedOffset = 10f,
+                };
+                return pie;
+            }
+        }
+    }
+}

Scripts/UI/Component/Main/Pie.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: ca364d90ce5fe4605a382e9af984757f
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Radar.cs

@@ -0,0 +1,369 @@
+using UnityEngine;
+using System.Collections.Generic;
+using System;
+using System.Text.RegularExpressions;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// Coordinate for radar charts. 
+    /// 雷达图坐标系组件，只适用于雷达图。
+    /// </summary>
+    [System.Serializable]
+    public class Radar : JsonDataSupport, IEquatable<Radar>
+    {
+        /// <summary>
+        /// Radar render type, in which 'Polygon' and 'Circle' are supported.
+        /// 雷达图绘制类型，支持 'Polygon' 和 'Circle'。
+        /// </summary>
+        public enum Shape
+        {
+            Polygon,
+            Circle
+        }
+        /// <summary>
+        /// Indicator of radar chart, which is used to assign multiple variables(dimensions) in radar chart. 
+        /// 雷达图的指示器，用来指定雷达图中的多个变量（维度）。
+        /// </summary>
+        [System.Serializable]
+        public class Indicator : IEquatable<Indicator>
+        {
+            [SerializeField] private string m_Name;
+            [SerializeField] private float m_Max;
+            [SerializeField] private float m_Min;
+            [SerializeField] private Color m_Color;
+            /// <summary>
+            /// 指示器名称。
+            /// </summary>
+            public string name { get { return m_Name; } set { m_Name = value; } }
+            /// <summary>
+            /// The maximum value of indicator, with default value of 0, but we recommend to set it manually.
+            /// 指示器的最大值，默认为 0 无限制。
+            /// </summary>
+            public float max { get { return m_Max; } set { m_Max = value; } }
+            /// <summary>
+            /// The minimum value of indicator, with default value of 0.
+            /// 指示器的最小值，默认为 0 无限制。
+            /// </summary>
+            public float min { get { return m_Min; } set { m_Min = value; } }
+            /// <summary>
+            /// Specfy a color the the indicator.
+            /// 标签特定的颜色。默认取自主题的axisTextColor。
+            /// </summary>
+            public Color color { get { return m_Color; } set { m_Color = value; } }
+            /// <summary>
+            /// the text conponent of indicator.
+            /// 指示器的文本组件。
+            /// </summary>
+            public Text text { get; set; }
+
+            public Indicator Clone()
+            {
+                return new Indicator()
+                {
+                    m_Name = name,
+                    m_Max = max,
+                    m_Min = min,
+                    m_Color = color
+                };
+            }
+
+            public override bool Equals(object obj)
+            {
+                if (ReferenceEquals(null, obj))
+                {
+                    return false;
+                }
+                else if (obj is Indicator)
+                {
+                    return Equals((Indicator)obj);
+                }
+                else
+                {
+                    return false;
+                }
+            }
+
+            public bool Equals(Indicator other)
+            {
+                if (ReferenceEquals(null, other))
+                {
+                    return false;
+                }
+                return m_Name.Equals(other.name) &&
+                    ChartHelper.IsValueEqualsColor(m_Color, other.color);
+            }
+
+            public override int GetHashCode()
+            {
+                return base.GetHashCode();
+            }
+        }
+        [SerializeField] private Shape m_Shape;
+        [SerializeField] private float m_Radius = 100;
+        [SerializeField] private int m_SplitNumber = 5;
+        [SerializeField] private float[] m_Center = new float[2] { 0.5f, 0.5f };
+        [SerializeField] private LineStyle m_LineStyle = new LineStyle();
+        [SerializeField] private AxisSplitArea m_SplitArea = AxisSplitArea.defaultSplitArea;
+        [SerializeField] private bool m_Indicator = true;
+        [SerializeField] private List<Indicator> m_IndicatorList = new List<Indicator>();
+        /// <summary>
+        /// Radar render type, in which 'Polygon' and 'Circle' are supported.
+        /// 雷达图绘制类型，支持 'Polygon' 和 'Circle'。
+        /// </summary>
+        /// <value></value>
+        public Shape shape { get { return m_Shape; } set { m_Shape = value; } }
+        /// <summary>
+        /// the radius of radar.
+        /// 雷达图的半径。
+        /// </summary>
+        public float radius { get { return m_Radius; } set { m_Radius = value; } }
+        /// <summary>
+        /// Segments of indicator axis.
+        /// 指示器轴的分割段数。
+        /// </summary>
+        public int splitNumber { get { return m_SplitNumber; } set { m_SplitNumber = value; } }
+        /// <summary>
+        /// the center of radar chart.
+        /// 雷达图的中心点。数组的第一项是横坐标，第二项是纵坐标。
+        /// 当值为0-1之间时表示百分比，设置成百分比时第一项是相对于容器宽度，第二项是相对于容器高度。
+        /// </summary>
+        public float[] center { get { return m_Center; } set { m_Center = value; } }
+        /// <summary>
+        /// the line style of radar.
+        /// 线条样式。
+        /// </summary>
+        public LineStyle lineStyle { get { return m_LineStyle; } set { m_LineStyle = value; } }
+        /// <summary>
+        /// Split area of axis in grid area.
+        /// 分割区域。
+        /// </summary>
+        public AxisSplitArea splitArea { get { return m_SplitArea; } set { m_SplitArea = value; } }
+        /// <summary>
+        /// Whether to show indicator.
+        /// 是否显示指示器。
+        /// </summary>
+        public bool indicator { get { return m_Indicator; } set { m_Indicator = value; } }
+        /// <summary>
+        /// the indicator list.
+        /// 指示器列表。
+        /// </summary>
+        public List<Indicator> indicatorList { get { return m_IndicatorList; } }
+
+        /// <summary>
+        /// the center position of radar in container.
+        /// 雷达图在容器中的具体中心点。
+        /// </summary>
+        /// <value></value>
+        public Vector2 centerPos { get; set; }
+        /// <summary>
+        /// the true radius of radar.
+        /// 雷达图的运行时实际半径。
+        /// </summary>
+        /// <value></value>
+        public float actualRadius { get; set; }
+        /// <summary>
+        /// the data position list of radar.
+        /// 雷达图的所有数据坐标点列表。
+        /// </summary>
+        /// <returns></returns>
+        public Dictionary<int,List<Vector3>> dataPosList = new Dictionary<int,List<Vector3>>();
+
+        public static Radar defaultRadar
+        {
+            get
+            {
+                var radar = new Radar
+                {
+                    m_Shape = Shape.Polygon,
+                    m_Radius = 0.4f,
+                    m_SplitNumber = 5,
+                    m_Indicator = true,
+                    m_IndicatorList = new List<Indicator>(5){
+                        new Indicator(){name="indicator1",max = 100},
+                        new Indicator(){name="indicator2",max = 100},
+                        new Indicator(){name="indicator3",max = 100},
+                        new Indicator(){name="indicator4",max = 100},
+                        new Indicator(){name="indicator5",max = 100},
+                    }
+                };
+                radar.center[0] = 0.5f;
+                radar.center[1] = 0.45f;
+                radar.splitArea.show = true;
+                radar.lineStyle.width = 0.6f;
+                return radar;
+            }
+        }
+
+        public void Copy(Radar other)
+        {
+            m_Shape = other.shape;
+            m_Radius = other.radius;
+            m_SplitNumber = other.splitNumber;
+            m_Center[0] = other.center[0];
+            m_Center[1] = other.center[1];
+            m_Indicator = other.indicator;
+            indicatorList.Clear();
+            foreach (var d in other.indicatorList) indicatorList.Add(d.Clone());
+        }
+
+        public Radar Clone()
+        {
+            var radar = new Radar();
+            radar.shape = shape;
+            radar.radius = radius;
+            radar.splitNumber = splitNumber;
+            radar.center[0] = center[0];
+            radar.center[1] = center[1];
+            radar.indicatorList.Clear();
+            radar.indicator = indicator;
+            foreach (var d in indicatorList) radar.indicatorList.Add(d.Clone());
+            return radar;
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is Radar)
+            {
+                return Equals((Radar)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(Radar other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return radius == other.radius &&
+                shape == other.shape &&
+                splitNumber == other.splitNumber &&
+                center[0] == other.center[0] &&
+                center[1] == other.center[1] &&
+                indicator == other.indicator &&
+                IsEqualsIndicatorList(indicatorList, other.indicatorList);
+        }
+
+        private bool IsEqualsIndicatorList(List<Indicator> indicators1, List<Indicator> indicators2)
+        {
+            if (indicators1.Count != indicators2.Count) return false;
+            for (int i = 0; i < indicators1.Count; i++)
+            {
+                var indicator1 = indicators1[i];
+                var indicator2 = indicators2[i];
+                if (!indicator1.Equals(indicator2)) return false;
+            }
+            return true;
+        }
+
+        public static bool operator ==(Radar left, Radar right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(Radar left, Radar right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+
+        public override void ParseJsonData(string jsonData)
+        {
+            if (string.IsNullOrEmpty(jsonData) || !m_DataFromJson) return;
+            string pattern = "[\"|'](.*?)[\"|']";
+            if (Regex.IsMatch(jsonData, pattern))
+            {
+                m_IndicatorList.Clear();
+                MatchCollection m = Regex.Matches(jsonData, pattern);
+                foreach (Match match in m)
+                {
+                    m_IndicatorList.Add(new Indicator()
+                    {
+                        name = match.Groups[1].Value
+                    });
+                }
+            }
+            pattern = "(\\d+)";
+            if (Regex.IsMatch(jsonData, pattern))
+            {
+                MatchCollection m = Regex.Matches(jsonData, pattern);
+                int index = 0;
+                foreach (Match match in m)
+                {
+                    if (m_IndicatorList[index] != null)
+                    {
+                        m_IndicatorList[index].max = int.Parse(match.Groups[1].Value);
+                    }
+                    index++;
+                }
+            }
+        }
+
+        public float GetIndicatorMin(int index)
+        {
+            if (index >= 0 && index < m_IndicatorList.Count)
+            {
+                return m_IndicatorList[index].min;
+            }
+            return 0;
+        }
+        public float GetIndicatorMax(int index)
+        {
+            if (index >= 0 && index < m_IndicatorList.Count)
+            {
+                return m_IndicatorList[index].max;
+            }
+            return 0;
+        }
+
+        public void UpdateRadarCenter(float chartWidth, float chartHeight)
+        {
+            if (center.Length < 2) return;
+            var centerX = center[0] <= 1 ? chartWidth * center[0] : center[0];
+            var centerY = center[1] <= 1 ? chartHeight * center[1] : center[1];
+            centerPos = new Vector2(centerX, centerY);
+            if (radius <= 0)
+            {
+                actualRadius = 0;
+            }
+            else if (radius <= 1)
+            {
+                actualRadius = Mathf.Min(chartWidth, chartHeight) * radius;
+            }
+            else
+            {
+                actualRadius = radius;
+            }
+        }
+
+        public Vector3 GetIndicatorPosition(int index)
+        {
+            int indicatorNum = indicatorList.Count;
+            var angle = 2 * Mathf.PI / indicatorNum * index;
+            var x = centerPos.x + actualRadius * Mathf.Sin(angle);
+            var y = centerPos.y + actualRadius * Mathf.Cos(angle);
+            return new Vector3(x, y);
+        }
+    }
+}

Scripts/UI/Component/Main/Radar.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 0874fd6b295f24cdb8b3cedb1faaa40f
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Serie.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: aa9c09045961a4ea9a34a098f099f2a1
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Series.cs

@@ -0,0 +1,902 @@
+using UnityEngine;
+using System.Collections.Generic;
+using System;
+
+namespace XCharts
+{
+    /// <summary>
+    /// the list of series.
+    /// 系列列表。每个系列通过 type 决定自己的图表类型。
+    /// </summary>
+    [System.Serializable]
+    public class Series : JsonDataSupport
+    {
+
+        [SerializeField] protected List<Serie> m_Series;
+
+        /// <summary>
+        /// the list of serie
+        /// 系列列表。
+        /// </summary>
+        /// <value></value>
+        [Obsolete("Use series.list instead.", true)]
+        public List<Serie> series { get { return m_Series; } }
+
+        /// <summary>
+        /// the list of serie
+        /// 系列列表。
+        /// </summary>
+        /// <value></value>
+        public List<Serie> list { get { return m_Series; } }
+        /// <summary>
+        /// the size of serie list.
+        /// 系列个数。
+        /// </summary>
+        /// <value></value>
+        public int Count { get { return m_Series.Count; } }
+
+        public static Series defaultSeries
+        {
+            get
+            {
+                var series = new Series
+                {
+                    m_Series = new List<Serie>(){new Serie(){
+                        show  = true,
+                        name = "serie1",
+                        index = 0
+                    }}
+                };
+                return series;
+            }
+        }
+
+        /// <summary>
+        /// 清空所有系列的数据
+        /// </summary>
+        public void ClearData()
+        {
+            AnimationStop();
+            foreach (var serie in m_Series)
+            {
+                serie.ClearData();
+            }
+        }
+
+        /// <summary>
+        /// 获得指定序列指定索引的数据值
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <param name="dataIndex"></param>
+        /// <returns></returns>
+        public float GetData(int serieIndex, int dataIndex)
+        {
+            if (serieIndex >= 0 && serieIndex < Count)
+            {
+                return m_Series[serieIndex].GetYData(dataIndex);
+            }
+            else
+            {
+                return 0;
+            }
+        }
+
+        /// <summary>
+        /// 获得指定系列名的第一个系列
+        /// </summary>
+        /// <param name="name"></param>
+        /// <returns></returns>
+        public Serie GetSerie(string name)
+        {
+            for (int i = 0; i < m_Series.Count; i++)
+            {
+                bool match = false;
+                if (string.IsNullOrEmpty(name))
+                {
+                    if (string.IsNullOrEmpty(m_Series[i].name)) match = true;
+                }
+                else if (name.Equals(m_Series[i].name))
+                {
+                    match = true;
+                }
+                if (match)
+                {
+                    m_Series[i].index = i;
+                    return m_Series[i];
+                }
+            }
+            return null;
+        }
+
+        /// <summary>
+        /// 获得指定系列名的所有系列
+        /// </summary>
+        /// <param name="name"></param>
+        /// <returns></returns>
+        public List<Serie> GetSeries(string name)
+        {
+            var list = new List<Serie>();
+            if (name == null) return list;
+            foreach (var serie in m_Series)
+            {
+                if (name.Equals(serie.name)) list.Add(serie);
+            }
+            return list;
+        }
+
+        /// <summary>
+        /// 获得指定索引的系列
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public Serie GetSerie(int index)
+        {
+            if (index >= 0 && index < m_Series.Count)
+            {
+                return m_Series[index];
+            }
+            return null;
+        }
+
+        /// <summary>
+        /// 获得上一个同堆叠且显示的serie。
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public Serie GetLastStackSerie(int index)
+        {
+            var serie = GetSerie(index);
+            return GetLastStackSerie(serie);
+        }
+
+        /// <summary>
+        /// 同堆叠的serie是否有渐变色的。
+        /// </summary>
+        /// <param name="stack"></param>
+        /// <returns></returns>
+        public bool IsAnyGradientSerie(string stack)
+        {
+            if (string.IsNullOrEmpty(stack)) return false;
+            foreach (var serie in m_Series)
+            {
+                if (serie.show && serie.areaStyle.show && stack.Equals(serie.stack))
+                {
+                    if (serie.areaStyle.color != serie.areaStyle.toColor && serie.areaStyle.toColor != Color.clear) return true;
+                }
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 获得上一个同堆叠且显示的serie。
+        /// </summary>
+        /// <param name="serie"></param>
+        /// <returns></returns>
+        public Serie GetLastStackSerie(Serie serie)
+        {
+            if (serie == null || string.IsNullOrEmpty(serie.stack)) return null;
+            for (int i = serie.index - 1; i >= 0; i--)
+            {
+                var temp = m_Series[i];
+                if (temp.show && serie.stack.Equals(temp.stack)) return temp;
+            }
+            return null;
+        }
+
+        /// <summary>
+        /// 是否包含指定名字的系列
+        /// </summary>
+        /// <param name="name"></param>
+        /// <returns></returns>
+        public bool Contains(string name)
+        {
+            for (int i = 0; i < m_Series.Count; i++)
+            {
+                if (name.Equals(m_Series[i].name))
+                {
+                    return true;
+                }
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// Remove serie from series.
+        /// 移除指定名字的系列。
+        /// </summary>
+        /// <param name="serieName">the name of serie</param>
+        public void Remove(string serieName)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                m_Series.Remove(serie);
+            }
+        }
+
+        /// <summary>
+        /// Remove all serie from series.
+        /// 移除所有系列。
+        /// </summary>
+        public void RemoveAll()
+        {
+            AnimationStop();
+            m_Series.Clear();
+        }
+
+        /// <summary>
+        /// 添加一个系列到列表中。
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="type"></param>
+        /// <param name="show"></param>
+        /// <returns></returns>
+        public Serie AddSerie(SerieType type, string serieName, bool show = true)
+        {
+            var serie = GetSerie(serieName);
+            if (serie == null)
+            {
+                serie = new Serie();
+                serie.type = type;
+                serie.show = show;
+                serie.name = serieName;
+                serie.index = m_Series.Count;
+
+                if (type == SerieType.Scatter)
+                {
+                    serie.symbol.type = SerieSymbolType.Circle;
+                    serie.symbol.size = 20f;
+                    serie.symbol.selectedSize = 30f;
+                }
+                else if (type == SerieType.Line)
+                {
+                    serie.symbol.type = SerieSymbolType.EmptyCircle;
+                    serie.symbol.size = 2.5f;
+                    serie.symbol.selectedSize = 5f;
+                }
+                else
+                {
+                    serie.symbol.type = SerieSymbolType.None;
+                }
+                m_Series.Add(serie);
+            }
+            else
+            {
+                serie.show = show;
+            }
+            return serie;
+        }
+
+        /// <summary>
+        /// 添加一个数据到指定系列的维度Y数据中
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="value"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddData(string serieName, float value, string dataName = null)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.AddYData(value, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 添加一个数据到指定系列的维度Y中
+        /// </summary>
+        /// <param name="index"></param>
+        /// <param name="value"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddData(int index, float value, string dataName = null)
+        {
+            var serie = GetSerie(index);
+            if (serie != null)
+            {
+                serie.AddYData(value, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 添加一组数据到指定的系列中
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="multidimensionalData"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddData(string serieName, List<float> multidimensionalData, string dataName = null)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.AddData(multidimensionalData, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 添加一组数据到指定的系列中
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <param name="multidimensionalData"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddData(int serieIndex, List<float> multidimensionalData, string dataName = null)
+        {
+            var serie = GetSerie(serieIndex);
+            if (serie != null)
+            {
+                serie.AddData(multidimensionalData, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 添加(x,y)数据到指定的系列中
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="xValue"></param>
+        /// <param name="yValue"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddXYData(string serieName, float xValue, float yValue, string dataName = null)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.AddXYData(xValue, yValue, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 添加(x,y)数据到指定的系列中
+        /// </summary>
+        /// <param name="index"></param>
+        /// <param name="xValue"></param>
+        /// <param name="yValue"></param>
+        /// <param name="dataName"></param>
+        /// <returns></returns>
+        public bool AddXYData(int index, float xValue, float yValue, string dataName = null)
+        {
+            var serie = GetSerie(index);
+            if (serie != null)
+            {
+                serie.AddXYData(xValue, yValue, dataName);
+                return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 更新指定系列的维度Y数据
+        /// </summary>
+        /// <param name="name"></param>
+        /// <param name="value"></param>
+        /// <param name="dataIndex"></param>
+        public void UpdateData(string serieName, int dataIndex, float value)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.UpdateYData(dataIndex, value);
+            }
+        }
+
+        /// <summary>
+        /// 更新指定系列的数据项名称
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="dataIndex"></param>
+        /// <param name="dataName"></param>
+        public void UpdateDataName(string serieName, int dataIndex, string dataName)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.UpdateDataName(dataIndex, dataName);
+            }
+        }
+
+        /// <summary>
+        /// 更新指定系列的数据项名称
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <param name="dataIndex"></param>
+        /// <param name="dataName"></param>
+        public void UpdateDataName(int serieIndex, int dataIndex, string dataName)
+        {
+            var serie = GetSerie(serieIndex);
+            if (serie != null)
+            {
+                serie.UpdateDataName(dataIndex, dataName);
+            }
+        }
+
+        /// <summary>
+        /// 更新指定系列的维度Y数据项的值
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <param name="dataIndex"></param>
+        /// <param name="value"></param>
+        public void UpdateData(int serieIndex, int dataIndex, float value)
+        {
+            var serie = GetSerie(serieIndex);
+            if (serie != null)
+            {
+                serie.UpdateYData(dataIndex, value);
+            }
+        }
+
+
+        /// <summary>
+        /// 更新指定系列的维度X和维度Y数据
+        /// </summary>
+        /// <param name="serieName"></param>
+        /// <param name="dataIndex"></param>
+        /// <param name="xValue"></param>
+        /// <param name="yValue"></param>
+        public void UpdateXYData(string serieName, int dataIndex, float xValue, float yValue)
+        {
+            var serie = GetSerie(serieName);
+            if (serie != null)
+            {
+                serie.UpdateXYData(dataIndex, xValue, yValue);
+            }
+        }
+
+        /// <summary>
+        /// 更新指定系列的维度X和维度Y数据
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <param name="dataIndex"></param>
+        /// <param name="xValue"></param>
+        /// <param name="yValue"></param>
+        public void UpdateXYData(int serieIndex, int dataIndex, float xValue, float yValue)
+        {
+            var serie = GetSerie(serieIndex);
+            if (serie != null)
+            {
+                serie.UpdateXYData(dataIndex, xValue, yValue);
+            }
+        }
+
+        /// <summary>
+        /// dataZoom由变化是更新系列的缓存数据
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        public void UpdateFilterData(DataZoom dataZoom)
+        {
+            if (dataZoom != null && dataZoom.enable)
+            {
+                for (int i = 0; i < m_Series.Count; i++)
+                {
+                    m_Series[i].UpdateFilterData(dataZoom);
+                }
+            }
+        }
+
+        /// <summary>
+        /// 指定系列是否显示
+        /// </summary>
+        /// <param name="name"></param>
+        /// <returns></returns>
+        public bool IsActive(string name)
+        {
+            var serie = GetSerie(name);
+            return serie == null ? false : serie.show;
+        }
+
+        /// <summary>
+        /// 指定系列是否显示
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public bool IsActive(int index)
+        {
+            var serie = GetSerie(index);
+            return serie == null ? false : serie.show;
+        }
+
+        /// <summary>
+        /// 设置指定系列是否显示
+        /// </summary>
+        /// <param name="name"></param>
+        /// <param name="active"></param>
+        public void SetActive(string name, bool active)
+        {
+            var serie = GetSerie(name);
+            if (serie != null)
+            {
+                serie.show = active;
+            }
+        }
+
+        /// <summary>
+        /// 设置指定系列是否显示
+        /// </summary>
+        /// <param name="index"></param>
+        /// <param name="active"></param>
+        public void SetActive(int index, bool active)
+        {
+            var serie = GetSerie(index);
+            if (serie != null)
+            {
+                serie.show = active;
+            }
+        }
+
+        /// <summary>
+        /// 是否由系列在用指定索引的axis
+        /// </summary>
+        /// <param name="axisIndex"></param>
+        /// <returns></returns>
+        public bool IsUsedAxisIndex(int axisIndex)
+        {
+            foreach (var serie in list)
+            {
+                if (serie.axisIndex == axisIndex) return true;
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 指定系列是否处于高亮选中状态
+        /// </summary>
+        /// <param name="serieIndex"></param>
+        /// <returns></returns>
+        public bool IsHighlight(int serieIndex)
+        {
+            var serie = GetSerie(serieIndex);
+            if (serie != null) return serie.highlighted;
+            else return false;
+        }
+
+        /// <summary>
+        /// 获得维度X的最大最小值
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        /// <param name="axisIndex"></param>
+        /// <param name="minVaule"></param>
+        /// <param name="maxValue"></param>
+        public void GetXMinMaxValue(DataZoom dataZoom, int axisIndex, bool isValueAxis,
+            out int minVaule, out int maxValue)
+        {
+            GetMinMaxValue(dataZoom, axisIndex, isValueAxis, false, out minVaule, out maxValue);
+        }
+
+        /// <summary>
+        /// 获得维度Y的最大最小值
+        /// </summary>
+        /// <param name="dataZoom"></param>
+        /// <param name="axisIndex"></param>
+        /// <param name="minVaule"></param>
+        /// <param name="maxValue"></param>
+        public void GetYMinMaxValue(DataZoom dataZoom, int axisIndex, bool isValueAxis,
+            out int minVaule, out int maxValue)
+        {
+            GetMinMaxValue(dataZoom, axisIndex, isValueAxis, true, out minVaule, out maxValue);
+        }
+
+        private Dictionary<int, List<Serie>> _stackSeriesForMinMax = new Dictionary<int, List<Serie>>();
+        private Dictionary<int, float> _serieTotalValueForMinMax = new Dictionary<int, float>();
+        public void GetMinMaxValue(DataZoom dataZoom, int axisIndex, bool isValueAxis, bool yValue,
+            out int minVaule, out int maxValue)
+        {
+            float min = int.MaxValue;
+            float max = int.MinValue;
+            if (!IsStack() || (isValueAxis && !yValue))
+            {
+                for (int i = 0; i < m_Series.Count; i++)
+                {
+                    if (m_Series[i].axisIndex != axisIndex) continue;
+                    if (IsActive(i))
+                    {
+                        var showData = m_Series[i].GetDataList(dataZoom);
+                        foreach (var data in showData)
+                        {
+                            if (yValue)
+                            {
+                                if (data.data[1] > max) max = data.data[1];
+                                if (data.data[1] < min) min = data.data[1];
+                            }
+                            else
+                            {
+                                if (data.data[0] > max) max = data.data[0];
+                                if (data.data[0] < min) min = data.data[0];
+                            }
+
+                        }
+                    }
+                }
+            }
+            else
+            {
+                GetStackSeries(ref _stackSeriesForMinMax);
+                foreach (var ss in _stackSeriesForMinMax)
+                {
+                    _serieTotalValueForMinMax.Clear();
+                    for (int i = 0; i < ss.Value.Count; i++)
+                    {
+                        var serie = ss.Value[i];
+                        if (serie.axisIndex != axisIndex || !IsActive(i)) continue;
+                        var showData = serie.GetDataList(dataZoom);
+                        for (int j = 0; j < showData.Count; j++)
+                        {
+                            if (!_serieTotalValueForMinMax.ContainsKey(j))
+                                _serieTotalValueForMinMax[j] = 0;
+                            _serieTotalValueForMinMax[j] = _serieTotalValueForMinMax[j] +
+                                (yValue ? showData[j].data[1] : showData[i].data[0]);
+                        }
+                    }
+                    float tmax = int.MinValue;
+                    float tmin = int.MaxValue;
+                    foreach (var tt in _serieTotalValueForMinMax)
+                    {
+                        if (tt.Value > tmax) tmax = tt.Value;
+                        if (tt.Value < tmin) tmin = tt.Value;
+                    }
+                    if (tmax > max) max = tmax;
+                    if (tmin < min) min = tmin;
+                }
+            }
+            if (max == int.MinValue && min == int.MaxValue)
+            {
+                minVaule = 0;
+                maxValue = 0;
+            }
+            else
+            {
+                minVaule = Mathf.FloorToInt(min);
+                maxValue = Mathf.CeilToInt(max);
+            }
+        }
+
+        private HashSet<string> _setForStack = new HashSet<string>();
+        /// <summary>
+        /// 是否由数据堆叠
+        /// </summary>
+        /// <returns></returns>
+        public bool IsStack()
+        {
+            _setForStack.Clear();
+            foreach (var serie in m_Series)
+            {
+                if (string.IsNullOrEmpty(serie.stack)) continue;
+                if (_setForStack.Contains(serie.stack)) return true;
+                else
+                {
+                    _setForStack.Add(serie.stack);
+                }
+            }
+            return false;
+        }
+
+        public bool IsStack(string stackName, SerieType type)
+        {
+            if (string.IsNullOrEmpty(stackName)) return false;
+            int count = 0;
+            foreach (var serie in m_Series)
+            {
+                if (serie.show && serie.type == type)
+                {
+                    if (stackName.Equals(serie.stack)) count++;
+                    if (count >= 2) return true;
+                }
+            }
+            return false;
+        }
+
+        /// <summary>
+        /// 获得堆叠系列列表
+        /// </summary>
+        /// <returns></returns>
+        public Dictionary<int, List<Serie>> GetStackSeries()
+        {
+            int count = 0;
+            Dictionary<string, int> sets = new Dictionary<string, int>();
+            Dictionary<int, List<Serie>> stackSeries = new Dictionary<int, List<Serie>>();
+            for (int i = 0; i < m_Series.Count; i++)
+            {
+                var serie = m_Series[i];
+                serie.index = i;
+                if (string.IsNullOrEmpty(serie.stack))
+                {
+                    stackSeries[count] = new List<Serie>();
+                    stackSeries[count].Add(serie);
+                    count++;
+                }
+                else
+                {
+                    if (!sets.ContainsKey(serie.stack))
+                    {
+                        sets.Add(serie.stack, count);
+                        stackSeries[count] = new List<Serie>();
+                        stackSeries[count].Add(serie);
+                        count++;
+                    }
+                    else
+                    {
+                        int stackIndex = sets[serie.stack];
+                        stackSeries[stackIndex].Add(serie);
+                    }
+                }
+            }
+            return stackSeries;
+        }
+
+        private Dictionary<string, int> sets = new Dictionary<string, int>();
+        /// <summary>
+        /// 获得堆叠系列列表
+        /// </summary>
+        /// <param name="Dictionary<int"></param>
+        /// <param name="stackSeries"></param>
+        public void GetStackSeries(ref Dictionary<int, List<Serie>> stackSeries)
+        {
+            int count = 0;
+            sets.Clear();
+            if (stackSeries == null)
+            {
+                stackSeries = new Dictionary<int, List<Serie>>(m_Series.Count);
+            }
+            else
+            {
+                foreach (var kv in stackSeries)
+                {
+                    kv.Value.Clear();
+                }
+            }
+            for (int i = 0; i < m_Series.Count; i++)
+            {
+                var serie = m_Series[i];
+                serie.index = i;
+                if (string.IsNullOrEmpty(serie.stack))
+                {
+                    if (!stackSeries.ContainsKey(count))
+                        stackSeries[count] = new List<Serie>(m_Series.Count);
+                    stackSeries[count].Add(serie);
+                    count++;
+                }
+                else
+                {
+                    if (!sets.ContainsKey(serie.stack))
+                    {
+                        sets.Add(serie.stack, count);
+                        if (!stackSeries.ContainsKey(count))
+                            stackSeries[count] = new List<Serie>(m_Series.Count);
+                        stackSeries[count].Add(serie);
+                        count++;
+                    }
+                    else
+                    {
+                        int stackIndex = sets[serie.stack];
+                        stackSeries[stackIndex].Add(serie);
+                    }
+                }
+            }
+        }
+
+        private List<string> serieNameList = new List<string>();
+        /// <summary>
+        /// 获得所有系列名，不包含空名字。
+        /// </summary>
+        /// <returns></returns>
+        public List<string> GetSerieNameList()
+        {
+            serieNameList.Clear();
+            for (int n = 0; n < m_Series.Count; n++)
+            {
+                var serie = m_Series[n];
+                switch (serie.type)
+                {
+                    case SerieType.Pie:
+                    case SerieType.Radar:
+                        for (int i = 0; i < serie.data.Count; i++)
+                        {
+                            if (string.IsNullOrEmpty(serie.data[i].name))
+                                serieNameList.Add(ChartCached.IntToStr(i));
+                            else if (!serieNameList.Contains(serie.data[i].name))
+                                serieNameList.Add(serie.data[i].name);
+                        }
+                        break;
+                    default:
+                        if (string.IsNullOrEmpty(serie.name))
+                            serieNameList.Add(ChartCached.IntToStr(n));
+                        else if (!serieNameList.Contains(serie.name))
+                            serieNameList.Add(serie.name);
+                        break;
+                }
+            }
+            return serieNameList;
+        }
+
+        /// <summary>
+        /// 设置获得标志图形大小的回调
+        /// </summary>
+        /// <param name="size"></param>
+        /// <param name="selectedSize"></param>
+        public void SetSerieSymbolSizeCallback(SymbolSizeCallback size, SymbolSizeCallback selectedSize)
+        {
+            foreach (var serie in m_Series)
+            {
+                serie.symbol.sizeCallback = size;
+                serie.symbol.selectedSizeCallback = selectedSize;
+            }
+        }
+
+        /// <summary>
+        /// 启用或取消初始动画
+        /// </summary>
+        public void AnimationEnable(bool flag)
+        {
+            foreach (var serie in m_Series)
+            {
+                serie.animation.enable = flag;
+            }
+        }
+
+        /// <summary>
+        /// 开始初始动画
+        /// </summary>
+        public void AnimationStart()
+        {
+            foreach (var serie in m_Series)
+            {
+                if (serie.animation.enable)
+                {
+                    serie.animation.Start();
+                }
+            }
+        }
+
+        /// <summary>
+        /// 停止初始动画
+        /// </summary>
+        public void AnimationStop()
+        {
+            foreach (var serie in m_Series)
+            {
+                if (serie.animation.enable) serie.animation.Stop();
+            }
+        }
+
+        /// <summary>
+        /// 重置初始动画
+        /// </summary>
+        public void AnimationReset()
+        {
+            foreach (var serie in m_Series)
+            {
+                if (serie.animation.enable) serie.animation.Reset();
+            }
+        }
+
+        public bool IsLegalLegendName(string name)
+        {
+            int numName = -1;
+            if (int.TryParse(name, out numName))
+            {
+                if (numName >= 0 && numName < list.Count) return false;
+            }
+            return true;
+        }
+
+        /// <summary>
+        /// 从json中解析数据
+        /// </summary>
+        /// <param name="jsonData"></param>
+        public override void ParseJsonData(string jsonData)
+        {
+            //TODO:
+        }
+    }
+}

Scripts/UI/Component/Main/Series.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 57c808a15402a4d25a51a37cbb655a85
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Settings.cs

@@ -0,0 +1,52 @@
+using UnityEngine;
+using System;
+
+namespace XCharts
+{
+    /// <summary>
+    /// Global parameter setting component. The default value can be used in general, and can be adjusted when necessary.
+    /// 全局参数设置组件。一般情况下可使用默认值，当有需要时可进行调整。
+    /// </summary>
+    [Serializable]
+    public class Settings
+    {
+        [SerializeField] [Range(1, 10)] protected float m_LineSmoothStyle = 3f;
+        [SerializeField] [Range(1f, 20)] protected float m_LineSmoothness = 2f;
+        [SerializeField] [Range(1f, 20)] protected float m_LineSegmentDistance = 3f;
+        [SerializeField] [Range(1, 10)] protected float m_CicleSmoothness = 2f;
+        [SerializeField] [Range(10, 50)] protected float m_VisualMapTriangeLen = 20f;
+
+        /// <summary>
+        /// Curve smoothing factor. By adjusting the smoothing coefficient, the curvature of the curve can be changed, 
+        /// and different curves with slightly different appearance can be obtained.
+        /// 曲线平滑系数。通过调整平滑系数可以改变曲线的曲率，得到外观稍微有变化的不同曲线。
+        /// </summary>
+        public float lineSmoothStyle { get { return m_LineSmoothStyle; } set { m_LineSmoothStyle = value <= 0 ? 1f : value; } }
+        /// <summary>
+        /// Smoothness of curve. The smaller the value, the smoother the curve, but the number of vertices will increase. 
+        /// When the area with gradient is filled, the larger the value, the worse the transition effect.
+        /// 曲线平滑度。值越小曲线越平滑，但顶点数也会随之增加。当开启有渐变的区域填充时，数值越大渐变过渡效果越差。
+        /// </summary>
+        /// <value></value>
+        public float lineSmoothness { get { return m_LineSmoothness; } set { m_LineSmoothness = value <= 0 ? 1f : value; } }
+        /// <summary>
+        /// The partition distance of a line segment. A line in a normal line chart is made up of many segments, 
+        /// the number of which is determined by the change in value. The smaller the number of segments, 
+        /// the higher the number of vertices. When the area with gradient is filled, the larger the value, the worse the transition effect.
+        /// 线段的分割距离。普通折线图的线是由很多线段组成，段数由该数值决定。值越小段数越多，但顶点数也会随之增加。当开启有渐变的区域填充时，数值越大渐变过渡效果越差。
+        /// </summary>
+        /// <value></value>
+        public float lineSegmentDistance { get { return m_LineSegmentDistance; } set { m_LineSegmentDistance = value <= 0 ? 1f : value; } }
+        /// <summary>
+        /// the smoothess of cricle.
+        /// 圆形的平滑度。数越小圆越平滑，但顶点数也会随之增加。
+        /// </summary>
+        public float cicleSmoothness { get { return m_CicleSmoothness; } set { m_CicleSmoothness = value <= 0 ? 1f : value; } }
+        /// <summary>
+        /// 可视化组件的调节三角形变长。
+        /// </summary>
+        /// <value></value>
+        public float visualMapTriangeLen { get { return m_VisualMapTriangeLen; } set { m_VisualMapTriangeLen = value <= 0 ? 1f : value; } }
+
+    }
+}

Scripts/UI/Component/Main/Settings.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 40d2c2f38d80f4b42acdba7db6918f14
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Theme.cs

@@ -0,0 +1,636 @@
+using System.Collections.Generic;
+using UnityEngine;
+using System;
+using UnityEngine.Serialization;
+
+namespace XCharts
+{
+    /// <summary>
+    /// 主题
+    /// </summary>
+    public enum Theme
+    {
+        /// <summary>
+        /// 默认主题。
+        /// </summary>
+        Default,
+        /// <summary>
+        /// 亮主题。
+        /// </summary>
+        Light,
+        /// <summary>
+        /// 暗主题。
+        /// </summary>
+        Dark
+    }
+
+    [Serializable]
+    /// <summary>
+    /// Theme.
+    /// 主题相关配置。
+    /// </summary>
+    public class ThemeInfo : IEquatable<ThemeInfo>
+    {
+        [SerializeField] private Theme m_Theme = Theme.Default;
+        [SerializeField] private Font m_Font;
+        [SerializeField] private Color32 m_BackgroundColor;
+        [FormerlySerializedAs("m_TextColor")]
+        [SerializeField] private Color32 m_TitleTextColor;
+        [SerializeField] private Color32 m_TitleSubTextColor;
+        [SerializeField] private Color32 m_LegendTextColor;
+        [SerializeField] private Color32 m_LegendUnableColor;
+        [SerializeField] private Color32 m_AxisTextColor;
+        [SerializeField] private Color32 m_AxisLineColor;
+        [SerializeField] private Color32 m_AxisSplitLineColor;
+        [SerializeField] private Color32 m_TooltipBackgroundColor;
+        [SerializeField] private Color32 m_TooltipFlagAreaColor;
+        [SerializeField] private Color32 m_TooltipTextColor;
+        [SerializeField] private Color32 m_TooltipLabelColor;
+        [SerializeField] private Color32 m_TooltipLineColor;
+        [SerializeField] private Color32 m_DataZoomTextColor;
+        [SerializeField] private Color32 m_DataZoomLineColor;
+        [SerializeField] private Color32 m_DataZoomSelectedColor;
+        [SerializeField] private Color32 m_VisualMapBackgroundColor;
+        [SerializeField] private Color32 m_VisualMapBorderColor;
+        [SerializeField] private Color32[] m_ColorPalette;
+
+        [SerializeField] private Font m_CustomFont;
+        [SerializeField] private Color32 m_CustomBackgroundColor;
+        [FormerlySerializedAs("m_CustomTextColor")]
+        [SerializeField] private Color32 m_CustomTitleTextColor;
+        [SerializeField] private Color32 m_CustomTitleSubTextColor;
+        [SerializeField] private Color32 m_CustomLegendTextColor;
+        [SerializeField] private Color32 m_CustomLegendUnableColor;
+        [SerializeField] private Color32 m_CustomAxisTextColor;
+        [SerializeField] private Color32 m_CustomAxisLineColor;
+        [SerializeField] private Color32 m_CustomAxisSplitLineColor;
+        [SerializeField] private Color32 m_CustomTooltipBackgroundColor;
+        [SerializeField] private Color32 m_CustomTooltipFlagAreaColor;
+        [SerializeField] private Color32 m_CustomTooltipTextColor;
+        [SerializeField] private Color32 m_CustomTooltipLabelColor;
+        [SerializeField] private Color32 m_CustomTooltipLineColor;
+        [SerializeField] private Color32 m_CustomDataZoomTextColor;
+        [SerializeField] private Color32 m_CustomDataZoomLineColor;
+        [SerializeField] private Color32 m_CustomDataZoomSelectedColor;
+        [SerializeField] private Color32 m_CustomVisualMapBackgroundColor;
+        [SerializeField] private Color32 m_CustomVisualMapBorderColor;
+        [SerializeField] private List<Color32> m_CustomColorPalette = new List<Color32>(13);
+        /// <summary>
+        /// the theme of chart.
+        /// 主题类型。
+        /// </summary>
+        public Theme theme { get { return m_Theme; } set { m_Theme = value; } }
+        /// <summary>
+        /// the font of chart text。
+        /// 字体。
+        /// </summary>
+        public Font font
+        {
+            get { return m_CustomFont != null ? m_CustomFont : m_Font; }
+            set { m_CustomFont = value; }
+        }
+        /// <summary>
+        /// the background color of chart.
+        /// 背景颜色。
+        /// </summary>
+        public Color32 backgroundColor
+        {
+            get { return m_CustomBackgroundColor != Color.clear ? m_CustomBackgroundColor : m_BackgroundColor; }
+            set { m_CustomBackgroundColor = value; }
+        }
+        /// <summary>
+        /// the main title text color.
+        /// 主标题颜色。
+        /// </summary>
+        public Color32 titleTextColor
+        {
+            get { return m_CustomTitleTextColor != Color.clear ? m_CustomTitleTextColor : m_TitleTextColor; }
+            set { m_CustomTitleTextColor = value; }
+        }
+        /// <summary>
+        /// the subtitie text color.
+        /// 副标题颜色。
+        /// </summary>
+        public Color32 titleSubTextColor
+        {
+            get { return m_CustomTitleSubTextColor != Color.clear ? m_CustomTitleSubTextColor : m_TitleSubTextColor; }
+            set { m_CustomTitleSubTextColor = value; }
+        }
+        /// <summary>
+        /// the legend text color.
+        /// 图例文字的颜色。
+        /// </summary>
+        public Color32 legendTextColor
+        {
+            get { return m_CustomLegendTextColor != Color.clear ? m_CustomLegendTextColor : m_LegendTextColor; }
+            set { m_CustomLegendTextColor = value; }
+        }
+        /// <summary>
+        /// the legend unable text color.
+        /// 图例变为不可用时的按钮颜色。
+        /// </summary>
+        public Color32 legendUnableColor
+        {
+            get { return m_CustomLegendUnableColor != Color.clear ? m_CustomLegendUnableColor : m_LegendUnableColor; }
+            set { m_CustomLegendUnableColor = value; }
+        }
+        /// <summary>
+        /// the axis text color.
+        /// 坐标轴上标签的颜色。
+        /// </summary>
+        public Color32 axisTextColor
+        {
+            get { return m_CustomAxisTextColor != Color.clear ? m_CustomAxisTextColor : m_AxisTextColor; }
+            set { m_CustomAxisTextColor = value; }
+        }
+        /// <summary>
+        /// the color of axis line.
+        /// 坐标轴轴线的颜色。
+        /// </summary>
+        public Color32 axisLineColor
+        {
+            get { return m_CustomAxisLineColor != Color.clear ? m_CustomAxisLineColor : m_AxisLineColor; }
+            set { m_CustomAxisLineColor = value; }
+        }
+        /// <summary>
+        /// the color of axis split line.
+        /// 分割线的颜色，默认和坐标轴轴线颜色一致。
+        /// </summary>
+        public Color32 axisSplitLineColor
+        {
+            get { return m_CustomAxisSplitLineColor != Color.clear ? m_CustomAxisSplitLineColor : m_AxisSplitLineColor; }
+            set { m_CustomAxisSplitLineColor = value; }
+        }
+        /// <summary>
+        /// the tooltip background color.
+        /// 提示框背景颜色。
+        /// </summary>
+        public Color32 tooltipBackgroundColor
+        {
+            get { return m_CustomTooltipBackgroundColor != Color.clear ? m_CustomTooltipBackgroundColor : m_TooltipBackgroundColor; }
+            set { m_CustomTooltipBackgroundColor = value; }
+        }
+        /// <summary>
+        /// the color of tooltip shadow crosshair indicator. 
+        /// 提示框阴影指示器的颜色。
+        /// </summary>
+        public Color32 tooltipFlagAreaColor
+        {
+            get { return m_CustomTooltipFlagAreaColor != Color.clear ? m_CustomTooltipFlagAreaColor : m_TooltipFlagAreaColor; }
+            set { m_CustomTooltipFlagAreaColor = value; }
+        }
+        /// <summary>
+        /// the color of tooltip text.
+        /// 提示框文字颜色。
+        /// </summary>
+        public Color32 tooltipTextColor
+        {
+            get { return m_CustomTooltipTextColor != Color.clear ? m_CustomTooltipTextColor : m_TooltipTextColor; }
+            set { m_CustomTooltipTextColor = value; }
+        }
+        /// <summary>
+        /// the background color of tooltip cross indicator's axis label.
+        /// 提示框的十字指示器坐标轴标签的背景颜色。
+        /// </summary>
+        public Color32 tooltipLabelColor
+        {
+            get { return m_CustomTooltipLabelColor != Color.clear ? m_CustomTooltipLabelColor : m_TooltipLabelColor; }
+            set { m_CustomTooltipLabelColor = value; }
+        }
+        /// <summary>
+        /// the color tooltip indicator line.
+        /// 提示框的指示线的颜色。
+        /// </summary>
+        public Color32 tooltipLineColor
+        {
+            get { return m_CustomTooltipLineColor != Color.clear ? m_CustomTooltipLineColor : m_TooltipLineColor; }
+            set { m_CustomTooltipLineColor = value; }
+        }
+        /// <summary>
+        /// the color of datazoom text.
+        /// 区域缩放的文字颜色。
+        /// </summary>
+        public Color32 dataZoomTextColor
+        {
+            get { return m_CustomDataZoomTextColor != Color.clear ? m_CustomDataZoomTextColor : m_DataZoomTextColor; }
+            set { m_CustomDataZoomTextColor = value; }
+        }
+        /// <summary>
+        /// the color of datazoom line.
+        /// 区域缩放的线条颜色。
+        /// </summary>
+        public Color32 dataZoomLineColor
+        {
+            get { return m_CustomDataZoomLineColor != Color.clear ? m_CustomDataZoomLineColor : m_DataZoomLineColor; }
+            set { m_CustomDataZoomLineColor = value; }
+        }
+        /// <summary>
+        /// the color of datazoom selected area.
+        /// 区域缩放的选中区域颜色。
+        /// </summary>
+        public Color32 dataZoomSelectedColor
+        {
+            get { return m_CustomDataZoomSelectedColor != Color.clear ? m_CustomDataZoomSelectedColor : m_DataZoomSelectedColor; }
+            set { m_CustomDataZoomSelectedColor = value; }
+        }
+
+        /// <summary>
+        /// 视觉映射组件的背景色。
+        /// </summary>
+        public Color32 visualMapBackgroundColor
+        {
+            get { return m_CustomVisualMapBackgroundColor != Color.clear ? m_CustomVisualMapBackgroundColor : m_VisualMapBackgroundColor; }
+            set { m_CustomVisualMapBackgroundColor = value; }
+        }
+
+        /// <summary>
+        /// 视觉映射的边框色。
+        /// </summary>
+        public Color32 visualMapBorderColor
+        {
+            get { return m_CustomVisualMapBorderColor != Color.clear ? m_CustomVisualMapBorderColor : m_VisualMapBorderColor; }
+            set { m_CustomVisualMapBorderColor = value; }
+        }
+
+        /// <summary>
+        /// The color list of palette. If no color is set in series, the colors would be adopted sequentially and circularly from this list as the colors of series.
+        /// 调色盘颜色列表。如果系列没有设置颜色，则会依次循环从该列表中取颜色作为系列颜色。
+        /// </summary>
+        public List<Color32> colorPalette { set { m_CustomColorPalette = value; } }
+
+        /// <summary>
+        /// Gets the color of the specified index from the palette. 
+        /// 获得调色盘对应系列索引的颜色值。
+        /// </summary>
+        /// <param name="index">编号索引</param>
+        /// <returns>the color,or Color.clear when failed.颜色值，失败时返回Color.clear</returns>
+        public Color32 GetColor(int index)
+        {
+            if (index < 0) index = 0;
+            if (m_CustomColorPalette.Count > 0)
+            {
+                var customIndex = index < m_CustomColorPalette.Count ? index : index % m_CustomColorPalette.Count;
+                if (customIndex < m_CustomColorPalette.Count && m_CustomColorPalette[customIndex] != Color.clear)
+                {
+                    return m_CustomColorPalette[customIndex];
+                }
+            }
+            var newIndex = index < m_ColorPalette.Length ? index : index % m_ColorPalette.Length;
+            if (newIndex < m_ColorPalette.Length)
+                return m_ColorPalette[newIndex];
+            else return Color.clear;
+        }
+
+        Dictionary<int, string> _colorDic = new Dictionary<int, string>();
+        /// <summary>
+        /// Gets the hexadecimal color string of the specified index from the palette. 
+        /// 获得指定索引的十六进制颜色值字符串。
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public string GetColorStr(int index)
+        {
+            if (index < 0)
+            {
+                index = 0;
+            }
+            index = index % m_ColorPalette.Length;
+            if (_colorDic.ContainsKey(index)) return _colorDic[index];
+            else
+            {
+                _colorDic[index] = ColorUtility.ToHtmlStringRGBA(GetColor(index));
+                return _colorDic[index];
+            }
+        }
+
+        /// <summary>
+        /// copy all configurations from theme. 
+        /// 复制主题的所有配置。
+        /// </summary>
+        /// <param name="theme"></param>
+        public void Copy(ThemeInfo theme)
+        {
+            m_Theme = theme.theme;
+            m_Font = theme.m_Font;
+            m_BackgroundColor = theme.m_BackgroundColor;
+            m_LegendUnableColor = theme.m_LegendUnableColor;
+            m_TitleTextColor = theme.m_TitleTextColor;
+            m_TitleSubTextColor = theme.m_TitleSubTextColor;
+            m_LegendTextColor = theme.m_LegendTextColor;
+            m_AxisTextColor = theme.m_AxisTextColor;
+            m_AxisLineColor = theme.m_AxisLineColor;
+            m_AxisSplitLineColor = theme.m_AxisSplitLineColor;
+            m_TooltipBackgroundColor = theme.m_TooltipBackgroundColor;
+            m_TooltipTextColor = theme.m_TooltipTextColor;
+            m_TooltipLabelColor = theme.m_TooltipLabelColor;
+            m_TooltipLineColor = theme.m_TooltipLineColor;
+            m_DataZoomLineColor = theme.m_DataZoomLineColor;
+            m_DataZoomSelectedColor = theme.m_DataZoomSelectedColor;
+            m_DataZoomTextColor = theme.m_DataZoomTextColor;
+            m_VisualMapBackgroundColor = theme.m_VisualMapBackgroundColor;
+            m_VisualMapBorderColor = theme.m_VisualMapBorderColor;
+            m_ColorPalette = new Color32[theme.m_ColorPalette.Length];
+            for (int i = 0; i < theme.m_ColorPalette.Length; i++)
+            {
+                m_ColorPalette[i] = theme.m_ColorPalette[i];
+            }
+        }
+
+        /// <summary>
+        /// Clear all custom configurations. 
+        /// 重置，清除所有自定义配置。
+        /// </summary>
+        public void Reset()
+        {
+            m_Theme = Theme.Default;
+            m_Font = null;
+            m_BackgroundColor = Color.clear;
+            m_LegendUnableColor = Color.clear;
+            m_TitleTextColor = Color.clear;
+            m_TitleSubTextColor = Color.clear;
+            m_LegendTextColor = Color.clear;
+            m_AxisTextColor = Color.clear;
+            m_AxisLineColor = Color.clear;
+            m_AxisSplitLineColor = Color.clear;
+            m_TooltipBackgroundColor = Color.clear;
+            m_TooltipTextColor = Color.clear;
+            m_TooltipLabelColor = Color.clear;
+            m_TooltipLineColor = Color.clear;
+            m_DataZoomLineColor = Color.clear;
+            m_DataZoomSelectedColor = Color.clear;
+            m_DataZoomTextColor = Color.clear;
+            m_VisualMapBackgroundColor = Color.clear;
+            m_VisualMapBorderColor = Color.clear;
+            for (int i = 0; i < m_CustomColorPalette.Count; i++)
+            {
+                m_CustomColorPalette[i] = Color.clear;
+            }
+        }
+
+        /// <summary>
+        /// default theme. 
+        /// 默认主题。
+        /// </summary>
+        /// <value></value>
+        public static ThemeInfo Default
+        {
+            get
+            {
+                return new ThemeInfo()
+                {
+                    m_Theme = Theme.Default,
+                    m_Font = Resources.GetBuiltinResource<Font>("Arial.ttf"),
+                    m_BackgroundColor = new Color32(255, 255, 255, 255),
+                    m_LegendUnableColor = GetColor("#cccccc"),
+                    m_TitleTextColor = GetColor("#514D4D"),
+                    m_TitleSubTextColor = GetColor("#514D4D"),
+                    m_LegendTextColor = GetColor("#eee"),
+                    m_AxisTextColor = GetColor("#514D4D"),
+                    m_AxisLineColor = GetColor("#514D4D"),
+                    m_AxisSplitLineColor = GetColor("#51515120"),
+                    m_TooltipBackgroundColor = GetColor("#515151C8"),
+                    m_TooltipTextColor = GetColor("#FFFFFFFF"),
+                    m_TooltipFlagAreaColor = GetColor("#51515120"),
+                    m_TooltipLabelColor = GetColor("#292929FF"),
+                    m_TooltipLineColor = GetColor("#29292964"),
+                    m_DataZoomLineColor = GetColor("#51515120"),
+                    m_DataZoomSelectedColor = GetColor("#51515120"),
+                    m_DataZoomTextColor = GetColor("#514D4D"),
+                    m_VisualMapBackgroundColor = GetColor("#51515120"),
+                    m_VisualMapBorderColor = GetColor("#cccccc"),
+                    m_ColorPalette = new Color32[]
+                    {
+                        new Color32(194, 53, 49, 255),
+                        new Color32(47, 69, 84, 255),
+                        new Color32(97, 160, 168, 255),
+                        new Color32(212, 130, 101, 255),
+                        new Color32(145, 199, 174, 255),
+                        new Color32(116, 159, 131, 255),
+                        new Color32(202, 134, 34, 255),
+                        new Color32(189, 162, 154, 255),
+                        new Color32(110, 112, 116, 255),
+                        new Color32(84, 101, 112, 255),
+                        new Color32(196, 204, 211, 255)
+                    },
+                    m_CustomColorPalette = new List<Color32>{
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear
+                    }
+                };
+            }
+        }
+
+        /// <summary>
+        /// light theme. 
+        /// 亮主题。
+        /// </summary>
+        /// <value></value>
+        public static ThemeInfo Light
+        {
+            get
+            {
+                return new ThemeInfo()
+                {
+                    m_Theme = Theme.Light,
+                    m_Font = Resources.GetBuiltinResource<Font>("Arial.ttf"),
+                    m_BackgroundColor = new Color32(255, 255, 255, 255),
+                    m_LegendUnableColor = GetColor("#cccccc"),
+                    m_TitleTextColor = GetColor("#514D4D"),
+                    m_TitleSubTextColor = GetColor("#514D4D"),
+                    m_LegendTextColor = GetColor("#514D4D"),
+                    m_AxisTextColor = GetColor("#514D4D"),
+                    m_AxisLineColor = GetColor("#514D4D"),
+                    m_AxisSplitLineColor = GetColor("#51515120"),
+                    m_TooltipBackgroundColor = GetColor("#515151C8"),
+                    m_TooltipTextColor = GetColor("#FFFFFFFF"),
+                    m_TooltipFlagAreaColor = GetColor("#51515120"),
+                    m_TooltipLabelColor = GetColor("#292929FF"),
+                    m_TooltipLineColor = GetColor("#29292964"),
+                    m_DataZoomLineColor = GetColor("#51515120"),
+                    m_DataZoomSelectedColor = GetColor("#51515120"),
+                    m_DataZoomTextColor = GetColor("#514D4D"),
+                    m_VisualMapBackgroundColor = GetColor("#51515120"),
+                    m_VisualMapBorderColor = GetColor("#cccccc"),
+                    m_ColorPalette = new Color32[]
+                    {
+                        new Color32(55, 162, 218, 255),
+                        new Color32(255, 159, 127, 255),
+                        new Color32(50, 197, 233, 255),
+                        new Color32(251, 114, 147, 255),
+                        new Color32(103, 224, 227, 255),
+                        new Color32(224, 98, 174, 255),
+                        new Color32(159, 230, 184, 255),
+                        new Color32(230, 144, 209, 255),
+                        new Color32(255, 219, 92, 255),
+                        new Color32(230, 188, 243, 255),
+                        new Color32(157, 150, 245, 255),
+                        new Color32(131, 120, 234, 255),
+                        new Color32(150, 191, 255, 255)
+                    },
+                    m_CustomColorPalette = new List<Color32>{
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear
+                    }
+                };
+            }
+        }
+
+        /// <summary>
+        /// dark theme. 
+        /// 暗主题。
+        /// </summary>
+        /// <value></value>
+        public static ThemeInfo Dark
+        {
+            get
+            {
+                return new ThemeInfo()
+                {
+                    m_Theme = Theme.Dark,
+                    m_Font = Resources.GetBuiltinResource<Font>("Arial.ttf"),
+                    m_LegendUnableColor = GetColor("#cccccc"),
+                    m_BackgroundColor = new Color32(34, 34, 34, 255),
+                    m_TitleTextColor = GetColor("#eee"),
+                    m_TitleSubTextColor = GetColor("#eee"),
+                    m_LegendTextColor = GetColor("#eee"),
+                    m_AxisTextColor = GetColor("#eee"),
+                    m_AxisLineColor = GetColor("#eee"),
+                    m_AxisSplitLineColor = GetColor("#aaa"),
+                    m_TooltipBackgroundColor = GetColor("#515151C8"),
+                    m_TooltipTextColor = GetColor("#FFFFFFFF"),
+                    m_TooltipFlagAreaColor = GetColor("#51515120"),
+                    m_TooltipLabelColor = GetColor("#A7A7A7FF"),
+                    m_TooltipLineColor = GetColor("#eee"),
+                    m_DataZoomLineColor = GetColor("#FFFFFF45"),
+                    m_DataZoomSelectedColor = GetColor("#D0D0D03D"),
+                    m_DataZoomTextColor = GetColor("#FFFFFFFF"),
+                    m_VisualMapBackgroundColor = GetColor("#aaa"),
+                    m_VisualMapBorderColor = GetColor("#cccccc"),
+                    m_ColorPalette = new Color32[]
+                    {
+                        new Color32(221, 107, 102, 255),
+                        new Color32(117, 154, 160, 255),
+                        new Color32(230, 157, 135, 255),
+                        new Color32(141, 193, 169, 255),
+                        new Color32(234, 126, 83, 255),
+                        new Color32(238, 221, 120, 255),
+                        new Color32(115, 163, 115, 255),
+                        new Color32(115, 185, 188, 255),
+                        new Color32(114, 137, 171, 255),
+                        new Color32(145, 202, 140, 255),
+                        new Color32(244, 159, 66, 255)
+                    },
+                    m_CustomColorPalette = new List<Color32>{
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear,
+                        Color.clear
+                    }
+                };
+            }
+        }
+
+        /// <summary>
+        /// Convert the html string to color. 
+        /// 将字符串颜色值转成Color。
+        /// </summary>
+        /// <param name="hexColorStr"></param>
+        /// <returns></returns>
+        public static Color32 GetColor(string hexColorStr)
+        {
+            Color color;
+            ColorUtility.TryParseHtmlString(hexColorStr, out color);
+            return (Color32)color;
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is ThemeInfo)
+            {
+                return Equals((ThemeInfo)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(ThemeInfo other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return m_Font == other.m_Font &&
+                ChartHelper.IsValueEqualsColor(m_LegendUnableColor, other.m_LegendUnableColor) &&
+                ChartHelper.IsValueEqualsColor(m_BackgroundColor, other.m_BackgroundColor) &&
+                ChartHelper.IsValueEqualsColor(m_TitleTextColor, other.m_TitleTextColor) &&
+                ChartHelper.IsValueEqualsColor(m_TitleSubTextColor, other.m_TitleSubTextColor) &&
+                ChartHelper.IsValueEqualsColor(m_AxisTextColor, other.m_AxisTextColor) &&
+                ChartHelper.IsValueEqualsColor(m_AxisLineColor, other.m_AxisLineColor) &&
+                ChartHelper.IsValueEqualsColor(m_AxisSplitLineColor, other.m_AxisSplitLineColor) &&
+                ChartHelper.IsValueEqualsColor(m_TooltipBackgroundColor, other.m_TooltipBackgroundColor) &&
+                ChartHelper.IsValueEqualsColor(m_AxisSplitLineColor, other.m_AxisSplitLineColor) &&
+                ChartHelper.IsValueEqualsColor(m_TooltipTextColor, other.m_TooltipTextColor) &&
+                ChartHelper.IsValueEqualsColor(m_TooltipFlagAreaColor, other.m_TooltipFlagAreaColor) &&
+                ChartHelper.IsValueEqualsColor(m_DataZoomLineColor, other.m_DataZoomLineColor) &&
+                ChartHelper.IsValueEqualsColor(m_DataZoomSelectedColor, other.m_DataZoomSelectedColor) &&
+                ChartHelper.IsValueEqualsColor(m_DataZoomTextColor, other.m_DataZoomTextColor) &&
+                m_ColorPalette.Length == other.m_ColorPalette.Length;
+        }
+
+        public static bool operator ==(ThemeInfo left, ThemeInfo right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(ThemeInfo left, ThemeInfo right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+    }
+}

Scripts/UI/Component/Main/Theme.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 7fa63cd119419441789620060693a7cb
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Title.cs

@@ -0,0 +1,148 @@
+using UnityEngine;
+using System;
+
+namespace XCharts
+{
+    /// <summary>
+    /// Title component, including main title and subtitle.
+    /// 标题组件，包含主标题和副标题。
+    /// </summary>
+    [Serializable]
+    public class Title : IPropertyChanged, IEquatable<Title>
+    {
+        [SerializeField] private bool m_Show = true;
+        [SerializeField] private string m_Text;
+        [SerializeField] private int m_TextFontSize;
+        [SerializeField] private string m_SubText;
+        [SerializeField] private int m_SubTextFontSize;
+        [SerializeField] private float m_ItemGap;
+        [SerializeField] private Location m_Location;
+
+        /// <summary>
+        /// [default:true]
+        /// Set this to false to prevent the title from showing.
+        /// 是否显示标题组件。
+        /// </summary>
+        public bool show { get { return m_Show; } set { m_Show = value; } }
+        /// <summary>
+        /// The main title text, supporting for \n for newlines.
+        /// 主标题文本，支持使用 \n 换行。
+        /// </summary>
+        public string text { get { return m_Text; } set { m_Text = value; } }
+        /// <summary>
+        /// [default:16]
+        /// main title font size.
+        /// 主标题文字的字体大小。
+        /// </summary>
+        public int textFontSize { get { return m_TextFontSize; } set { m_TextFontSize = value; } }
+        /// <summary>
+        /// Subtitle text, supporting for \n for newlines.
+        /// 副标题文本，支持使用 \n 换行。
+        /// </summary>
+        public string subText { get { return m_SubText; } set { m_Text = value; } }
+        /// <summary>
+        /// [default:14]
+        /// subtitle font size.
+        /// 副标题文字的字体大小。
+        /// </summary>
+        public int subTextFontSize { get { return m_SubTextFontSize; } set { m_SubTextFontSize = value; } }
+        /// <summary>
+        /// [default:14]
+        /// The gap between the main title and subtitle.
+        /// 主副标题之间的间距。
+        /// </summary>
+        public float itemGap { get { return m_ItemGap; } set { m_ItemGap = value; } }
+        /// <summary>
+        /// The location of title component.
+        /// 标题显示位置。
+        /// </summary>
+        public Location location { get { return m_Location; } set { m_Location = value; } }
+
+        public static Title defaultTitle
+        {
+            get
+            {
+                var title = new Title
+                {
+                    m_Show = true,
+                    m_Text = "Chart Title",
+                    m_TextFontSize = 16,
+                    m_SubText = "",
+                    m_SubTextFontSize = 14,
+                    m_ItemGap = 14,
+                    m_Location = Location.defaultTop
+                };
+                return title;
+            }
+        }
+        public void Copy(Title title)
+        {
+            m_Show = title.show;
+            m_Text = title.text;
+            m_TextFontSize = title.textFontSize;
+            m_SubText = title.subText;
+            m_SubTextFontSize = title.subTextFontSize;
+            m_ItemGap = title.itemGap;
+            m_Location.Copy(title.location);
+        }
+
+        public override bool Equals(object obj)
+        {
+            if (ReferenceEquals(null, obj))
+            {
+                return false;
+            }
+            else if (obj is Title)
+            {
+                return Equals((Title)obj);
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool Equals(Title other)
+        {
+            if (ReferenceEquals(null, other))
+            {
+                return false;
+            }
+            return m_Show == other.show &&
+                m_Text.Equals(other.text) &&
+                m_TextFontSize == other.textFontSize &&
+                m_SubText.Equals(other.subText) &&
+                m_SubTextFontSize == other.subTextFontSize &&
+                m_ItemGap == other.itemGap &&
+                m_Location.Equals(other.location);
+        }
+
+        public static bool operator ==(Title left, Title right)
+        {
+            if (ReferenceEquals(left, null) && ReferenceEquals(right, null))
+            {
+                return true;
+            }
+            else if (ReferenceEquals(left, null) || ReferenceEquals(right, null))
+            {
+                return false;
+            }
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(Title left, Title right)
+        {
+            return !(left == right);
+        }
+
+        public override int GetHashCode()
+        {
+            return base.GetHashCode();
+        }
+
+        public void OnChanged()
+        {
+            m_Location.OnChanged();
+        }
+    }
+}

Scripts/UI/Component/Main/Title.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 91e9a1a59b4b64142a9aa260f618c1c1
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/Tooltip.cs

@@ -0,0 +1,390 @@
+using System.Collections.Generic;
+using System;
+using UnityEngine;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// Tooltip component.
+    /// 提示框组件
+    /// </summary>
+    [System.Serializable]
+    public class Tooltip
+    {
+        /// <summary>
+        /// Indicator type.
+        /// 指示器类型。
+        /// </summary>
+        public enum Type
+        {
+            /// <summary>
+            /// line indicator.
+            /// 直线指示器
+            /// </summary>
+            Line,
+            /// <summary>
+            /// shadow crosshair indicator.
+            /// 阴影指示器
+            /// </summary>
+            Shadow,
+            /// <summary>
+            /// no indicator displayed.
+            /// 无指示器
+            /// </summary>
+            None,
+            /// <summary>
+            /// crosshair indicator, which is actually the shortcut of enable two axisPointers of two orthometric axes.
+            /// 十字准星指示器。坐标轴显示Label和交叉线。
+            /// </summary>
+            Corss
+        }
+
+        [SerializeField] private bool m_Show;
+        [SerializeField] private Type m_Type;
+        [SerializeField] private string m_Formatter;
+        [SerializeField] private float m_FixedWidth = 0;
+        [SerializeField] private float m_FixedHeight = 0;
+        [SerializeField] private float m_MinWidth = 0;
+        [SerializeField] private float m_MinHeight = 0;
+        [SerializeField] private int m_FontSize = 18;
+        [SerializeField] private FontStyle m_FontStyle = FontStyle.Normal;
+
+        private GameObject m_GameObject;
+        private GameObject m_Content;
+        private Text m_ContentText;
+        private RectTransform m_ContentRect;
+        private List<int> lastDataIndex { get; set; }
+
+        /// <summary>
+        /// Whether to show the tooltip component.
+        /// 是否显示提示框组件。
+        /// </summary>
+        /// <returns></returns>
+        public bool show { get { return m_Show; } set { m_Show = value; SetActive(value); } }
+        /// <summary>
+        /// Indicator type.
+        /// 提示框指示器类型。
+        /// </summary>
+        public Type type { get { return m_Type; } set { m_Type = value; } }
+        /// <summary>
+        /// 提示框内容字符串模版格式器。支持用 \n 或 "<br/>" 换行。
+        /// 模板变量有 {a}, {b}，{c}，{d}，{e}，分别表示系列名，数据名，数据值等。
+        /// 其中变量{a}, {b}, {c}, {d}在不同图表类型下代表数据含义为：
+        /// <list type="bullet">
+        /// <item><description>折线（区域）图、柱状（条形）图、K线图 : {a}（系列名称），{b}（类目值），{c}（数值）, {d}（无）。</description></item>
+        /// <item><description>散点图（气泡）图 : {a}（系列名称），{b}（数据名称），{c}（数值数组）, {d}（无）。</description></item>
+        /// <item><description>地图 : {a}（系列名称），{b}（区域名称），{c}（合并数值）, {d}（无）。</description></item>
+        /// <item><description>饼图、仪表盘、漏斗图: {a}（系列名称），{b}（数据项名称），{c}（数值）, {d}（百分比）。</description></item>
+        /// </list>
+        /// </summary>
+        /// <example>
+        /// 示例：“{a}:{c}”
+        /// </example>
+        public string formatter { get { return m_Formatter; } set { m_Formatter = value; } }
+        /// <summary>
+        /// 固定宽度。比 minWidth 优先。
+        /// </summary>
+        public float fixedWidth { get { return m_FixedWidth; } set { m_FixedWidth = value; } }
+        /// <summary>
+        /// 固定高度。比 minHeight 优先。
+        /// </summary>
+        public float fixedHeight { get { return m_FixedHeight; } set { m_FixedHeight = value; } }
+        /// <summary>
+        /// 最小宽度。如若 fixedWidth 设有值，优先取 fixedWidth。
+        /// </summary>
+        public float minWidth { get { return m_MinWidth; } set { m_MinWidth = value; } }
+        /// <summary>
+        /// 最小高度。如若 fixedHeight 设有值，优先取 fixedHeight。
+        /// </summary>
+        public float minHeight { get { return m_MinHeight; } set { m_MinHeight = value; } }
+        /// <summary>
+        /// font size.
+        /// 文字的字体大小。
+        /// </summary>
+        public int fontSize { get { return m_FontSize; } set { m_FontSize = value; } }
+        /// <summary>
+        /// font style.
+        /// 文字的字体风格。
+        /// </summary>
+        public FontStyle fontStyle { get { return m_FontStyle; } set { m_FontStyle = value; } }
+
+        /// <summary>
+        /// The data index currently indicated by Tooltip.
+        /// 当前提示框所指示的数据项索引。
+        /// </summary>
+        public List<int> dataIndex { get; set; }
+        /// <summary>
+        /// the value for x indicator label.
+        /// 指示器X轴上要显示的值。
+        /// </summary>
+        public float[] xValues { get; set; }
+        /// <summary>
+        /// the value for y indicator label. 
+        /// 指示器Y轴上要显示的值。
+        /// </summary>
+        public float[] yValues { get; set; }
+        /// <summary>
+        /// the current pointer position.
+        /// 当前鼠标位置。
+        /// </summary>
+        public Vector2 pointerPos { get; set; }
+        /// <summary>
+        /// the width of tooltip. 
+        /// 提示框宽。
+        /// </summary>
+        public float width { get { return m_ContentRect.sizeDelta.x; } }
+        /// <summary>
+        /// the height of tooltip. 
+        /// 提示框高。
+        /// </summary>
+        public float height { get { return m_ContentRect.sizeDelta.y; } }
+        /// <summary>
+        /// Whether the tooltip has been initialized. 
+        /// 提示框是否已初始化。
+        /// </summary>
+        public bool inited { get { return m_GameObject != null; } }
+        /// <summary>
+        /// the gameObject of tooltip. 
+        /// 提示框的gameObject。
+        /// </summary>
+        public GameObject gameObject { get { return m_GameObject; } }
+
+        public static Tooltip defaultTooltip
+        {
+            get
+            {
+                var tooltip = new Tooltip
+                {
+                    m_Show = true,
+                    xValues = new float[2]{-1,-1},
+                    yValues = new float[2]{-1,-1},
+                    dataIndex = new List<int>() { -1, -1 },
+                    lastDataIndex = new List<int>() { -1, -1 }
+                };
+                return tooltip;
+            }
+        }
+
+        /// <summary>
+        /// 绑定提示框gameObject
+        /// </summary>
+        /// <param name="obj"></param>
+        public void SetObj(GameObject obj)
+        {
+            m_GameObject = obj;
+            m_GameObject.SetActive(false);
+        }
+
+        /// <summary>
+        /// 绑定提示框的文本框gameObject
+        /// </summary>
+        /// <param name="content"></param>
+        public void SetContentObj(GameObject content)
+        {
+            m_Content = content;
+            m_ContentRect = m_Content.GetComponent<RectTransform>();
+            m_ContentText = m_Content.GetComponentInChildren<Text>();
+        }
+
+        /// <summary>
+        /// Keep Tooltiop displayed at the top. 
+        /// 保持Tooltiop显示在最顶上
+        /// </summary>
+        public void UpdateToTop()
+        {
+            int count = m_GameObject.transform.parent.childCount;
+            m_GameObject.GetComponent<RectTransform>().SetSiblingIndex(count - 1);
+        }
+
+        /// <summary>
+        /// 设置提示框文本背景色
+        /// </summary>
+        /// <param name="color"></param>
+        public void SetContentBackgroundColor(Color color)
+        {
+            m_Content.GetComponent<Image>().color = color;
+        }
+
+        /// <summary>
+        /// 设置提示框文本字体颜色
+        /// </summary>
+        /// <param name="color"></param>
+        public void SetContentTextColor(Color color)
+        {
+            if (m_ContentText)
+            {
+                m_ContentText.color = color;
+            }
+        }
+
+        /// <summary>
+        /// 设置提示框文本内容
+        /// </summary>
+        /// <param name="txt"></param>
+        public void UpdateContentText(string txt)
+        {
+            if (m_ContentText)
+            {
+                m_ContentText.text = txt;
+                float wid, hig;
+                if (m_FixedWidth > 0) wid = m_FixedWidth;
+                else if (m_MinWidth > 0 && m_ContentText.preferredWidth < m_MinWidth) wid = m_MinWidth;
+                else wid = m_ContentText.preferredWidth + 8;
+                if (m_FixedHeight > 0) hig = m_FixedHeight;
+                else if (m_MinHeight > 0 && m_ContentText.preferredHeight < m_MinHeight) hig = m_MinHeight;
+                else hig = m_ContentText.preferredHeight + 8;
+                m_ContentRect.sizeDelta = new Vector2(wid, hig);
+            }
+        }
+
+        /// <summary>
+        /// 清除提示框指示数据
+        /// </summary>
+        public void ClearValue()
+        {
+            dataIndex[0] = dataIndex[1] = -1;
+            xValues[0] = xValues[1] = -1;
+            yValues[0] = yValues[1] = -1;
+        }
+
+        /// <summary>
+        /// 提示框是否显示
+        /// </summary>
+        /// <returns></returns>
+        public bool IsActive()
+        {
+            return m_GameObject != null && m_GameObject.activeInHierarchy;
+        }
+
+        /// <summary>
+        /// 设置提示框是否显示
+        /// </summary>
+        /// <param name="flag"></param>
+        public void SetActive(bool flag)
+        {
+            lastDataIndex[0] = lastDataIndex[1] = -1;
+            if (m_GameObject && m_GameObject.activeInHierarchy != flag)
+                m_GameObject.SetActive(flag);
+        }
+
+        /// <summary>
+        /// 更新文本框位置
+        /// </summary>
+        /// <param name="pos"></param>
+        public void UpdateContentPos(Vector2 pos)
+        {
+            if (m_Content)
+                m_Content.transform.localPosition = pos;
+        }
+
+        /// <summary>
+        /// 获得当前提示框的位置
+        /// </summary>
+        /// <returns></returns>
+        public Vector3 GetContentPos()
+        {
+            if (m_Content)
+                return m_Content.transform.localPosition;
+            else
+                return Vector3.zero;
+        }
+
+        /// <summary>
+        /// Whether the data item indicated by tooltip has changed. 
+        /// 提示框所指示的数据项是否发生变化。
+        /// </summary>
+        /// <returns></returns>
+        public bool IsDataIndexChanged()
+        {
+            return dataIndex[0] != lastDataIndex[0] ||
+                dataIndex[1] != lastDataIndex[1];
+        }
+
+        /// <summary>
+        /// 当前索引缓存
+        /// </summary>
+        public void UpdateLastDataIndex()
+        {
+            lastDataIndex[0] = dataIndex[0];
+            lastDataIndex[1] = dataIndex[1];
+        }
+
+        /// <summary>
+        /// 当前提示框是否选中数据项
+        /// </summary>
+        /// <returns></returns>
+        public bool IsSelected()
+        {
+            return dataIndex[0] >= 0 || dataIndex[1] >= 0;
+        }
+
+        /// <summary>
+        /// 指定索引的数据项是否被提示框选中
+        /// </summary>
+        /// <param name="index"></param>
+        /// <returns></returns>
+        public bool IsSelected(int index)
+        {
+            return dataIndex[0] == index || dataIndex[1] == index;
+        }
+
+        public string GetFormatterContent(int dataIndex, Series series, string category, DataZoom dataZoom = null)
+        {
+            if (string.IsNullOrEmpty(m_Formatter))
+            {
+                return "";
+            }
+            else
+            {
+                string content = m_Formatter;
+                for (int i = 0; i < series.Count; i++)
+                {
+                    var serie = series.GetSerie(i);
+                    if (serie.show)
+                    {
+                        var needCategory = serie.type == SerieType.Line || serie.type == SerieType.Bar;
+                        var serieData = serie.GetSerieData(dataIndex, dataZoom);
+                        if (i == 0)
+                        {
+                            content = content.Replace("{a}", serie.name);
+                            content = content.Replace("{b}", needCategory ? category : serieData.name);
+                            content = content.Replace("{c}", ChartCached.FloatToStr(serieData.GetData(1)));
+                            //if (serie.type == SerieType.Pie)
+                            {
+                                var percent = serieData.GetData(1) / serie.yTotal * 100;
+                                content = content.Replace("{d}", ChartCached.FloatToStr(percent, 1));
+                            }
+                        }
+                        content = content.Replace("{a" + i + "}", serie.name);
+                        content = content.Replace("{b" + i + "}", needCategory ? category : serieData.name);
+                        content = content.Replace("{c" + i + "}", ChartCached.FloatToStr(serieData.GetData(1)));
+                        //if (serie.type == SerieType.Pie)
+                        {
+                            var percent = serieData.GetData(1) / serie.yTotal * 100;
+                            content = content.Replace("{d" + i + "}", ChartCached.FloatToStr(percent, 1));
+                        }
+                    }
+                }
+                content = content.Replace("\\n", "\n");
+                content = content.Replace("<br/>", "\n");
+                return content;
+            }
+        }
+
+        public string GetFormatterContent(string serieName, string dataName, float dataValue)
+        {
+            if (string.IsNullOrEmpty(m_Formatter))
+                return ChartCached.FloatToStr(dataValue);
+            else
+            {
+                var content = m_Formatter.Replace("{a}", serieName);
+                content = content.Replace("{b}", dataName);
+                content = content.Replace("{c}", ChartCached.FloatToStr(dataValue));
+                content = content.Replace("\\n", "\n");
+                content = content.Replace("<br/>", "\n");
+                return content;
+            }
+        }
+    }
+}

Scripts/UI/Component/Main/Tooltip.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: c75ff9b455a74482db10158ca81afe89
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Scripts/UI/Component/Main/VisualMap.cs

@@ -0,0 +1,389 @@
+using System.Collections.Generic;
+using System;
+using UnityEngine;
+using UnityEngine.UI;
+
+namespace XCharts
+{
+    /// <summary>
+    /// VisualMap component.
+    /// 视觉映射组件。用于进行『视觉编码』，也就是将数据映射到视觉元素（视觉通道）。
+    /// </summary>
+    [System.Serializable]
+    public class VisualMap
+    {
+        /// <summary>
+        /// 类型。分为连续型和分段型。
+        /// </summary>
+        public enum Type
+        {
+            /// <summary>
+            /// 连续型。
+            /// </summary>
+            Continuous,
+            /// <summary>
+            /// 分段型。
+            /// </summary>
+            Piecewise
+        }
+
+        /// <summary>
+        /// 选择模式
+        /// </summary>
+        public enum SelectedMode
+        {
+            /// <summary>
+            /// 多选。
+            /// </summary>
+            Multiple,
+            /// <summary>
+            /// 单选。
+            /// </summary>
+            Single
+        }
+
+        [SerializeField] private bool m_Enable = false;
+        [SerializeField] private bool m_Show = true;
+        [SerializeField] private Type m_Type = Type.Continuous;
+        [SerializeField] private SelectedMode m_SelectedMode = SelectedMode.Multiple;
+        [SerializeField] private float m_Min = 0;
+        [SerializeField] private float m_Max = 100f;
+
+        [SerializeField] private float[] m_Range = new float[2] { 0, 100f };
+        [SerializeField] private string[] m_Text = new string[2] { "", "" };
+        [SerializeField] private float[] m_TextGap = new float[2] { 10f, 10f };
+        [SerializeField] private int m_SplitNumber = 5;
+        [SerializeField] private bool m_Calculable = false;
+        [SerializeField] private bool m_Realtime = true;
+        [SerializeField] private float m_ItemWidth = 20f;
+        [SerializeField] private float m_ItemHeight = 140f;
+        [SerializeField] private float m_BorderWidth = 0;
+        [SerializeField] private int m_Dimension = 0;
+        [SerializeField] private bool m_HoverLink = true;
+        [SerializeField] private Orient m_Orient = Orient.Horizonal;
+        [SerializeField] private Location m_Location = Location.defaultLeft;
+        [SerializeField] private List<Color> m_InRange = new List<Color>();
+        [SerializeField] private List<Color> m_OutOfRange = new List<Color>();
+
+        /// <summary>
+        /// 是否开启组件功能。
+        /// </summary>
+        public bool enable { get { return m_Enable; } set { m_Enable = value; } }
+        /// <summary>
+        /// 是否显示组件。如果设置为 false，不会显示，但是数据映射的功能还存在。
+        /// </summary>
+        public bool show { get { return m_Show; } set { m_Show = value; } }
+        /// <summary>
+        /// 组件类型。
+        /// </summary>
+        public Type type { get { return m_Type; } set { m_Type = value; } }
+        /// <summary>
+        /// 选择模式。
+        /// </summary>
+        public SelectedMode selectedMode { get { return m_SelectedMode; } set { m_SelectedMode = value; } }
+        /// <summary>
+        /// 允许的最小值。'min' 必须用户指定。[visualMap.min, visualMap.max] 形成了视觉映射的『定义域』。
+        /// </summary>
+        public float min { get { return m_Min; } set { m_Min = value; } }
+        /// <summary>
+        /// 允许的最大值。'max' 必须用户指定。[visualMap.min, visualMax.max] 形成了视觉映射的『定义域』。
+        /// </summary>
+        public float max { get { return m_Max; } set { m_Max = value < min ? min + 1 : value; } }
+        /// <summary>
+        /// 指定手柄对应数值的位置。range 应在 min max 范围内。
+        /// </summary>
+        public float[] range { get { return m_Range; } }
+        /// <summary>
+        /// 两端的文本，如 ['High', 'Low']。
+        /// </summary>
+        public string[] text { get { return m_Text; } }
+        /// <summary>
+        /// 两端文字主体之间的距离，单位为px。
+        /// </summary>
+        public float[] textGap { get { return m_TextGap; } }
+        /// <summary>
+        /// 对于连续型数据，自动平均切分成几段，默认为0时自动匹配inRange颜色列表大小。
+        /// </summary>
+        /// <value></value>
+        public int splitNumber { get { return m_SplitNumber; } set { m_SplitNumber = value; } }
+        /// <summary>
+        /// 是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
+        /// </summary>
+        public bool calculable { get { return m_Calculable; } set { m_Calculable = value; } }
+        /// <summary>
+        /// 拖拽时，是否实时更新。
+        /// </summary>
+        public bool realtime { get { return m_Realtime; } set { m_Realtime = value; } }
+        /// <summary>
+        /// 图形的宽度，即颜色条的宽度。
+        /// </summary>
+        public float itemWidth { get { return m_ItemWidth; } set { m_ItemWidth = value; } }
+        /// <summary>
+        /// 图形的高度，即颜色条的高度。
+        /// </summary>
+        public float itemHeight { get { return m_ItemHeight; } set { m_ItemHeight = value; } }
+        /// <summary>
+        /// 边框线宽，单位px。
+        /// </summary>
+        public float borderWidth { get { return m_BorderWidth; } set { m_BorderWidth = value; } }
+        /// <summary>
+        /// 指定用数据的『哪个维度』，映射到视觉元素上。『数据』即 series.data。从1开始，默认为0取 data 中最后一个维度。
+        /// </summary>
+        public int dimension { get { return m_Dimension; } set { m_Dimension = value; } }
+        /// <summary>
+        /// 打开 hoverLink 功能时，鼠标悬浮到 visualMap 组件上时，鼠标位置对应的数值 在 图表中对应的图形元素，会高亮。
+        /// 反之，鼠标悬浮到图表中的图形元素上时，在 visualMap 组件的相应位置会有三角提示其所对应的数值。
+        /// </summary>
+        /// <value></value>
+        public bool hoverLink { get { return m_HoverLink; } set { m_HoverLink = value; } }
+        /// <summary>
+        /// Specify whether the layout of component is horizontal or vertical. 
+        /// 布局方式是横还是竖。
+        /// </summary>
+        public Orient orient { get { return m_Orient; } set { m_Orient = value; } }
+        /// <summary>
+        /// The location of component.
+        /// 组件显示的位置。
+        /// </summary>
+        public Location location { get { return m_Location; } set { m_Location = value; } }
+        /// <summary>
+        /// 定义 在选中范围中 的视觉颜色。
+        /// </summary>
+        public List<Color> inRange { get { return m_InRange; } set { if (value != null) m_InRange = value; } }
+        /// <summary>
+        /// 定义 在选中范围外 的视觉颜色。
+        /// </summary>
+        public List<Color> outOfRange { get { return m_OutOfRange; } set { if (value != null) m_OutOfRange = value; } }
+
+        /// <summary>
+        /// 鼠标悬停选中的index
+        /// </summary>
+        /// <value></value>
+        public int rtSelectedIndex { get; set; }
+        public float rtSelectedValue { get; set; }
+        /// <summary>
+        /// the current pointer position.
+        /// 当前鼠标位置。
+        /// </summary>
+        public Vector2 pointerPos { get; set; }
+        public bool isVertical { get { return orient == Orient.Vertical; } }
+        public float rangeMin
+        {
+            get
+            {
+                if (m_Range[0] < min || m_Range[0] > max) return min;
+                else return m_Range[0];
+            }
+            set
+            {
+                if (value >= min && value <= m_Range[1]) m_Range[0] = value;
+            }
+        }
+
+        public float rangeMax
+        {
+            get
+            {
+                if (m_Range[1] >= m_Range[0] && m_Range[1] < max) return m_Range[1];
+                else return max;
+            }
+            set
+            {
+                if (value >= m_Range[0] && value <= max) m_Range[1] = value;
+            }
+        }
+
+        public int rtSplitNumber
+        {
+            get
+            {
+                if (splitNumber > 0 && splitNumber <= m_InRange.Count) return splitNumber;
+                else return inRange.Count;
+            }
+        }
+
+        public float rangeMinHeight { get { return (rangeMin - min) / (max - min) * itemHeight; } }
+        public float rangeMaxHeight { get { return (rangeMax - min) / (max - min) * itemHeight; } }
+
+        private List<Color> m_RtInRange = new List<Color>();
+        public List<Color> rtInRange
+        {
+            get
+            {
+                if (splitNumber == 0 || m_InRange.Count >= splitNumber || m_InRange.Count < 1) return m_InRange;
+                else
+                {
+                    if (m_RtInRange.Count != rtSplitNumber)
+                    {
+                        m_RtInRange.Clear();
+                        var total = max - min;
+                        var diff1 = total / (m_InRange.Count - 1);
+                        var diff2 = total / splitNumber;
+
+                        var inCount = 0;
+                        var inValue = min;
+                        var rtValue = min;
+
+
+                        for (int i = 0; i < splitNumber; i++)
+                        {
+                            rtValue += diff2;
+                            if (rtValue > inValue + diff1)
+                            {
+                                inValue += diff1;
+                                inCount++;
+                            }
+                            if (i == splitNumber - 1)
+                            {
+                                m_RtInRange.Add(m_InRange[m_InRange.Count - 1]);
+                            }
+                            else
+                            {
+                                var rate = (rtValue - inValue) / diff1;
+                                m_RtInRange.Add(Color.Lerp(m_InRange[inCount], m_InRange[inCount + 1], rate));
+                            }
+                        }
+                    }
+                    return m_RtInRange;
+                }
+            }
+        }
+
+        public Color GetColor(float value)
+        {
+            int splitNumber = rtInRange.Count;
+            if (splitNumber <= 0) return Color.clear;
+            value = Mathf.Clamp(value, min, max);
+
+            var diff = (max - min) / (splitNumber - 1);
+            var index = GetIndex(value);
+            var nowMin = min + index * diff;
+            var rate = (value - nowMin) / diff;
+            if (index == splitNumber - 1) return rtInRange[index];
+            else return Color.Lerp(rtInRange[index], rtInRange[index + 1], rate);
+        }
+
+        public int GetIndex(float value)
+        {
+            int splitNumber = rtInRange.Count;
+            if (splitNumber <= 0) return -1;
+            value = Mathf.Clamp(value, min, max);
+
+            var diff = (max - min) / (splitNumber - 1);
+            var index = -1;
+            for (int i = 0; i < splitNumber; i++)
+            {
+                if (value <= min + (i + 1) * diff)
+                {
+                    index = i;
+                    break;
+                }
+            }
+            return index;
+        }
+
+        public bool IsInSelectedValue(float value)
+        {
+            if (rtSelectedIndex < 0) return true;
+            else
+            {
+                return rtSelectedIndex == GetIndex(value);
+            }
+        }
+
+        public float GetValue(Vector3 pos, float chartWidth, float chartHeight)
+        {
+            var centerPos = location.GetPosition(chartWidth, chartHeight);
+            var pos1 = centerPos + (isVertical ? Vector3.down : Vector3.left) * itemHeight / 2;
+            var pos2 = centerPos + (isVertical ? Vector3.up : Vector3.right) * itemHeight / 2;
+            if (isVertical)
+            {
+                if (pos.y < pos1.y) return min;
+                else if (pos.y > pos2.y) return max;
+                else return min + (pos.y - pos1.y) / (pos2.y - pos1.y) * (max - min);
+            }
+            else
+            {
+                if (pos.x < pos1.x) return min;
+                else if (pos.x > pos2.x) return max;
+                else return min + (pos.x - pos1.x) / (pos2.x - pos1.x) * (max - min);
+            }
+        }
+
+        public bool IsInRect(Vector3 local, float chartWidth, float chartHeight, float triangleLen = 20)
+        {
+            var centerPos = location.GetPosition(chartWidth, chartHeight);
+            var diff = calculable ? triangleLen : 0;
+            if (local.x >= centerPos.x - itemWidth / 2 - diff && local.x <= centerPos.x + itemWidth / 2 + diff &&
+                local.y >= centerPos.y - itemHeight / 2 - diff && local.y <= centerPos.y + itemHeight / 2 + diff)
+            {
+                return true;
+            }
+            else
+            {
+                return false;
+            }
+        }
+
+        public bool IsInRangeRect(Vector3 local, float chartWidth, float chartHeight)
+        {
+            var centerPos = location.GetPosition(chartWidth, chartHeight);
+            if (orient == Orient.Vertical)
+            {
+                var pos1 = centerPos + Vector3.down * itemHeight / 2;
+                return local.x >= centerPos.x - itemWidth / 2 && local.x <= centerPos.x + itemWidth / 2 &&
+                local.y >= pos1.y + rangeMinHeight && local.y <= pos1.y + rangeMaxHeight;
+            }
+            else
+            {
+                var pos1 = centerPos + Vector3.left * itemHeight / 2;
+                return local.x >= pos1.x + rangeMinHeight && local.x <= pos1.x + rangeMaxHeight &&
+                local.y >= centerPos.y - itemWidth / 2 && local.y <= centerPos.y + itemWidth / 2;
+            }
+        }
+
+        public bool IsInRangeMinRect(Vector3 local, float chartWidth, float chartHeight, float triangleLen)
+        {
+            var centerPos = location.GetPosition(chartWidth, chartHeight);
+            if (orient == Orient.Vertical)
+            {
+                var radius = triangleLen / 2;
+                var pos1 = centerPos + Vector3.down * itemHeight / 2;
+                var cpos = new Vector3(pos1.x + itemWidth / 2 + radius, pos1.y + rangeMinHeight - radius);
+
+                return local.x >= cpos.x - radius && local.x <= cpos.x + radius &&
+                local.y >= cpos.y - radius && local.y <= cpos.y + radius;
+            }
+            else
+            {
+                var radius = triangleLen / 2;
+                var pos1 = centerPos + Vector3.left * itemHeight / 2;
+                var cpos = new Vector3(pos1.x + rangeMinHeight, pos1.y + itemWidth / 2 + radius);
+                return local.x >= cpos.x - radius && local.x <= cpos.x + radius &&
+                local.y >= cpos.y - radius && local.y <= cpos.y + radius;
+            }
+        }
+
+        public bool IsInRangeMaxRect(Vector3 local, float chartWidth, float chartHeight, float triangleLen)
+        {
+            var centerPos = location.GetPosition(chartWidth, chartHeight);
+            if (orient == Orient.Vertical)
+            {
+                var radius = triangleLen / 2;
+                var pos1 = centerPos + Vector3.down * itemHeight / 2;
+                var cpos = new Vector3(pos1.x + itemWidth / 2 + radius, pos1.y + rangeMaxHeight + radius);
+
+                return local.x >= cpos.x - radius && local.x <= cpos.x + radius &&
+                local.y >= cpos.y - radius && local.y <= cpos.y + radius;
+            }
+            else
+            {
+                var radius = triangleLen / 2;
+                var pos1 = centerPos + Vector3.left * itemHeight / 2;
+                var cpos = new Vector3(pos1.x + rangeMaxHeight + radius, pos1.y + itemWidth / 2 + radius);
+                return local.x >= cpos.x - radius && local.x <= cpos.x + radius &&
+                local.y >= cpos.y - radius && local.y <= cpos.y + radius;
+            }
+        }
+    }
+}

Scripts/UI/Component/Main/VisualMap.cs.meta

@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 2df2ffc144e3347828462bb972eec23a
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: