fix: 映射逻辑修改

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

@@ -1,35 +1,71 @@
-import { fill, maxBy } from 'lodash-es';
+import { fill } from 'lodash-es';
 import { CUSTOM } from './constants';
 import type { CustomItems, CustomMappingData, SelectorValue } from './type';
 
-// 当字段类型为string时，传递外部时 domain 结构转化
-export const stringToFix = (list: CustomItems[]) => {
-  const colors = list.map((item) => item.color);
-  const _val: (string | number)[] = [];
-  const _length = maxBy(list.map((item) => item.value.length));
+// 字符映射转化
+const arrayToMap = (list: CustomItems[]) => {
+  const mapList: { color: string; value: string }[] = [];
+  list.forEach((item) => {
+    item.value.forEach((_item) => {
+      mapList.push({ color: item.color, value: _item as string });
+    });
+  });
 
-  for (let i = 0; i < list.length; i++) {
-    const item =
-      list[i].value.length === _length
-        ? list[i].value
-        : fill(Array(_length), undefined).map((_, index) => {
-            return list[i].value[index];
-          });
-
-    item.forEach((_item: string | number | null, index: number) => {
-      // @ts-ignore
-      return _val.splice(i + index * colors.length, 0, _item);
+  return {
+    domain: mapList.map((item) => item.value),
+    range: mapList.map((item) => item.color),
+  };
+};
+
+// 获取默认展示自定义数据
+export const getDefaultValue = (
+  dataType: 'number' | 'string',
+  defaultDomain: [number, number] | string[],
+  range: string[],
+) => {
+  if (dataType === 'number') {
+    const [min, max] = defaultDomain as [number, number];
+    // 数值类型计算均分间隔
+    const _interval = (max - min) / range.length;
+    // 根据 range 来确定数值长度
+    const _length: number = range.length - 1 > 0 ? range.length - 1 : 0;
+    const _domain = fill(Array(_length), undefined).map((_, index) => {
+      const _value = min + _interval * index + 1;
+      return _value % 1 === 0 ? _value : _value.toFixed(2);
     });
-  }
 
-  return _val;
+    return {
+      isCustom: true,
+      type: 'threshold',
+      domain: _domain,
+      range,
+    } as SelectorValue;
+  } else {
+    // 数值类型为 string 时
+    const _domain = range.map((item, index) => {
+      if (index + 1 === range.length) {
+        return { color: item, value: defaultDomain.slice(index) };
+      }
+      return { color: item, value: [defaultDomain[index]] };
+    });
+
+    const { domain, range: colors } = arrayToMap(_domain);
+
+    return {
+      isCustom: true,
+      type: 'cat',
+      domain,
+      range: colors,
+    } as SelectorValue;
+  }
 };
 
 // 将组件内部数据结构转化为图层数据
 export const transformToLayer = (val: CustomMappingData) => {
   const { type, list } = val;
-  const range = list.map((item) => item.color);
+
   if (type === 'number') {
+    const range = list.map((item) => item.color);
     const _val = list.map((item) => item.value[1]).filter((item) => item);
 
     const layerValue = {
@@ -42,12 +78,11 @@ export const transformToLayer = (val: CustomMappingData) => {
     return layerValue;
   }
 
-  const _domain = stringToFix(list);
-
+  const { domain, range } = arrayToMap(list);
   const layerValue = {
     isCustom: true,
     type: 'cat',
-    domain: _domain,
+    domain,
     range,
   } as SelectorValue;
 
@@ -63,7 +98,6 @@ export const transformToScale = (dataType: 'string' | 'number', val: SelectorVal
   }
 
   const { domain = [], range = [] } = val;
-
   if (dataType === 'number') {
     const list = range.map((item: string, index: number) => {
       return {
@@ -81,7 +115,7 @@ export const transformToScale = (dataType: 'string' | 'number', val: SelectorVal
   const list = domain.map((item: string | number, index: number) => {
     return {
       value: item,
-      color: range[index % range.length],
+      color: range[index],
     };
   });
 
@@ -103,44 +137,3 @@ export const transformToScale = (dataType: 'string' | 'number', val: SelectorVal
     })),
   };
 };
-
-// 获取默认展示自定义数据
-export const getDefaultValue = (
-  dataType: 'number' | 'string',
-  domain: [number, number] | string[],
-  range: string[],
-) => {
-  if (dataType === 'number') {
-    const [min, max] = domain as [number, number];
-    // 数值类型计算均分间隔
-    const _interval = (max - min) / range.length;
-    // 根据 range 来确定数值长度
-    const _length: number = range.length - 1 > 0 ? range.length - 1 : 0;
-    const _domain = fill(Array(_length), undefined).map((_, index) => {
-      const _value = min + _interval * index + 1;
-      return _value % 1 === 0 ? _value : _value.toFixed(2);
-    });
-
-    return {
-      isCustom: true,
-      type: 'threshold',
-      domain: _domain,
-      range,
-    } as SelectorValue;
-  } else {
-    // 数值类型为 string 时
-    const _domain = range.map((item, index) => {
-      if (index + 1 === range.length) {
-        return { color: item, value: domain.slice(index) };
-      }
-      return { color: item, value: [domain[index]] };
-    });
-
-    return {
-      isCustom: true,
-      type: 'cat',
-      domain: stringToFix(_domain),
-      range,
-    } as SelectorValue;
-  }
-};