百度饼图之南丁格尔玫瑰图（显示总额，数据在中间显示）

html基础代码看其它示例，下面直接上js代码

let dataName = [];
let datValue = []
let data = [
    {value: 400, name: '鹿城'},
    {value: 380, name: '龙湾'},
    {value: 320, name: '瓯海'},
    {value: 300, name: '洞头'},
    {value: 280, name: '乐清'},
    {value: 260, name: '瑞安'},
    {value: 220, name: '平阳'},
    {value: 188, name: '苍南'}
]
let total = 0;
data.forEach((res) => {
	total += parseFloat(res.value) * 10000;
});
total = total / 10000;
option = {
    title: {
		zlevel: 0,
		text: [
			'{value|￥' + total + '}',
			'{name|总金额}',
		].join('
'),
		top: 'center',
		left: '49%',
		textAlign: 'center',
		textStyle: {
			rich: {
				value: {
					color: '#303133',
					fontSize: 35,
					fontWeight: 'bold',
					lineHeight: 40,
				},
				name: {
					color: '#909399',
					lineHeight: 20,
					fontSize: 18
				},
			},
		},
	},
	series: [{
		name: '面积模式',
        type: 'pie',
        radius: ['35%', '75%'],
		center: ['50%', '50%'],
        roseType: 'area',
        itemStyle: {
            borderRadius: 10, //圆角大小
			borderColor: '#fff', //圆角边线的颜色
			borderWidth: 2 //边线的大小
        },
		stillShowZeroSum: false,
		avoidLabelOverlap: false,
		zlevel: 1,
		label: {
			normal: {
				padding: [10, 10, 10, 10],
				backgroundColor: '#fff',
				borderRadius:'50%',
				show: false,
				position: 'center',
				formatter: [
					'{value|￥{c}}',
					'{name|{b}}'
				].join('
'),
				rich: {
					value: {
    					color: '#303133',
    					fontSize: 35,
    					fontWeight: 'bold',
    					lineHeight: 40,
    				},
    				name: {
    					color: '#909399',
    					lineHeight: 20,
    					fontSize: 18
    				},
				},
			},
			emphasis: {
				show: true,
				textStyle: {
					fontSize: '16',
					fontWeight: 'bold'
				}
			}
		},
		data: data
	}]
}