[maps] fix Label border color is not removed from legend when disabled (#122705)

This commit is contained in:
Nathan Reese 2022-01-11 15:41:32 -07:00 committed by GitHub
parent cc2e3f386c
commit a5a5db4efe
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 35 additions and 11 deletions

View file

@ -48,8 +48,10 @@ import { IStyleProperty } from '../properties/style_property';
import { SymbolizeAsProperty } from '../properties/symbolize_as_property';
import { LabelBorderSizeProperty } from '../properties/label_border_size_property';
import { StaticTextProperty } from '../properties/static_text_property';
import { DynamicTextProperty } from '../properties/dynamic_text_property';
import { StaticSizeProperty } from '../properties/static_size_property';
import { IVectorLayer } from '../../../layers/vector_layer';
import { getHasLabel } from '../style_util';
export interface StyleProperties {
[key: string]: IStyleProperty<StylePropertyOptions>;
@ -167,14 +169,6 @@ export class VectorStyleEditor extends Component<Props, State> {
return iconSize.isDynamic() || (iconSize as StaticSizeProperty).getOptions().size > 0;
}
_hasLabel() {
const label = this.props.styleProperties[VECTOR_STYLES.LABEL_TEXT];
return label.isDynamic()
? label.isComplete()
: (label as StaticTextProperty).getOptions().value != null &&
(label as StaticTextProperty).getOptions().value.length;
}
_hasLabelBorder() {
const labelBorderSize = this.props.styleProperties[
VECTOR_STYLES.LABEL_BORDER_SIZE
@ -258,7 +252,11 @@ export class VectorStyleEditor extends Component<Props, State> {
}
_renderLabelProperties() {
const hasLabel = this._hasLabel();
const hasLabel = getHasLabel(
this.props.styleProperties[VECTOR_STYLES.LABEL_TEXT] as
| StaticTextProperty
| DynamicTextProperty
);
const hasLabelBorder = this._hasLabelBorder();
return (
<Fragment>

View file

@ -8,6 +8,8 @@
import { i18n } from '@kbn/i18n';
import { MB_LOOKUP_FUNCTION, VECTOR_SHAPE_TYPE, VECTOR_STYLES } from '../../../../common/constants';
import { Category } from '../../../../common/descriptor_types';
import { StaticTextProperty } from './properties/static_text_property';
import { DynamicTextProperty } from './properties/dynamic_text_property';
export function getOtherCategoryLabel() {
return i18n.translate('xpack.maps.styles.categorical.otherCategoryLabel', {
@ -107,3 +109,10 @@ export function makeMbClampedNumberExpression({
fallback,
];
}
export function getHasLabel(label: StaticTextProperty | DynamicTextProperty) {
return label.isDynamic()
? label.isComplete()
: (label as StaticTextProperty).getOptions().value != null &&
(label as StaticTextProperty).getOptions().value.length;
}

View file

@ -10,7 +10,12 @@ import React, { CSSProperties, ReactElement } from 'react';
import { FeatureIdentifier, Map as MbMap } from '@kbn/mapbox-gl';
import { FeatureCollection } from 'geojson';
import { StyleProperties, VectorStyleEditor } from './components/vector_style_editor';
import { getDefaultStaticProperties, LINE_STYLES, POLYGON_STYLES } from './vector_style_defaults';
import {
getDefaultStaticProperties,
LABEL_STYLES,
LINE_STYLES,
POLYGON_STYLES,
} from './vector_style_defaults';
import {
DEFAULT_ICON,
FIELD_ORIGIN,
@ -25,7 +30,7 @@ import {
import { StyleMeta } from './style_meta';
import { VectorIcon } from './components/legend/vector_icon';
import { VectorStyleLegend } from './components/legend/vector_style_legend';
import { isOnlySingleFeatureType } from './style_util';
import { isOnlySingleFeatureType, getHasLabel } from './style_util';
import { StaticStyleProperty } from './properties/static_style_property';
import { DynamicStyleProperty, IDynamicStyleProperty } from './properties/dynamic_style_property';
import { DynamicSizeProperty } from './properties/dynamic_size_property';
@ -745,12 +750,18 @@ export class VectorStyle implements IVectorStyle {
}
_getLegendDetailStyleProperties = () => {
const hasLabel = getHasLabel(this._labelStyleProperty);
return this.getDynamicPropertiesArray().filter((styleProperty) => {
const styleName = styleProperty.getStyleName();
if ([VECTOR_STYLES.ICON_ORIENTATION, VECTOR_STYLES.LABEL_TEXT].includes(styleName)) {
return false;
}
if (!hasLabel && LABEL_STYLES.includes(styleName)) {
// do not render legend for label styles when there is no label
return false;
}
if (this._getIsLinesOnly()) {
return LINE_STYLES.includes(styleName);
}

View file

@ -37,6 +37,12 @@ export const POLYGON_STYLES = [
VECTOR_STYLES.LINE_COLOR,
VECTOR_STYLES.LINE_WIDTH,
];
export const LABEL_STYLES = [
VECTOR_STYLES.LABEL_SIZE,
VECTOR_STYLES.LABEL_COLOR,
VECTOR_STYLES.LABEL_BORDER_COLOR,
VECTOR_STYLES.LABEL_BORDER_SIZE,
];
export function getDefaultStaticProperties(
mapColors: string[] = []