test(scatter-legend): 增加散点图图例用例（shapeLegend、sizeLegend） (#2446)

* feat(scatter): 散点图支持配置 shapeLegend & sizeLegend * test(scatter-legend): 增加散点图图例用例（shapeLegend、sizeLegend） Co-authored-by: visiky <736929286@qq.com> Co-authored-by: elvira.zy <elvira.zy@alibaba-inc.com>
antvis · Mar 22, 2021 · 90c04f9 · 90c04f9
1 parent 260cdcb
commit 90c04f9
Show file tree

Hide file tree

Showing 2 changed files with 108 additions and 0 deletions.
diff --git a/__tests__/unit/plots/scatter/legend-spec.ts b/__tests__/unit/plots/scatter/legend-spec.ts
@@ -197,6 +197,112 @@ describe('scatter', () => {
     scatter.destroy();
   });
 
+  it('shapeLegend: shapeField * {}', () => {
+    const scatter = new Scatter(createDiv(), {
+      width: 400,
+      height: 300,
+      appendPadding: 10,
+      data,
+      xField: 'weight',
+      yField: 'height',
+      shapeField: 'gender',
+      shapeLegend: {},
+      xAxis: {
+        nice: true,
+      },
+    });
+
+    scatter.render();
+    const legendController = scatter.chart.getController('legend');
+    // @ts-ignore
+    expect(legendController.option).toEqual({
+      gender: {},
+    });
+
+    scatter.destroy();
+  });
+
+  it('shapeLegend: legend * shapeField * false', () => {
+    const scatter = new Scatter(createDiv(), {
+      width: 400,
+      height: 300,
+      appendPadding: 10,
+      data,
+      xField: 'weight',
+      yField: 'height',
+      shapeField: 'gender',
+      shapeLegend: false,
+      colorField: '',
+      xAxis: {
+        nice: true,
+      },
+      legend: {},
+    });
+
+    scatter.render();
+    const legendController = scatter.chart.getController('legend');
+    // @ts-ignore
+    expect(legendController.option).toEqual({
+      gender: false,
+      height: false,
+      weight: false,
+    });
+
+    scatter.destroy();
+  });
+
+  it('sizeLegend: sizeField * {}', () => {
+    const scatter = new Scatter(createDiv(), {
+      width: 400,
+      height: 300,
+      appendPadding: 10,
+      data,
+      xField: 'weight',
+      yField: 'height',
+      sizeField: 'weight',
+      sizeLegend: {},
+      xAxis: {
+        nice: true,
+      },
+    });
+
+    scatter.render();
+    const legendController = scatter.chart.getController('legend');
+    // @ts-ignore
+    expect(legendController.option).toEqual({
+      weight: {},
+    });
+
+    scatter.destroy();
+  });
+
+  it('sizeLegend: legend * sizeField * false', () => {
+    const scatter = new Scatter(createDiv(), {
+      width: 400,
+      height: 300,
+      appendPadding: 10,
+      data,
+      xField: 'weight',
+      yField: 'height',
+      sizeField: 'weight',
+      sizeLegend: false,
+      colorField: '',
+      xAxis: {
+        nice: true,
+      },
+      legend: {},
+    });
+
+    scatter.render();
+    const legendController = scatter.chart.getController('legend');
+    // @ts-ignore
+    expect(legendController.option).toEqual({
+      height: false,
+      weight: false,
+    });
+
+  });
+
   const scatter = new Scatter(createDiv(), {
     width: 400,
     height: 300,

diff --git a/src/plots/scatter/adaptor.ts b/src/plots/scatter/adaptor.ts
@@ -147,6 +147,8 @@ function legend(params: Params<ScatterOptions>): Params<ScatterOptions> {
 
   if (!showLegend && !showShapeLegend && !showSizeLegend) {
     chart.legend(false);
+  } else if (!showSizeLegend && sizeField) {
+    chart.legend(sizeField, false);
   }
 
   return params;