Search code examples
echarts

Echarts Sunburst Child with 2 Parents


I'm trying to create a sunburst where a child element can overlap 2 parent elements, like in the picture below. However, I haven't been able to find any way of recreating this. Does anyone have any ideas?

Thanks for any help anyone can offer!

enter image description here


Solution

  • If you dont need special sunburst funcionalities you could use multiple pie charts:

    option = {
      series: [
        {
          type: 'pie',
          radius: ['45%', '70%'],
          label: {
            position: 'inside'
          },
          data: [
            { value: 1048, name: 'Area 1' },
            { value: 735, name: 'Area 2' },
            { value: 580, name: 'Area 3' },
            { value: 484, name: 'Area 4' },
            { value: 300, name: 'Area 5' }
          ]
        },
        {
          type: 'pie',
          startAngle: 20,
          radius: ['20%', '45%'],
          label: {
            position: 'inside'
          },
          data: [
            { value: 1048, name: 'Parent 1' },
            { value: 735, name: 'Parent 2' },
            { value: 580, name: 'Parent 3' },
          ]
        }
      ]
    };
    

    Here is an example.