diff --git a/Scripts/UI/Component/ChartComponent.cs b/Scripts/UI/Component/ChartComponent.cs
new file mode 100644
index 00000000..f0313dd3
--- /dev/null
+++ b/Scripts/UI/Component/ChartComponent.cs
@@ -0,0 +1,35 @@
+using System;
+using UnityEngine;
+
+namespace XCharts
+{
+    public class ChartComponent
+    {
+        [SerializeField] protected string m_JsonData;
+        [SerializeField] protected bool m_DataFromJson;
+
+        /// <summary>
+        /// json格式的字符串数据
+        /// </summary>
+        /// <returns></returns>
+        public string jsonData { get { return m_JsonData; } set { m_JsonData = value; ParseJsonData(value); } }
+
+        public void OnAfterDeserialize()
+        {
+            if (m_DataFromJson)
+            {
+                ParseJsonData(m_JsonData);
+                m_DataFromJson = false;
+            }
+        }
+
+        public void OnBeforeSerialize()
+        {
+        }
+
+        public virtual void ParseJsonData(string json)
+        {
+            throw new Exception("no support yet");
+        }
+    }
+}
\ No newline at end of file
diff --git a/Scripts/UI/Component/ChartComponent.cs.meta b/Scripts/UI/Component/ChartComponent.cs.meta
new file mode 100644
index 00000000..7557b538
--- /dev/null
+++ b/Scripts/UI/Component/ChartComponent.cs.meta
@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: b0af5e768fe0e407cb5b023b37c41597
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 
diff --git a/Scripts/UI/Component/Main/Axis.cs b/Scripts/UI/Component/Main/Axis.cs
index 641dbfb8..e62fd886 100644
--- a/Scripts/UI/Component/Main/Axis.cs
+++ b/Scripts/UI/Component/Main/Axis.cs
@@ -11,7 +11,7 @@ namespace XCharts
     /// 直角坐标系的坐标轴组件。
     /// </summary>
     [System.Serializable]
