[incubator-echarts] 01/03: feat: add sausage shape

[ov...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

ovilia pushed a commit to branch fix-4856
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit cf414a29fac6045b7c3fe154b297093e299ee358
Author: Ovilia <zw...@gmail.com>
AuthorDate: Thu Oct 10 18:03:34 2019 +0800

    feat: add sausage shape
---
 src/util/graphic.js |  5 ++++
 src/util/symbol.js  | 77 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 82 insertions(+)

diff --git a/src/util/graphic.js b/src/util/graphic.js
index 0ca633d..1d09806 100644
--- a/src/util/graphic.js
+++ b/src/util/graphic.js
@@ -42,6 +42,7 @@ import RadialGradient from 'zrender/src/graphic/RadialGradient';
 import BoundingRect from 'zrender/src/core/BoundingRect';
 import IncrementalDisplayable from 'zrender/src/graphic/IncrementalDisplayable';
 import * as subPixelOptimizeUtil from 'zrender/src/graphic/helper/subPixelOptimize';
+import fixPathClipWithShadow from 'zrender/src/graphic/helper/fixClipWithShadow';
 
 
 var mathMax = Math.max;
@@ -75,6 +76,10 @@ export function extendShape(opts) {
     return Path.extend(opts);
 }
 
+export function fixClipWithShadow() {
+    return fixPathClipWithShadow(Path.prototype.brush);
+}
+
 /**
  * Extend path
  */
diff --git a/src/util/symbol.js b/src/util/symbol.js
index 602ebfb..99f4eec 100644
--- a/src/util/symbol.js
+++ b/src/util/symbol.js
@@ -130,6 +130,72 @@ var Pin = graphic.extendShape({
 });
 
 /**
+ * Sausage: similar to sector, but have half circle on both sides
+ * @inner
+ */
+var Sausage = graphic.extendShape({
+
+    type: 'sausage',
+
+    shape: {
+
+        cx: 0,
+
+        cy: 0,
+
+        r0: 0,
+
+        r: 0,
+
+        startAngle: 0,
+
+        endAngle: Math.PI * 2,
+
+        clockwise: true
+    },
+
+    brush: graphic.fixClipWithShadow(),
+
+    buildPath: function (ctx, shape) {
+
+        var x = shape.cx;
+        var y = shape.cy;
+        var r0 = Math.max(shape.r0 || 0, 0);
+        var r = Math.max(shape.r, 0);
+        var dr = (r - r0) * 0.5;
+        var rCenter = r0 + dr;
+        var startAngle = shape.startAngle;
+        var endAngle = shape.endAngle;
+        var clockwise = shape.clockwise;
+
+        var unitX = Math.cos(startAngle);
+        var unitY = Math.sin(startAngle);
+
+        ctx.moveTo(unitX * r0 + x, unitY * r0 + y);
+
+        ctx.arc(unitX * rCenter + x, unitY * rCenter + y, dr,
+            Math.PI + startAngle, startAngle, !clockwise);
+
+        ctx.arc(x, y, r, startAngle, endAngle, !clockwise);
+
+        ctx.arc(
+            Math.cos(endAngle) * rCenter + x,
+            Math.sin(endAngle) * rCenter + x,
+            dr,
+            endAngle,
+            endAngle + Math.PI,
+            !clockwise
+        );
+
+        if (r0 !== 0) {
+            ctx.arc(x, y, r0, endAngle, startAngle, clockwise);
+        }
+
+        ctx.closePath();
+    }
+});
+
+/**
  * Arrow shape
  * @inner
  */
@@ -179,6 +245,8 @@ var symbolCtors = {
 
     pin: Pin,
 
+    sausage: Sausage,
+
     arrow: Arrow,
 
     triangle: Triangle
@@ -209,6 +277,15 @@ var symbolShapeMakers = {
         shape.r = Math.min(w, h) / 4;
     },
 
+    sausage: function (x, y, w, h, shape) {
+        shape.r = Math.min(w, h) / 2;
+        shape.r0 = shape.r / 2;
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.startAngle = -Math.PI / 6;
+        shape.endAngle = Math.PI / 6 * 7;
+    },
+
     square: function (x, y, w, h, shape) {
         var size = Math.min(w, h);
         shape.x = x;


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org