增加Animation的alongWithLinePath参数设置折线轨迹匀速动画

Assets/XCharts/CHANGELOG-EN.md

@@ -39,6 +39,7 @@
 
 ## master
 
+* (2021.08.24) Added `Animation`'s `alongWithLinePath`
 * (2021.08.22) Added `Serie`'s `ignoreLineBreak` (#164)
 * (2021.08.22) Fixed `Axis` label may not be updated when `DataZoom` is turn on (#164)
 * (2021.08.15) Improved `Axis`'s `AxisLabel` text rotate setting to avoid inconsistency offset in `DataZoom` (#163)

Assets/XCharts/CHANGELOG.md

@@ -39,6 +39,7 @@
 
 ## master
 
+* (2021.08.24) 增加`Animation`的`alongWithLinePath`参数设置折线轨迹匀速动画
 * (2021.08.22) 增加`Serie`的`ignoreLineBreak`参数设置忽略数据连线是否断开 (#164)
 * (2021.08.22) 修复`Axis`在`DataZoom`开启时`Label`可能不更新的问题 (#164)
 * (2021.08.15) 优化`Axis`的`AxisLabel`文本旋转设置，避免在DataZoom开启时偏移不一致 (#163)

Assets/XCharts/Documentation/XCharts配置项手册.md

@@ -810,6 +810,7 @@ K线图系列。
 * `fadeOutDuration`：设定的渐出动画时长，单位毫秒。如果要设置单个数据项的渐出时长，可以用代码定制：`customFadeOutDuration`。
 * `dataChangeEnable`：是否开启数据变更动画。
 * `dataChangeDuration`：数据变更动画时长，单位毫秒。
+* `alongWithLinePath`：是否沿着线的轨迹进行匀速动画。
 
 ## `AreaStyle`
 

Assets/XCharts/Editor/PropertyDrawers/AnimationDrawer.cs

@@ -28,6 +28,7 @@ namespace XCharts
                 PropertyField(prop, "m_DataChangeEnable");
                 PropertyField(prop, "m_DataChangeDuration");
                 PropertyField(prop, "m_ActualDuration");
+                PropertyField(prop, "m_AlongWithLinePath");
                 --EditorGUI.indentLevel;
             }
         }

Assets/XCharts/Runtime/Component/Sub/SerieAnimation.cs

@@ -35,6 +35,7 @@ namespace XCharts
         [SerializeField] private bool m_DataChangeEnable = true;
         [SerializeField] private float m_DataChangeDuration = 500;
         [SerializeField] private float m_ActualDuration;
+        [SerializeField] private bool m_AlongWithLinePath;
         /// <summary>
         /// 自定义渐入动画延时函数。返回ms值。
         /// </summary>
@@ -101,6 +102,10 @@ namespace XCharts
         /// </summary>
         public float dataChangeDuration { get { return m_DataChangeDuration; } set { m_DataChangeDuration = value < 0 ? 0 : value; } }
         /// <summary>
+        /// 是否沿着线的轨迹进行匀速动画。
+        /// </summary>
+        public bool alongWithLinePath { get { return m_AlongWithLinePath; } set { m_AlongWithLinePath = value; } }
+        /// <summary>
         /// 渐入动画完成回调
         /// </summary>
         public Action fadeInFinishCallback { get; set; }

Assets/XCharts/Runtime/Internal/CoordinateChart_DrawLine.cs

@@ -172,10 +172,6 @@ namespace XCharts
             lp = startPos;
             stPos1 = stPos2 = lastDir = lastDnPos = Vector3.zero;
             smoothStartPosUp = smoothStartPosDn = Vector3.zero;
-            float currDetailProgress = lp.x;
-            float totalDetailProgress = endPos.x;
-            serie.animation.InitProgress(serie.dataPoints.Count, currDetailProgress, totalDetailProgress);
-            serie.animation.SetDataFinish(startIndex);
 
             Vector3 firstLastPos = Vector3.zero, lastNextPos = Vector3.zero;
             if (serie.minShow > 0 && serie.minShow < showData.Count)
@@ -215,6 +211,27 @@ namespace XCharts
                 lastNextPos = endPos;
             }
             VisualMapHelper.AutoSetLineMinMax(visualMap, serie, xAxis, yAxis);
+
+            float currDetailProgress = lp.x;
+            float totalDetailProgress = endPos.x;
+            if (serie.animation.alongWithLinePath)
+            {
+                currDetailProgress = 0;
+                totalDetailProgress = 0;
+                var tempLp = startPos;
+                for (i = startIndex + 1; i < serie.dataPoints.Count; i++)
+                {
+                    np = serie.dataPoints[i];
+                    if (np != Vector3.zero)
+                    {
+                        totalDetailProgress += Vector3.Distance(np, tempLp);
+                        tempLp = np;
+                    }
+                }
+            }
+            serie.animation.InitProgress(serie.dataPoints.Count, currDetailProgress, totalDetailProgress);
+            serie.animation.SetDataFinish(startIndex);
+            var currLineDist = 0f;
             for (i = startIndex + 1; i < serie.dataPoints.Count; i++)
             {
                 np = serie.dataPoints[i];
@@ -252,7 +269,7 @@ namespace XCharts
                             isIgnoreBreak ? ColorUtil.clearColor32 : lineColor,
                             isIgnoreBreak ? ColorUtil.clearColor32 : areaColor,
                             isIgnoreBreak ? ColorUtil.clearColor32 : areaToColor,
-                            zeroPos, startIndex);
+                            zeroPos, startIndex, currLineDist);
                         break;
                     case LineType.Smooth:
                     case LineType.SmoothDash:
