fix(data-vi): association fields transform bug (#3737)
* fix(data-vi): association fields transform bug * fix: bug
This commit is contained in:
		
							parent
							
								
									4cf560b177
								
							
						
					
					
						commit
						3be6b7c0c6
					
				@ -76,8 +76,7 @@ export class DualAxes extends G2PlotChart {
 | 
				
			|||||||
            yField,
 | 
					            yField,
 | 
				
			||||||
            colorField: () => {
 | 
					            colorField: () => {
 | 
				
			||||||
              const props = fieldProps[yField];
 | 
					              const props = fieldProps[yField];
 | 
				
			||||||
              const transformer = props?.transformer;
 | 
					              return props?.label || yField;
 | 
				
			||||||
              return props?.label || (transformer ? transformer(yField) : yField);
 | 
					 | 
				
			||||||
            },
 | 
					            },
 | 
				
			||||||
            axis: {
 | 
					            axis: {
 | 
				
			||||||
              y: {
 | 
					              y: {
 | 
				
			||||||
 | 
				
			|||||||
@ -1,4 +1,3 @@
 | 
				
			|||||||
import { transform } from 'lodash';
 | 
					 | 
				
			||||||
import { Chart, ChartProps, ChartType, RenderProps } from '../chart';
 | 
					import { Chart, ChartProps, ChartType, RenderProps } from '../chart';
 | 
				
			||||||
import configs from './configs';
 | 
					import configs from './configs';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -25,31 +24,17 @@ export class G2PlotChart extends Chart {
 | 
				
			|||||||
  };
 | 
					  };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  getProps({ data, general, advanced, fieldProps }: RenderProps) {
 | 
					  getProps({ data, general, advanced, fieldProps }: RenderProps) {
 | 
				
			||||||
    const meta = {};
 | 
					 | 
				
			||||||
    // Some charts render wrong when the field name contains a dot in G2Plot
 | 
					 | 
				
			||||||
    const replace = (key: string) => key.replace(/\./g, '_');
 | 
					 | 
				
			||||||
    general = Object.entries(general).reduce((obj, [key, value]) => {
 | 
					 | 
				
			||||||
      obj[key] = value;
 | 
					 | 
				
			||||||
      if (key.includes('Field')) {
 | 
					 | 
				
			||||||
        if (Array.isArray(value)) {
 | 
					 | 
				
			||||||
          obj[key] = value.map((v) => (v?.includes('.') ? replace(v) : v));
 | 
					 | 
				
			||||||
        } else if (typeof value === 'string' && value.includes('.')) {
 | 
					 | 
				
			||||||
          obj[key] = replace(value);
 | 
					 | 
				
			||||||
        }
 | 
					 | 
				
			||||||
      }
 | 
					 | 
				
			||||||
      return obj;
 | 
					 | 
				
			||||||
    }, {});
 | 
					 | 
				
			||||||
    const config = {
 | 
					    const config = {
 | 
				
			||||||
      legend: {
 | 
					      legend: {
 | 
				
			||||||
        color: {
 | 
					        color: {
 | 
				
			||||||
          itemLabelText: (datnum) => {
 | 
					          itemLabelText: (datnum: { label: string }) => {
 | 
				
			||||||
            const props = fieldProps[datnum.label];
 | 
					            const props = fieldProps[general.seriesField];
 | 
				
			||||||
            const transformer = props?.transformer;
 | 
					            const transformer = props?.transformer;
 | 
				
			||||||
            return props?.label || (transformer ? transformer(datnum.label) : datnum.label);
 | 
					            return transformer ? transformer(datnum.label) : datnum.label;
 | 
				
			||||||
          },
 | 
					          },
 | 
				
			||||||
        },
 | 
					        },
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      tooltip: (d, index, data, column) => {
 | 
					      tooltip: (d, index: number, data, column: any) => {
 | 
				
			||||||
        const field = column.y.field;
 | 
					        const field = column.y.field;
 | 
				
			||||||
        const props = fieldProps[field];
 | 
					        const props = fieldProps[field];
 | 
				
			||||||
        const name = props?.label || field;
 | 
					        const name = props?.label || field;
 | 
				
			||||||
@ -59,30 +44,21 @@ export class G2PlotChart extends Chart {
 | 
				
			|||||||
      },
 | 
					      },
 | 
				
			||||||
      axis: {
 | 
					      axis: {
 | 
				
			||||||
        x: {
 | 
					        x: {
 | 
				
			||||||
          labelFormatter: (datnum) => {
 | 
					          labelFormatter: (datnum: any) => {
 | 
				
			||||||
            const props = fieldProps[general.xField];
 | 
					            const props = fieldProps[general.xField];
 | 
				
			||||||
            const transformer = props?.transformer;
 | 
					            const transformer = props?.transformer;
 | 
				
			||||||
            return transformer ? transformer(datnum) : datnum;
 | 
					            return transformer ? transformer(datnum) : datnum;
 | 
				
			||||||
          },
 | 
					          },
 | 
				
			||||||
        },
 | 
					        },
 | 
				
			||||||
        y: {
 | 
					        y: {
 | 
				
			||||||
          labelFormatter: (datnum) => {
 | 
					          labelFormatter: (datnum: any) => {
 | 
				
			||||||
            const props = fieldProps[general.yField];
 | 
					            const props = fieldProps[general.yField];
 | 
				
			||||||
            const transformer = props?.transformer;
 | 
					            const transformer = props?.transformer;
 | 
				
			||||||
            return transformer ? transformer(datnum) : datnum;
 | 
					            return transformer ? transformer(datnum) : datnum;
 | 
				
			||||||
          },
 | 
					          },
 | 
				
			||||||
        },
 | 
					        },
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      data: data.map((item) => {
 | 
					      data,
 | 
				
			||||||
        const obj = {};
 | 
					 | 
				
			||||||
        Object.entries(item).forEach(([key, value]) => {
 | 
					 | 
				
			||||||
          if (key.includes('.')) {
 | 
					 | 
				
			||||||
            key = replace(key);
 | 
					 | 
				
			||||||
          }
 | 
					 | 
				
			||||||
          obj[key] = value;
 | 
					 | 
				
			||||||
        });
 | 
					 | 
				
			||||||
        return obj;
 | 
					 | 
				
			||||||
      }),
 | 
					 | 
				
			||||||
      theme: 'classic',
 | 
					      theme: 'classic',
 | 
				
			||||||
      animate: {
 | 
					      animate: {
 | 
				
			||||||
        enter: {
 | 
					        enter: {
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user