fix: 问题处理

packages/li-analysis-assets/src/widgets/LegendWidget/helper.ts

@@ -86,6 +86,11 @@ export const parserLegendData = (layer: Layer) => {
     colors.push(item.color);
   });
 
+  if (type === 'threshold') {
+    labels.splice(0, 1, '<');
+    labels.splice(labels.length - 1, 1, '<');
+  }
+
   if (type === 'cat') {
     // 分类图例
     // 对标签进行排序

packages/li-p2/src/LayerAttribute/BubbleLayerStyle/helper.ts

@@ -5,15 +5,11 @@ import type { BubbleLayerStyleAttributeValue } from './types';
  * 将表单的平铺数据转为图层样式的数据结构
  * */
 export const bubbleLayerStyleFlatToConfig = (style: Record<string, any>) => {
-  const isCustom =
-    style.fillColorScale.type === 'threshold' ||
-    (style.fillColorScale.type === 'cat' && style.fillColorScale.domain?.length !== 0);
-
   const fillColor = style.fillColorField
     ? {
         field: style.fillColorField,
-        value: isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
-        scale: isCustom
+        value: style.fillColorScale.isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
+        scale: style.fillColorScale.isCustom
           ? {
               type: style.fillColorScale.type,
               domain: style.fillColorScale.domain,
@@ -81,8 +77,8 @@ export const bubbleLayerStyleConfigToFlat = (styleConfig: BubbleLayerStyleAttrib
   const fillColorScale =
     typeof fillColor === 'object'
       ? {
-          type: fillColor?.scale?.type ?? '',
-          domain: fillColor?.scale?.domain ?? [],
+          type: fillColor?.scale?.type,
+          domain: fillColor?.scale?.domain,
           range: fillColor?.value,
         }
       : undefined;

packages/li-p2/src/LayerAttribute/ChoroplethLayerStyle/helper.ts

@@ -5,15 +5,11 @@ import type { ChoroplethLayerStyleAttributeValue } from './types';
  * 将表单的平铺数据转为图层样式的数据结构
  * */
 export const choroplethLayerStyleFlatToConfig = (style: Record<string, any>) => {
-  const isCustom =
-    style.fillColorScale.type === 'threshold' ||
-    (style.fillColorScale.type === 'cat' && style.fillColorScale.domain?.length !== 0);
-
   const fillColor = style.fillColorField
     ? {
         field: style.fillColorField,
-        value: isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
-        scale: isCustom
+        value: style.fillColorScale.isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
+        scale: style.fillColorScale.isCustom
           ? {
               type: style.fillColorScale.type,
               domain: style.fillColorScale.domain,
@@ -69,8 +65,8 @@ export const choroplethLayerStyleConfigToFlat = (styleConfig: ChoroplethLayerSty
   const fillColorScale =
     typeof fillColor === 'object'
       ? {
-          type: fillColor?.scale?.type ?? '',
-          domain: fillColor?.scale?.domain ?? [],
+          type: fillColor?.scale?.type,
+          domain: fillColor?.scale?.domain,
           range: fillColor?.value,
         }
       : undefined;

packages/li-p2/src/LayerAttribute/GridLayerStyle/helper.ts

@@ -4,15 +4,11 @@ import type { GridLayerStyleAttributeValue } from './types';
  * 将表单的平铺数据转为图层样式的数据结构
  * */
 export const gridLayerStyleFlatToConfig = (style: Record<string, any>) => {
-  const isCustom =
-    style.fillColorScale.type === 'threshold' ||
-    (style.fillColorScale.type === 'cat' && style.fillColorScale.domain?.length !== 0);
-
   const fillColor = style.fillColorField
     ? {
         field: style.fillColorField,
-        value: isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
-        scale: isCustom
+        value: style.fillColorScale.isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
+        scale: style.fillColorScale.isCustom
           ? {
               type: style.fillColorScale.type,
               domain: style.fillColorScale.domain,
@@ -50,8 +46,8 @@ export const gridLayerStyleConfigToFlat = (styleConfig: GridLayerStyleAttributeV
   const fillColorScale =
     typeof color === 'object'
       ? {
-          type: color?.scale?.type ?? '',
-          domain: color?.scale?.domain ?? [],
+          type: color?.scale?.type,
+          domain: color?.scale?.domain,
           range: color?.value,
         }
       : undefined;

packages/li-p2/src/LayerAttribute/HexbinLayerStyle/helper.ts

@@ -4,15 +4,11 @@ import type { HexbinLayerStyleAttributeValue } from './types';
  * 将表单的平铺数据转为图层样式的数据结构
  * */
 export const hexbinLayerStyleFlatToConfig = (style: Record<string, any>) => {
-  const isCustom =
-    style.fillColorScale.type === 'threshold' ||
-    (style.fillColorScale.type === 'cat' && style.fillColorScale.domain?.length !== 0);
-
   const fillColor = style.fillColorField
     ? {
         field: style.fillColorField,
-        value: isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
-        scale: isCustom
+        value: style.fillColorScale.isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
+        scale: style.fillColorScale.isCustom
           ? {
               type: style.fillColorScale.type,
               domain: style.fillColorScale.domain,
@@ -51,8 +47,8 @@ export const hexbinLayerStyleConfigToFlat = (styleConfig: HexbinLayerStyleAttrib
   const fillColorScale =
     typeof color === 'object'
       ? {
-          type: color?.scale?.type ?? '',
-          domain: color?.scale?.domain ?? [],
+          type: color?.scale?.type,
+          domain: color?.scale?.domain,
           range: color?.value,
         }
       : undefined;

packages/li-p2/src/LayerAttribute/LineLayerStyle/helper.ts

@@ -5,15 +5,11 @@ import type { LineLayerStyleAttributeValue } from './types';
  * 将表单的平铺数据转为图层样式的数据结构
  * */
 export const lineLayerStyleFlatToConfig = (style: Record<string, any>) => {
-  const isCustom =
-    style.fillColorScale.type === 'threshold' ||
-    (style.fillColorScale.type === 'cat' && style.fillColorScale.domain?.length !== 0);
-
   const fillColor = style.fillColorField
     ? {
         field: style.fillColorField,
-        value: isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
-        scale: isCustom
+        value: style.fillColorScale.isCustom ? style.fillColorScale.range : style.fillColorRange?.colors,
+        scale: style.fillColorScale.isCustom
           ? {
               type: style.fillColorScale.type,
               domain: style.fillColorScale.domain,
@@ -65,8 +61,8 @@ export const lineLayerStyleConfigToFlat = (styleConfig: LineLayerStyleAttributeV
   const fillColorScale =
     typeof color === 'object'
       ? {
-          type: color?.scale?.type ?? '',
-          domain: color?.scale?.domain ?? [],
+          type: color?.scale?.type,
+          domain: color?.scale?.domain,
           range: color?.value,
         }
       : undefined;

packages/li-p2/src/LayerAttribute/components/ScaleSelector/CustomContent/index.tsx → packages/li-p2/src/LayerAttribute/components/ScaleSelector/CustomMaPpingColor/index.tsx

@@ -3,26 +3,26 @@ import { usePrefixCls } from '@formily/antd-v5/esm/__builtins__';
 import classnames from 'classnames';
 import { isEmpty, uniqueId } from 'lodash-es';
 import React, { useEffect, useMemo, useState } from 'react';
-import type { CustomItems, CustomItemType } from '../type';
+import type { CustomItems, CustomMappingData } from '../type';
 import CustomItem from './CustomItem';
 import useStyle from './style';
 
-type CustomContentProps = {
-  fieldType: 'string' | 'number';
+type CustomMaPpingColorProps = {
+  dataType: 'string' | 'number';
   domain: string[] | [number, number];
-  customRanges?: CustomItemType;
-  onChange: (value: CustomItemType) => void;
+  value?: CustomMappingData;
+  onChange: (value: CustomMappingData) => void;
   className?: string;
 };
 
-const CustomContent = (props: CustomContentProps) => {
-  const { fieldType = 'string', domain, customRanges: defaultCustomRanges, onChange, className } = props;
+const CustomMaPpingColor = (props: CustomMaPpingColorProps) => {
+  const { dataType = 'string', domain, value, onChange, className } = props;
   const prefixCls = usePrefixCls('formily-color-range-selector__custom-range');
   const [wrapSSR, hashId] = useStyle(prefixCls);
   const [customRanges, setCustomRanges] = useState<CustomItems[]>([]);
 
   const selectedOption = useMemo(() => {
-    if (fieldType === 'string' && customRanges.length) {
+    if (dataType === 'string' && customRanges.length) {
       const values = customRanges.map((item) => item.value).flat();
       return values;
     }
@@ -31,27 +31,27 @@ const CustomContent = (props: CustomContentProps) => {
   }, [customRanges]);
 
   const selectOptions = useMemo(() => {
-    if (fieldType === 'string') {
+    if (dataType === 'string') {
       return (domain as string[]).map((value: string) => ({ label: value, value }));
     }
 
     return [];
   }, [domain]);
 
   useEffect(() => {
-    if (defaultCustomRanges?.list?.length) {
-      const list = defaultCustomRanges.list.map((item: CustomItems) => {
+    if (value?.list?.length) {
+      const list = value.list.map((item: CustomItems) => {
         return {
           id: uniqueId(),
           ...item,
         };
       });
       setCustomRanges(list);
     }
-  }, [defaultCustomRanges]);
+  }, [value]);
 
   const addPaletteRangeItem = () => {
-    if (fieldType === 'number') {
+    if (dataType === 'number') {
       const _item = customRanges[customRanges.length - 1];
       const min = Number(_item.value[0]);
       const _interval = Number(((Number(domain[1]) - min) / 2).toFixed(2)) + min;
@@ -82,10 +82,8 @@ const CustomContent = (props: CustomContentProps) => {
     }
   };
 
-  console.log(customRanges);
-
   const deletePaletteRangeItem = (index: number, position: string | null) => {
-    if (fieldType === 'number') {
+    if (dataType === 'number') {
       const _value = customRanges[index];
 
       const list = customRanges
@@ -125,7 +123,7 @@ const CustomContent = (props: CustomContentProps) => {
   };
 
   const onChangePaletteRangeItem = (value: (string | number | null)[], color: string, index: number) => {
-    if (fieldType === 'number') {
+    if (dataType === 'number') {
       const list = customRanges.map((item, _index) => {
         if (index === _index) {
           return {
@@ -174,7 +172,7 @@ const CustomContent = (props: CustomContentProps) => {
     const list = customRanges.map((item) => {
       return { value: item.value, color: item.color };
     });
-    onChange({ type: fieldType, list });
+    onChange({ type: dataType, list });
   };
 
   return wrapSSR(
@@ -185,7 +183,7 @@ const CustomContent = (props: CustomContentProps) => {
 
         return (
           <CustomItem
-            customType={fieldType}
+            customType={dataType}
             key={`drag_card${index}`}
             color={customItem.color}
             value={customItem.value}
@@ -213,4 +211,4 @@ const CustomContent = (props: CustomContentProps) => {
   );
 };
 
-export default CustomContent;
+export default CustomMaPpingColor;

packages/li-p2/src/LayerAttribute/components/ScaleSelector/helper.ts

@@ -1,6 +1,6 @@
 import { fill, maxBy } from 'lodash-es';
 import { CUSTOM } from './constants';
-import type { CustomItems, CustomItemType, SelectorValue } from './type';
+import type { CustomItems, CustomMappingData, SelectorValue } from './type';
 
 // 当字段类型为string时，传递外部时 domain 结构转化
 export const stringToFix = (list: CustomItems[]) => {
@@ -21,43 +21,49 @@ export const stringToFix = (list: CustomItems[]) => {
       return _val.splice(i + index * colors.length, 0, _item);
     });
   }
+
   return _val;
 };
 
 // 将组件内部数据结构转化为图层数据
-export const transformToLayer = (val: CustomItemType) => {
+export const transformToLayer = (val: CustomMappingData) => {
   const { type, list } = val;
   const range = list.map((item) => item.color);
   if (type === 'number') {
     const _val = list.map((item) => item.value[1]).filter((item) => item);
 
-    return {
+    const layerValue = {
+      isCustom: true,
       type: 'threshold',
       domain: _val,
       range,
     } as SelectorValue;
+
+    return layerValue;
   }
 
   const _domain = stringToFix(list);
-  return {
+
+  const layerValue = {
+    isCustom: true,
     type: 'cat',
     domain: _domain,
     range,
   } as SelectorValue;
+
+  return layerValue;
 };
 
 // 将图层数据转化为组件内部数据结构
 export const transformToScale = (dataType: 'string' | 'number', val: SelectorValue) => {
-  if (!val) {
-    return undefined;
-  }
+  const isCustom = val.type === 'threshold' || (val.type === 'cat' && val.domain && val.domain.length !== 0);
 
-  const isCustom = val.type === 'threshold' || (val.type === 'cat' && val.domain?.length !== 0);
   if (!isCustom) {
     return val;
   }
 
-  const { domain = [], range = [] } = val || {};
+  const { domain = [], range = [] } = val;
+
   if (dataType === 'number') {
     const list = range.map((item: string, index: number) => {
       return {
@@ -111,10 +117,12 @@ export const getDefaultValue = (
     // 根据 range 来确定数值长度
     const _length: number = range.length - 1 > 0 ? range.length - 1 : 0;
     const _domain = fill(Array(_length), undefined).map((_, index) => {
-      return (min + _interval * index + 1).toFixed(2);
+      const _value = min + _interval * index + 1;
+      return _value % 1 === 0 ? _value : _value.toFixed(2);
     });
 
     return {
+      isCustom: true,
       type: 'threshold',
       domain: _domain,
       range,
@@ -123,12 +131,13 @@ export const getDefaultValue = (
     // 数值类型为 string 时
     const _domain = range.map((item, index) => {
       if (index + 1 === range.length) {
-        return { color: item, value: domain.slice(index).map((item) => item) };
+        return { color: item, value: domain.slice(index) };
       }
       return { color: item, value: [domain[index]] };
     });
 
     return {
+      isCustom: true,
       type: 'cat',
       domain: stringToFix(_domain),
       range,