Skip to content

[Bug] react/html attributes in funnel outer label can't be rendered #3462

@xile611

Description

@xile611

Version

1.12.13

Link to Minimal Reproduction

no

Steps to Reproduce


const spec = {
  type: 'funnel',
  maxSize: '75%',
  minSize: '10%',
  isTransform: true,
  shape: 'rect',
  transform: {
    style: {
      fill: '#44b15920',
      lineWidth: 4,
      stroke: 'white'
    }
  },
  label: {
    visible: false
    // formatMethod: () => {
    //   return {
    //     type: "react",
    //     text: {
    //       element: <div>aaa</div>,
    //       pointerEvents: true,
    //     },
    //   };
    // },
  },
  outerLabel: {
    visible: true,
    interactive: true,
    position: 'right',
    style: {
      forceBoundsWidth: 60
    },
    // 有问题的地方,渲染是[object Object]
    formatMethod: () => {
      return {
        type: 'html',
        text: {
          dom: `<div>aaa</div>`,
          pointerEvents: true
        }
      };
    }
  },
  transformLabel: {
    visible: false,
    style: {
      fill: '#000000'
    }
    // formatMethod: () => {
    //   return {
    //     type: "react",
    //     text: {
    //       element: <div>aaa</div>,
    //       pointerEvents: true,
    //     },
    //   };
    // },
  },
  data: [
    {
      name: 'funnel',
      values: [
        {
          value: 100,
          name: 'Resume Screening',
          percent: 1
        },
        {
          value: 80,
          name: 'Resume Evaluation',
          percent: 0.8
        },
        {
          value: 50,
          name: 'Evaluation Passed',
          percent: 0.5
        },
        {
          value: 30,
          name: 'Interview',
          percent: 0.3
        },
        {
          value: 10,
          name: 'Final Pass',
          percent: 0.1
        }
      ]
    }
  ],
  categoryField: 'name',
  valueField: 'value'
};

Current Behavior

img_v3_02gv_f0e8b43e-0e74-44ca-84db-093e1023a34g

Expected Behavior

react element can be rendered like other labels

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions