fix: lable visible

antvis · May 22, 2022 · eb67abf · eb67abf
1 parent ec2390f
commit eb67abf
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 18 deletions.
diff --git a/packages/composite-layers/package.json b/packages/composite-layers/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-composite-layers",
-  "version": "0.0.1-alpha.3",
+  "version": "0.0.1-alpha.4",
   "description": "Composite layer for @antv/l7",
   "main": "dist/lib/index.js",
   "types": "dist/lib/index.d.ts",

diff --git a/packages/composite-layers/src/composite-layers/bubble-layer/index.ts b/packages/composite-layers/src/composite-layers/bubble-layer/index.ts
@@ -98,37 +98,37 @@ export class BubbleLayer extends CompositeLayer<BubbleLayerOptions> {
 
     // 映射填充图层
     const fillLayer = new PointLayer({
+      ...this.getFillLayerOptions(),
       id: 'fillLayer',
       shape: 'circle',
-      ...this.getFillLayerOptions(),
       source,
     });
 
     // 高亮描边图层
     const highlightStrokeLayer = new PointLayer({
+      ...this.gethigHlightStrokeLayerOptions(),
       id: 'highlightStrokeLayer',
       shape: 'circle',
-      ...this.gethigHlightStrokeLayerOptions(),
     });
 
     // 选中填充图层
     const selectFillLayer = new PointLayer({
+      ...this.getSelectFillLayerOptions(),
       id: 'selectFillLayer',
       shape: 'circle',
-      ...this.getSelectFillLayerOptions(),
     });
 
     // 选中描边图层
     const selectStrokeLayer = new PointLayer({
+      ...this.getSelectStrokeLayerOptions(),
       id: 'selectStrokeLayer',
       shape: 'circle',
-      ...this.getSelectStrokeLayerOptions(),
     });
 
     // 标注图层
     const labelLayer = new TextLayer({
+      ...this.getLabelLayerOptions(),
       id: 'labelLayer',
-      ...this.getTextLayerOptions(),
       source,
     });
 
@@ -249,14 +249,15 @@ export class BubbleLayer extends CompositeLayer<BubbleLayerOptions> {
     return option;
   }
 
-  private getTextLayerOptions() {
+  private getLabelLayerOptions() {
     const { visible, minZoom, maxZoom, zIndex = 0, label } = this.options;
+    const labelVisible = visible && Boolean(label) && (isUndefined(label?.visible) || label?.visible);
     const options = {
       zIndex: zIndex + 0.1,
       minZoom,
       maxZoom,
       ...label,
-      visible: visible && (label?.visible || Boolean(label)),
+      visible: labelVisible,
     };
 
     return options;

diff --git a/packages/composite-layers/src/composite-layers/choropleth-layer/index.ts b/packages/composite-layers/src/composite-layers/choropleth-layer/index.ts
@@ -105,44 +105,44 @@ export class ChoroplethLayer extends CompositeLayer<ChoroplethLayerOptions> {
 
     // 映射填充面图层
     const fillLayer = new PolygonLayer({
+      ...this.getFillLayerOptions(),
       id: 'fillLayer',
       shape: 'fill',
-      ...this.getFillLayerOptions(),
       source,
     });
     const fillBottomColor = this.options.fillBottomColor;
     fillBottomColor && fillLayer.layer.setBottomColor(fillBottomColor);
 
     // 描边图层
     const strokeLayer = new LineLayer({
+      ...this.getStrokeLayerOptions(),
       id: 'strokeLayer',
       shape: 'line',
-      ...this.getStrokeLayerOptions(),
       source,
     });
 
     // 高亮描边图层
     const highlightStrokeLayer = new LineLayer({
-      id: 'highlightStrokeLayer',
       ...this.gethigHlightStrokeLayerOptions(),
+      id: 'highlightStrokeLayer',
     });
 
     // 选中填充图层
     const selectFillLayer = new PolygonLayer({
-      id: 'selectFillLayer',
       ...this.getSelectFillLayerOptions(),
+      id: 'selectFillLayer',
     });
 
     // 选中描边图层
     const selectStrokeLayer = new LineLayer({
-      id: 'selectStrokeLayer',
       ...this.getSelectStrokeLayerOptions(),
+      id: 'selectStrokeLayer',
     });
 
     // 标注图层
     const labelLayer = new TextLayer({
+      ...this.getLabelLayerOptions(),
       id: 'labelLayer',
-      ...this.getTextLayerOptions(),
       source,
     });
 
@@ -272,14 +272,15 @@ export class ChoroplethLayer extends CompositeLayer<ChoroplethLayerOptions> {
     return option;
   }
 
-  private getTextLayerOptions() {
+  private getLabelLayerOptions() {
     const { visible, minZoom, maxZoom, zIndex = 0, label } = this.options;
+    const labelVisible = visible && Boolean(label) && (isUndefined(label?.visible) || label?.visible);
     const options = {
       zIndex: zIndex + 0.1,
       minZoom,
       maxZoom,
       ...label,
-      visible: visible && (label?.visible || Boolean(label)),
+      visible: labelVisible,
     };
 
     return options;

diff --git a/packages/composite-layers/src/version.ts b/packages/composite-layers/src/version.ts
@@ -1 +1 @@
-export default '0.0.1-alpha.3';
+export default '0.0.1-alpha.4';
diff --git a/storybook/stories/composite-layers/choropleth-layer/ChinaCitys.tsx b/storybook/stories/composite-layers/choropleth-layer/ChinaCitys.tsx
@@ -40,7 +40,6 @@ class ChinaCitys extends Component {
           lineWidth: 0.6,
           lineOpacity: 1,
           label: {
-            visible: true,
             field: 'name',
             style: {
               fill: '#000',