@@ -289,7 +306,12 @@ namespace XCharts
                         break;
                 }
                 if (isFinish) serie.animation.SetDataFinish(i);
-                if (np != Vector3.zero || serie.ignoreLineBreak) lp = np;
+                if (np != Vector3.zero || serie.ignoreLineBreak)
+                {
+                    if (serie.animation.alongWithLinePath)
+                        currLineDist += Vector3.Distance(np, lp);
+                    lp = np;
+                }
             }
             if (!serie.animation.IsFinish())
             {
@@ -641,7 +663,7 @@ namespace XCharts
                     case LineType.Normal:
                         nnp = i < serie.dataPoints.Count - 1 ? serie.dataPoints[i + 1] : np;
                         isFinish = DrawNormalLine(vh, serie, yAxis, lp, np, nnp, i, lineColor,
-                            areaColor, areaToColor, zeroPos);
+                            areaColor, areaToColor, zeroPos, 0, 0);
                         break;
                     case LineType.Smooth:
                     case LineType.SmoothDash:
@@ -701,7 +723,7 @@ namespace XCharts
         private bool lastIsDown;
         private bool DrawNormalLine(VertexHelper vh, Serie serie, Axis axis, Vector3 lp, Vector3 np, Vector3 nnp,
             int dataIndex, Color32 lineColor, Color32 areaColor, Color32 areaToColor,
-            Vector3 zeroPos, int startIndex = 0)
+            Vector3 zeroPos, int startIndex, float currLineDist)
         {
             var defaultLineColor = lineColor;
             var isSecond = dataIndex == startIndex + 1;
@@ -787,7 +809,12 @@ namespace XCharts
             {
                 var isEndPos = i == segment - 1;
                 var cp = lp + dir1 * (dist * i / segment);
-                if (serie.animation.CheckDetailBreak(cp, isYAxis)) isBreak = true;
+                if (serie.animation.alongWithLinePath)
+                {
+                    currLineDist += Vector3.Distance(cp, start);
+                    if (serie.animation.CheckDetailBreak(currLineDist)) isBreak = true;
+                }
+                else if (serie.animation.CheckDetailBreak(cp, isYAxis)) isBreak = true;
                 var tp1 = cp - dir1v * serie.lineStyle.GetWidth(m_Theme.serie.lineWidth);
                 var tp2 = cp + dir1v * serie.lineStyle.GetWidth(m_Theme.serie.lineWidth);
                 CheckLineGradientColor(cp, serie.lineStyle, axis, defaultLineColor, ref lineColor);