-    public class Axis : JsonDataSupport, IEquatable<Axis>
+    public class Axis : MainComponent, IEquatable<Axis>
     {
         /// <summary>
         /// the type of axis.
diff --git a/Scripts/UI/Component/Main/DataZoom.cs b/Scripts/UI/Component/Main/DataZoom.cs
index cc6921a4..08da0b98 100644
--- a/Scripts/UI/Component/Main/DataZoom.cs
+++ b/Scripts/UI/Component/Main/DataZoom.cs
@@ -10,7 +10,7 @@ namespace XCharts
     /// <para>DataZoom 组件 用于区域缩放，从而能自由关注细节的数据信息，或者概览数据整体，或者去除离群点的影响。</para>
     /// </summary>
     [System.Serializable]
-    public class DataZoom
+    public class DataZoom : MainComponent
     {
         /// <summary>
         /// Generally dataZoom component zoom or roam coordinate system through data filtering
diff --git a/Scripts/UI/Component/Main/Grid.cs b/Scripts/UI/Component/Main/Grid.cs
index 2cc1852d..ab36bae8 100644
--- a/Scripts/UI/Component/Main/Grid.cs
+++ b/Scripts/UI/Component/Main/Grid.cs
@@ -15,7 +15,7 @@ namespace XCharts
     /// </para>
     /// </summary>
     [Serializable]
-    public class Grid : IEquatable<Grid>
+    public class Grid : MainComponent, IEquatable<Grid>
     {
         [SerializeField] private bool m_Show = true;
         [SerializeField] private float m_Left;
diff --git a/Scripts/UI/Component/Main/Legend.cs b/Scripts/UI/Component/Main/Legend.cs
index bebb6721..0a3ed078 100644
--- a/Scripts/UI/Component/Main/Legend.cs
+++ b/Scripts/UI/Component/Main/Legend.cs
@@ -11,7 +11,7 @@ namespace XCharts
     /// 图例组件展现了不同系列的标记，颜色和名字。可以通过点击图例控制哪些系列不显示。
     /// </summary>
     [System.Serializable]
-    public class Legend : JsonDataSupport, IPropertyChanged, IEquatable<Legend>
+    public class Legend : MainComponent, IPropertyChanged, IEquatable<Legend>
     {
         /// <summary>
         /// Selected mode of legend, which controls whether series can be toggled displaying by clicking legends. 
diff --git a/Scripts/UI/Component/Main/Pie.cs b/Scripts/UI/Component/Main/Pie.cs
index 8c402217..dacace2f 100644
--- a/Scripts/UI/Component/Main/Pie.cs
+++ b/Scripts/UI/Component/Main/Pie.cs
@@ -7,7 +7,7 @@ namespace XCharts
     /// 饼图的全局设置。
     /// </summary>
     [System.Serializable]
-    public class Pie
+    public class Pie : MainComponent
     {
         [SerializeField] private float m_TooltipExtraRadius;
         [SerializeField] private float m_SelectedOffset;
diff --git a/Scripts/UI/Component/Main/Radar.cs b/Scripts/UI/Component/Main/Radar.cs
index d0cd10c3..fc6c98e3 100644
--- a/Scripts/UI/Component/Main/Radar.cs
+++ b/Scripts/UI/Component/Main/Radar.cs
@@ -11,7 +11,7 @@ namespace XCharts
     /// 雷达图坐标系组件，只适用于雷达图。
     /// </summary>
     [System.Serializable]
-    public class Radar : JsonDataSupport, IEquatable<Radar>
+    public class Radar : MainComponent, IEquatable<Radar>
     {
         /// <summary>
         /// Radar render type, in which 'Polygon' and 'Circle' are supported.
@@ -168,7 +168,7 @@ namespace XCharts
         /// 雷达图的所有数据坐标点列表。
         /// </summary>
         /// <returns></returns>
-        public Dictionary<int,List<Vector3>> dataPosList = new Dictionary<int,List<Vector3>>();
+        public Dictionary<int, List<Vector3>> dataPosList = new Dictionary<int, List<Vector3>>();
 
         public static Radar defaultRadar
         {
diff --git a/Scripts/UI/Component/Main/Serie.cs b/Scripts/UI/Component/Main/Serie.cs
index 08507633..df8c5059 100644
--- a/Scripts/UI/Component/Main/Serie.cs
+++ b/Scripts/UI/Component/Main/Serie.cs
@@ -150,7 +150,7 @@ namespace XCharts
     /// 系列。每个系列通过 type 决定自己的图表类型。
     /// </summary>
     [System.Serializable]
-    public class Serie : JsonDataSupport
+    public class Serie : MainComponent
     {
         [SerializeField] [DefaultValue("true")] private bool m_Show = true;
         [SerializeField] private SerieType m_Type;
diff --git a/Scripts/UI/Component/Main/Series.cs b/Scripts/UI/Component/Main/Series.cs
index c282aaff..3cff0b6d 100644
--- a/Scripts/UI/Component/Main/Series.cs
+++ b/Scripts/UI/Component/Main/Series.cs
@@ -9,7 +9,7 @@ namespace XCharts
     /// 系列列表。每个系列通过 type 决定自己的图表类型。
     /// </summary>
     [System.Serializable]
-    public class Series : JsonDataSupport
+    public class Series : MainComponent
     {
 
         [SerializeField] protected List<Serie> m_Series;
diff --git a/Scripts/UI/Component/Main/Settings.cs b/Scripts/UI/Component/Main/Settings.cs
index fa4b56a7..1b98a994 100644
--- a/Scripts/UI/Component/Main/Settings.cs
+++ b/Scripts/UI/Component/Main/Settings.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 全局参数设置组件。一般情况下可使用默认值，当有需要时可进行调整。
     /// </summary>
     [Serializable]
-    public class Settings
+    public class Settings : MainComponent
     {
         [SerializeField] [Range(1, 10)] protected float m_LineSmoothStyle = 3f;
         [SerializeField] [Range(1f, 20)] protected float m_LineSmoothness = 2f;
diff --git a/Scripts/UI/Component/Main/Theme.cs b/Scripts/UI/Component/Main/Theme.cs
index 9ed9d920..9849754b 100644
--- a/Scripts/UI/Component/Main/Theme.cs
+++ b/Scripts/UI/Component/Main/Theme.cs
@@ -29,7 +29,7 @@ namespace XCharts
     /// Theme.
     /// 主题相关配置。
     /// </summary>
-    public class ThemeInfo : IEquatable<ThemeInfo>
+    public class ThemeInfo : MainComponent, IEquatable<ThemeInfo>
     {
         [SerializeField] private Theme m_Theme = Theme.Default;
         [SerializeField] private Font m_Font;
diff --git a/Scripts/UI/Component/Main/Title.cs b/Scripts/UI/Component/Main/Title.cs
index 10847f89..6c79d35c 100644
--- a/Scripts/UI/Component/Main/Title.cs
+++ b/Scripts/UI/Component/Main/Title.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 标题组件，包含主标题和副标题。
     /// </summary>
     [Serializable]
-    public class Title : IPropertyChanged, IEquatable<Title>
+    public class Title : MainComponent, IPropertyChanged, IEquatable<Title>
     {
         [SerializeField] private bool m_Show = true;
         [SerializeField] private string m_Text;
diff --git a/Scripts/UI/Component/Main/Tooltip.cs b/Scripts/UI/Component/Main/Tooltip.cs
index 693d02ba..241d141b 100644
--- a/Scripts/UI/Component/Main/Tooltip.cs
+++ b/Scripts/UI/Component/Main/Tooltip.cs
@@ -10,7 +10,7 @@ namespace XCharts
     /// 提示框组件
     /// </summary>
     [System.Serializable]
-    public class Tooltip
+    public class Tooltip : MainComponent
     {
         /// <summary>
         /// Indicator type.
@@ -157,8 +157,8 @@ namespace XCharts
                 var tooltip = new Tooltip
                 {
                     m_Show = true,
-                    xValues = new float[2]{-1,-1},
-                    yValues = new float[2]{-1,-1},
+                    xValues = new float[2] { -1, -1 },
+                    yValues = new float[2] { -1, -1 },
                     dataIndex = new List<int>() { -1, -1 },
                     lastDataIndex = new List<int>() { -1, -1 }
                 };
diff --git a/Scripts/UI/Component/Main/VisualMap.cs b/Scripts/UI/Component/Main/VisualMap.cs
index 5d16f7ff..6e90c73c 100644
--- a/Scripts/UI/Component/Main/VisualMap.cs
+++ b/Scripts/UI/Component/Main/VisualMap.cs
@@ -10,7 +10,7 @@ namespace XCharts
     /// 视觉映射组件。用于进行『视觉编码』，也就是将数据映射到视觉元素（视觉通道）。
     /// </summary>
     [System.Serializable]
-    public class VisualMap
+    public class VisualMap : MainComponent
     {
         /// <summary>
         /// 类型。分为连续型和分段型。
diff --git a/Scripts/UI/Component/MainComponent.cs b/Scripts/UI/Component/MainComponent.cs
new file mode 100644
index 00000000..779bd9d6
--- /dev/null
+++ b/Scripts/UI/Component/MainComponent.cs
@@ -0,0 +1,6 @@
+namespace XCharts
+{
+    public class MainComponent : ChartComponent
+    {
+    }
+}
\ No newline at end of file
diff --git a/Scripts/UI/Component/MainComponent.cs.meta b/Scripts/UI/Component/MainComponent.cs.meta
new file mode 100644
index 00000000..4da89c6e
--- /dev/null
+++ b/Scripts/UI/Component/MainComponent.cs.meta
@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: a0b05891df2284bc588cf6b668bfeb7b
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 
diff --git a/Scripts/UI/Component/Sub/Animation.cs b/Scripts/UI/Component/Sub/Animation.cs
index 120b9696..aee6f51f 100644
--- a/Scripts/UI/Component/Sub/Animation.cs
+++ b/Scripts/UI/Component/Sub/Animation.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 动画表现。
     /// </summary>
     [System.Serializable]
-    public class Animation
+    public class Animation : SubComponent
     {
         public enum Easing
         {
diff --git a/Scripts/UI/Component/Sub/AreaStyle.cs b/Scripts/UI/Component/Sub/AreaStyle.cs
index 3f10ea97..eb7f703d 100644
--- a/Scripts/UI/Component/Sub/AreaStyle.cs
+++ b/Scripts/UI/Component/Sub/AreaStyle.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 区域填充样式。
     /// </summary>
     [System.Serializable]
-    public class AreaStyle
+    public class AreaStyle : SubComponent
     {
         /// <summary>
         /// Origin position of area.
diff --git a/Scripts/UI/Component/Sub/AxisLabel.cs b/Scripts/UI/Component/Sub/AxisLabel.cs
index 980878fb..47a6a0c0 100644
--- a/Scripts/UI/Component/Sub/AxisLabel.cs
+++ b/Scripts/UI/Component/Sub/AxisLabel.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 坐标轴刻度标签的相关设置。
     /// </summary>
     [Serializable]
-    public class AxisLabel
+    public class AxisLabel : SubComponent
     {
         [SerializeField] private bool m_Show = true;
         [SerializeField] private string m_Formatter;
diff --git a/Scripts/UI/Component/Sub/AxisLine.cs b/Scripts/UI/Component/Sub/AxisLine.cs
index 6b7f683d..2f420047 100644
--- a/Scripts/UI/Component/Sub/AxisLine.cs
+++ b/Scripts/UI/Component/Sub/AxisLine.cs
@@ -7,7 +7,7 @@ namespace XCharts
     /// 坐标轴的分隔线。
     /// </summary>
     [System.Serializable]    
-    public class AxisLine
+    public class AxisLine : SubComponent
     {
         [SerializeField] private bool m_Show;
         [SerializeField] private bool m_OnZero;
diff --git a/Scripts/UI/Component/Sub/AxisName.cs b/Scripts/UI/Component/Sub/AxisName.cs
index cecdcc82..6725cb16 100644
--- a/Scripts/UI/Component/Sub/AxisName.cs
+++ b/Scripts/UI/Component/Sub/AxisName.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 坐标轴名称。
     /// </summary>
     [Serializable]
-    public class AxisName
+    public class AxisName : SubComponent
     {
         /// <summary>
         /// the location of axis name.
diff --git a/Scripts/UI/Component/Sub/AxisSplitArea.cs b/Scripts/UI/Component/Sub/AxisSplitArea.cs
index ad03bef5..8c6d3b2f 100644
--- a/Scripts/UI/Component/Sub/AxisSplitArea.cs
+++ b/Scripts/UI/Component/Sub/AxisSplitArea.cs
@@ -9,7 +9,7 @@ namespace XCharts
     /// 坐标轴在 grid 区域中的分隔区域，默认不显示。
     /// </summary>
     [Serializable]
-    public class AxisSplitArea
+    public class AxisSplitArea : SubComponent
     {
         [SerializeField] private bool m_Show;
         [SerializeField] private List<Color> m_Color;
diff --git a/Scripts/UI/Component/Sub/AxisTick.cs b/Scripts/UI/Component/Sub/AxisTick.cs
index b7247434..ba56cbf9 100644
--- a/Scripts/UI/Component/Sub/AxisTick.cs
+++ b/Scripts/UI/Component/Sub/AxisTick.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 坐标轴刻度相关设置。
     /// </summary>
     [System.Serializable]
-    public class AxisTick
+    public class AxisTick : SubComponent
     {
         [SerializeField] private bool m_Show;
         [SerializeField] private bool m_AlignWithLabel;
diff --git a/Scripts/UI/Component/Sub/Emphasis.cs b/Scripts/UI/Component/Sub/Emphasis.cs
index 64473ec5..af860a45 100644
--- a/Scripts/UI/Component/Sub/Emphasis.cs
+++ b/Scripts/UI/Component/Sub/Emphasis.cs
@@ -7,7 +7,7 @@ namespace XCharts
     /// 高亮的图形样式和文本标签样式。
     /// </summary>
     [System.Serializable]
-    public class Emphasis
+    public class Emphasis : SubComponent
     {
         [SerializeField] private bool m_Show;
         [SerializeField] private SerieLabel m_Label = new SerieLabel();
diff --git a/Scripts/UI/Component/Sub/ItemStyle.cs b/Scripts/UI/Component/Sub/ItemStyle.cs
index fc8ecff1..ab505cae 100644
--- a/Scripts/UI/Component/Sub/ItemStyle.cs
+++ b/Scripts/UI/Component/Sub/ItemStyle.cs
@@ -7,7 +7,7 @@ namespace XCharts
     /// 图形样式。
     /// </summary>
     [System.Serializable]
-    public class ItemStyle
+    public class ItemStyle : SubComponent
     {
         /// <summary>
         /// 线的类型。
diff --git a/Scripts/UI/Component/Sub/LineArrow.cs b/Scripts/UI/Component/Sub/LineArrow.cs
index 49e251a4..3324efe9 100644
--- a/Scripts/UI/Component/Sub/LineArrow.cs
+++ b/Scripts/UI/Component/Sub/LineArrow.cs
@@ -6,7 +6,7 @@ namespace XCharts
     /// <summary>
     /// </summary>
     [Serializable]
-    public class LineArrow
+    public class LineArrow : SubComponent
     {
         public enum Position
         {
diff --git a/Scripts/UI/Component/Sub/LineStyle.cs b/Scripts/UI/Component/Sub/LineStyle.cs
index cd08e1ab..99963b14 100644
--- a/Scripts/UI/Component/Sub/LineStyle.cs
+++ b/Scripts/UI/Component/Sub/LineStyle.cs
@@ -9,7 +9,7 @@ namespace XCharts
     /// 注： 修改 lineStyle 中的颜色不会影响图例颜色，如果需要图例颜色和折线图颜色一致，需修改 itemStyle.color，线条颜色默认也会取改颜色。
     /// </summary>
     [System.Serializable]
-    public class LineStyle
+    public class LineStyle : SubComponent
     {
         /// <summary>
         /// 线的类型。
diff --git a/Scripts/UI/Component/Sub/Location.cs b/Scripts/UI/Component/Sub/Location.cs
index bdbcd922..ee29de3b 100644
--- a/Scripts/UI/Component/Sub/Location.cs
+++ b/Scripts/UI/Component/Sub/Location.cs
@@ -8,7 +8,7 @@ namespace XCharts
     /// 位置类型。通过Align快速设置大体位置，再通过left，right，top，bottom微调具体位置。
     /// </summary>
     [Serializable]
-    public class Location : IPropertyChanged, IEquatable<Location>
+    public class Location : SubComponent, IPropertyChanged, IEquatable<Location>
     {
         /// <summary>
         /// 对齐方式
diff --git a/Scripts/UI/Component/Sub/SerieData.cs b/Scripts/UI/Component/Sub/SerieData.cs
index a404466c..dfac970f 100644
--- a/Scripts/UI/Component/Sub/SerieData.cs
+++ b/Scripts/UI/Component/Sub/SerieData.cs
@@ -10,7 +10,7 @@ namespace XCharts
     /// 系列中的一个数据项。可存储数据名和1-n维的数据。
     /// </summary>
     [System.Serializable]
-    public class SerieData
+    public class SerieData : SubComponent
     {
         [SerializeField] private string m_Name;
         [SerializeField] private bool m_Selected;
diff --git a/Scripts/UI/Component/Sub/SerieLabel.cs b/Scripts/UI/Component/Sub/SerieLabel.cs
index 8cfeee36..a61d4c26 100644
--- a/Scripts/UI/Component/Sub/SerieLabel.cs
+++ b/Scripts/UI/Component/Sub/SerieLabel.cs
@@ -7,7 +7,7 @@ namespace XCharts
     /// 图形上的文本标签，可用于说明图形的一些数据信息，比如值，名称等。
     /// </summary>
     [System.Serializable]
-    public class SerieLabel
+    public class SerieLabel : SubComponent
     {
         /// <summary>
         /// The position of label.
diff --git a/Scripts/UI/Component/Sub/SerieSymbol.cs b/Scripts/UI/Component/Sub/SerieSymbol.cs
index 6144b518..734993fd 100644
--- a/Scripts/UI/Component/Sub/SerieSymbol.cs
+++ b/Scripts/UI/Component/Sub/SerieSymbol.cs
@@ -69,7 +69,7 @@ namespace XCharts
     /// 系列数据项的标记的图形
     /// </summary>
     [System.Serializable]
-    public class SerieSymbol
+    public class SerieSymbol : SubComponent
     {
         [SerializeField] private SerieSymbolType m_Type = SerieSymbolType.EmptyCircle;
         [SerializeField] private SerieSymbolSizeType m_SizeType = SerieSymbolSizeType.Custom;
diff --git a/Scripts/UI/Component/SubComponent.cs b/Scripts/UI/Component/SubComponent.cs
new file mode 100644
index 00000000..65590b0d
--- /dev/null
+++ b/Scripts/UI/Component/SubComponent.cs
@@ -0,0 +1,6 @@
+namespace XCharts
+{
+    public class SubComponent : ChartComponent
+    {
+    }
+}
\ No newline at end of file
diff --git a/Scripts/UI/Component/SubComponent.cs.meta b/Scripts/UI/Component/SubComponent.cs.meta
new file mode 100644
index 00000000..e1543960
--- /dev/null
+++ b/Scripts/UI/Component/SubComponent.cs.meta
@@ -0,0 +1,11 @@
+fileFormatVersion: 2
+guid: 94e905091d07140de987a531a6ff90d9
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: