feat: add hyphenPoint symbol

Author: wangxingkang

@sensoro-design/plots/src/index.ts

@@ -1,10 +1,13 @@
 import { register } from '@antv/g2';
 import { Dark } from './theme/dark';
 import { Light } from './theme/light';
+import { hyphenPoint } from './symbol/hyphenPoint';
 
 register('theme.dark', Dark);
 register('theme.light', Light);
 
+register('symbol.hyphenPoint', hyphenPoint);
+
 export { Dark, Light };
 export * from './components';
 export * from './config/colors';

@sensoro-design/plots/src/symbol/hyphenPoint.ts

@@ -0,0 +1,20 @@
+import type { SymbolFactor } from '@antv/g2';
+
+export const hyphenPoint = Object.assign<SymbolFactor, Partial<SymbolFactor>>(
+  (x, y, r) => {
+    const segment = r / 10;
+    const radius1 = segment * 1.25;
+
+    return [
+      ['M', segment * 3.75, -segment * 1.25],
+      ['L', -segment * 3.75, -segment * 1.25],
+      ['A', radius1, radius1, 0, 0, 0, -segment * 3.75, segment * 1.25],
+      ['L', segment * 3.75, segment * 1.25],
+      ['A', radius1, radius1, 0, 0, 0, segment * 3.75, -segment * 1.25],
+      ['Z'],
+    ];
+  },
+  {
+    style: ['fill'],
+  },
+);

packages/storybook/stories/Charts/Line.stories.tsx

@@ -42,7 +42,7 @@ export function Middle() {
     colorField: 'category',
     legend: {
       color: {
-        itemMarker: 'hyphen',
+        itemMarker: 'hyphenPoint',
         layout: {
           justifyContent: 'flex-end',
         },