Optimize the situation line may clip the top horizontal segment

src/chart/line/LineView.js

@@ -94,21 +94,22 @@ define(function(require) {
         var yExtent = getAxisExtentWithGap(cartesian.getAxis('y'));
         var isHorizontal = cartesian.getBaseAxis().isHorizontal();
 
-        var x = xExtent[0];
-        var y = yExtent[0];
-        var width = xExtent[1] - x;
-        var height = yExtent[1] - y;
-        // Expand clip shape to avoid line value exceeds axis
-        if (!seriesModel.get('clipOverflow')) {
-            if (isHorizontal) {
-                y -= height;
-                height *= 3;
-            }
-            else {
-                x -= width;
-                width *= 3;
-            }
+        var x = Math.min(xExtent[0], xExtent[1]);
+        var y = Math.min(yExtent[0], yExtent[1]);
+        var width = Math.max(xExtent[0], xExtent[1]) - x;
+        var height = Math.max(yExtent[0], yExtent[1]) - y;
+        var lineWidth = seriesModel.get('lineStyle.normal.width') || 2;
+        // Expand clip shape to avoid clipping when line value exceeds axis
+        var expandSize = seriesModel.get('clipOverflow') ? lineWidth / 2 : Math.max(width, height);
+        if (isHorizontal) {
+            y -= expandSize;
+            height += expandSize * 2;
         }
+        else {
+            x -= expandSize;
+            width += expandSize * 2;
+        }
+
         var clipPath = new graphic.Rect({
             shape: {
                 x: x,