fix: 自定义marker (#2021)

Co-authored-by: 兵人 <[email protected]>
antvis · Nov 22, 2024 · a91f1b1 · a91f1b1
1 parent d5ecb2e
commit a91f1b1
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 1 deletion.
diff --git a/packages/f2/src/components/legend/legendView.tsx b/packages/f2/src/components/legend/legendView.tsx
@@ -88,7 +88,7 @@ export default (props) => {
             data-item={item}
             onClick={onClick}
           >
-            {Marker({ color: filtered ? '#bfbfbf' : color, type: marker })}
+            {Marker({ color: filtered ? '#bfbfbf' : color, type: item?.marker || marker })}
             {/* <Marker color={filtered ? '#bfbfbf' : color} type={marker} /> */}
             <text
               attrs={{

diff --git a/.../legend/__image_snapshots__/legend-test-tsx-图例-图例样式-自定义-items-marker-1-snap.png b/.../legend/__image_snapshots__/legend-test-tsx-图例-图例样式-自定义-items-marker-1-snap.png
diff --git a/packages/f2/test/components/legend/legend.test.tsx b/packages/f2/test/components/legend/legend.test.tsx
@@ -317,6 +317,49 @@ describe('图例', () => {
       await delay(1000);
       expect(context).toMatchImageSnapshot();
     });
+
+
+    it('自定义 items Marker', async () => {
+      const context = createContext('自定义 items Marker', {
+        height: '70px',
+      });
+      const { props } = (
+        <Canvas context={context} pixelRatio={1}>
+          <Chart data={data}>
+            <Legend
+              style={{
+                justifyContent: 'flex-start',
+              }}
+              marker="line"
+              items={[
+                {
+                  color: 'blue',
+                  name: 'Sports',
+                  value: 0.1,
+                  marker: 'square'
+                },
+                {
+                  color: 'red',
+                  name: 'Strategy',
+                  value: 0.2,
+                },
+                {
+                  color: 'red',
+                  name: 'Action',
+                  value: 0.3,
+                },
+              ]}
+            />
+            <Geometry x="genre" y="sold" color="genre" />
+          </Chart>
+        </Canvas>
+      );
+      const canvas = new Canvas(props);
+      await canvas.render();
+
+      await delay(1000);
+      expect(context).toMatchImageSnapshot();
+    });
   });
 
   describe('点击交互', () => {