[Feature] Support border radius for backgroundColor image

[princ09]

Version

5.5

Link to Minimal Reproduction

https://echarts.apache.org/examples/en/editor.html?c=treemap-simple&code=PYBwLglsB2AEC8sDeAoWsDOBTAThLGAXLANprrLkWxgCeIWxA5GDllgLYCGITANFQoATLmC7Ey1aqilToXDo1hNowIVgCC_QbIBuXADYBXJQEYADANnUAxgAsIBoW2gSd1mddnzFzVeo0ubS89QxNiABZ3WQBfKxD0TwT0HyUVNU0AI2Dk9H1jJQA2aKkYkvQAXRK4kqTrVL8MgCEcr3zw2AAmS3LYe0dnLFdSXsTRigblfywmoPjc9qVu-eT-pxc3XOlx7wU06dnTVq28sKXzHYoyk6rc65Db63vqCpX0Ay5MrANiOuoAM2AOG4YDAuGI_yM0BskBgsAAFABKSgJNhgIw4OAAIiQEA4AHMAD4xLHVN4UPD2X7jPH46knTJcGwAa3xOGAUKEAGFgAYgfSTrA8Vx8Wk7KCQEQAPRSjAAZgAtBhaBxMryFXz8cAAHSsLhCCDQfG6fAAd21NmAHClbAMEC40KwCsNQiMGFY9oMzug_xwXHdOCMMIxWG1GF0-OOCRqJzsWAg-PFxAArD0TqaIEIwHYU2mtmqcOocAAlfUQN3ETrJ8bPJ7uWv3KoxADcQA

Steps to Reproduce

Run the given reporduction link or check this code

option = {
  series: [
    {
      type: 'treemap',
      data: [
        {
          name: 'nodeA',
          value: 10,
          children: [
            {
              name: 'nodeAa',
              value: 4
            },
            {
              name: 'nodeAb',
              value: 6
            }
          ]
        },
        {
          name: 'nodeB',
          value: 20,
          children: [
            {
              name: 'nodeBa',
              value: 20,
              children: [
                {
                  name: 'nodeBa1',
                  value: 20
                }
              ]
            }
          ]
        }
      ],
      label: {
        formatter: function () {
          return "{img|}"
        },
        rich: {
            img: {
              backgroundColor: {
                image: 'https://s3-symbol-logo.tradingview.com/reliance-industrial-infrastructure.svg',
              },
              height: 50,
              width: 50,
              borderRadius: 25
            }
          }
      }
    }
  ]
};

Current Behavior

Currently when set borderRadius, it not doing anything when backgroundColor is image

Expected Behavior

Image should have border radius.

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[plainheart]

This is not a bug but it might be supported in the future. Similar to #13929.

[princ09]

@plainheart
Is there any work around for this?
Bdw it's not a good idea to close issues without providing any alternative or work around for the issue.

Echarts have very good potential but because of lack of good communities or support from developers, this library is lagging behind from other libraries like highcharts.

[plainheart]

I closed it as it's a duplicate of known issues. I consider this as a feature that may be get supported in the future. StackOverflow is a good choice if you hope to get potential alternatives or more help. Issue list is originally for bug tracking and feature request. It's not a help center.

[princ09]

@plainheart ,
It's obvious that when we ask for alternatives or work around in issue, we mean alternative and work around solution available in echarts. That's also we are asking here because we have invested time to build something using this library.
The way you response clearly shows how unsupportive the community is.

Anyways thanks for your response.

[plainheart]

I'm sorry what I did makes you feel that the community is unsupportive. After debugging I can see that I've made a wrong triage for this issue, it's not similar to #13929 and instead, it can be an issue of documentation. The current underlying implementation does not support setting a border radius for an image element, but I will look into it and try to support this feature in the next version 5.5.2.

Demo for Debugging