#${prefix} rotate(string|number) = ‘radial’

{{ if: ${prefix} === ‘##’ }} 如果是 number 类型，则表示标签的旋转角，从 -90 度到 90 度，正值是逆时针。

除此之外，还可以是字符串 'radial' 表示径向旋转、'tangential' 表示切向旋转。

默认径向旋转，如果不需要文字旋转，可以将其设为 0。

下面的例子展示了不同的 rotate 设置方法：

~700x400 {{ else }} 同 label.rotate {{ /if }}

#${prefix} align(string) = ‘center’

文字对齐方式，可取值为：'left'、 'center'、 'right'。注意，'left' 是指靠近内圈，而 'right' 是指靠近外圈。

{{ if: ${prefix} === ‘##’ }} ~700x400 {{ else }} 同 label.align {{ /if }}

#${prefix} minAngle(number) = null

当某个扇形块的角度小于该值（角度制）时，扇形块对应的文字不显示。该值用以隐藏过小扇形块中的文字。

{{ use: partial-label( prefix = ${prefix}, defaultPosition = “‘inside’”, formatter = true, defaultShowLabel = “true”, noRotate = true, noAlign = true ) }}

#${prefix} label(Object)

label 描述了每个扇形块中，文本标签的样式。

优先级：series.data.label > series.levels.label > series.label。

{{ use: partial-sunburst-label-helper( prefix = ${prefix} + ‘#’ ) }}

#${prefix} labelLine(Object)

{{ use: partial-label-line( prefix = ‘#’ + ${prefix}, length2 = ${state} === ‘normal’, minTurnAngle = ${state} === ‘normal’, showAbove = ${state} === ‘normal’, smooth = ${state} === ‘normal’ ) }}

#${prefix} itemStyle(Object)

旭日图扇形块的样式。

可以在 series.itemStyle 定义所有扇形块的样式，也可以在 series.levels.itemStyle 定义每一层扇形块的样式，还可以在 series.data.itemStyle 定义每个扇形块单独的样式，这三者的优先级从低到高。也就是说，如果定义了 series.data.itemStyle，将会覆盖 series.itemStyle 和 series.levels.itemStyle。

优先级：series.data.itemStyle > series.levels.itemStyle > series.itemStyle。

{{ use: partial-item-style( prefix = ${prefix} + ‘#’, useColorPalatte = true, defaultBorderWidth = 1, defaultBorderColor = “‘white’”, defaultOpacity = 1, hasInherit = ${state} === ‘emphasis’, useDecal = ${state} === ‘normal’ ) }}

{{ use: partial-sunburst-label-props( prefix = ${prefix}, state = ${state} ) }}

{{ use: partial-sunburst-itemStyle-props( prefix = ${prefix}, state = ${state} ) }}

series.sunburst(Object)

旭日图（Sunburst）由多层的环形图组成，在数据结构上，内圈是外圈的父节点。因此，它既能像饼图一样表现局部和整体的占比，又能像矩形树图一样表现层级关系。

示例：

~700x500

~700x700

数据下钻

旭日图默认支持数据下钻，也就是说，当用户点击了某个扇形块之后，将会以该节点作为根结点显示，并且在中间出现一个返回上层节点的圆。如果不希望有数据下钻功能，可以通过将 series-sunburst.nodeClick 设置为 false 实现。

const option = { series: { type: ‘sunburst’, data: data } };

type(string) = ‘sunburst’

{{ use: component-circular-layout( componentName = “旭日图”, defaultRadius = “[0, ‘75%’]” ) }}

data(Array)

series-sunburst.data 的数据格式是树状的，例如：

[{
    name: 'parent1',
    value: 10,          // 可以不写父元素的 value，则为子元素之和；
                        // 如果写了，并且大于子元素之和，可以用来表示还有其他子元素未显示
    children: [{
        value: 5,
        name: 'child1',
        children: [{
            value: 2,
            name: 'grandchild1',
            itemStyle: {
                // 每个数据可以有自己的样式，覆盖 series.itemStyle 和 level.itemStyle
            },
            label: {
                // 标签样式，同上
            }
        }]
    }, {
        value: 3,
        name: 'child2'
    }],
    itemStyle: {
        // parent1 的图形样式，不会被后代继承
    },
    label: {
        // parent1 的标签样式，不会被后代继承
    }
}, {
    name: 'parent2',
    value: 4
}]

value(number)

数据值，如果包含 children，则可以不写 value 值。这时，将使用子元素的 value 之和作为父元素的 value。如果 value 大于子元素之和，可以用来表示还有其他子元素未显示。

name(string)

显示在扇形块中的描述文字。

link(string)

点击此节点可跳转的超链接。须 series-sunburst.nodeClick 值为 'link' 时才生效。

参见 series-sunburst.data.target。

target(string) = ‘blank’

意义同 HTML <a> 标签中的 target，参见 series-sunburst.data.link。可选值为：'blank' 或 'self'。

{{ use: partial-sunburst-state( prefix = “##”, state = ‘normal’ ) }}

labelLayout(Object|Function)

{{ use: partial-sunburst-state( prefix = “#”, state = ‘normal’ ) }}

emphasis

高亮状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘emphasis’ ) }}

blur

淡出状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘blur’ ) }}

select

选中状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘select’ ) }}

children(Array)

子节点，递归定义，格式同 series-sunburst.data。

nodeClick(boolean|string) = ‘rootToNode’

点击节点后的行为。可取值为：

false：节点点击无反应。
'rootToNode'：点击节点后以该节点为根结点。
'link'：如果节点数据中有 link 点击节点后会进行超链接跳转。

sort(string|Function) = ‘desc’

扇形块根据数据 value 的排序方式，如果未指定 value，则其值为子元素 value 之和。默认值 'desc' 表示降序排序；还可以设置为 'asc' 表示升序排序；null 表示不排序，使用原始数据的顺序；或者用回调函数进行排列：

function(nodeA, nodeB) {
    return nodeA.getValue() - nodeB.getValue();
}

renderLabelForZeroData(boolean) = false

如果数据没有 name，是否需要渲染文字。

{{ use: partial-sunburst-label-props( prefix = “#”, state = ‘normal’ ) }}

{{ use: partial-sunburst-itemStyle-props( prefix = “#”, state = ‘normal’ ) }}

emphasis

高亮状态配置。

{{ use: partial-sunburst-state( prefix = “##”, state = ‘emphasis’ ) }}

blur

淡出状态配置。开启 emphasis.focus 后有效。

{{ use: partial-sunburst-state( prefix = “##”, state = ‘blur’ ) }}

select

选中状态配置。开启 selectedMode 后有效。

{{ use: partial-sunburst-state( prefix = “##”, state = ‘select’ ) }}

levels(Array)

多层配置

旭日图是一种有层次的结构，为了方便同一层样式的配置，我们提供了 levels 配置项。它是一个数组，其中的第 0 项表示数据下钻后返回上级的图形，其后的每一项分别表示从圆心向外层的层级。

例如，假设我们没有数据下钻功能，并且希望将最内层的扇形块的颜色设为红色，文字设为蓝色，可以这样设置：

series: {
    // ...
    levels: [
        {
            // 留给数据下钻点的空白配置
        },
        {
            // 最靠内测的第一层
            itemStyle: {
                color: 'red'
            },
            label: {
                color: 'blue'
            }
        },
        {
            // 第二层 ...
        }
    ]
}

emphasis

高亮状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘emphasis’ ) }}

blur

淡出状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘blur’ ) }}

select

选中状态配置。

{{ use: partial-sunburst-state( prefix = “###”, state = ‘select’ ) }}

{{ use: partial-animation( prefix = “#”, defaultAnimationEasing = “‘cubicOut’”, defaultAnimationDuration = 1000, defaultAnimationDurationUpdate = 500 ) }}