let dataValue1=['香蕉', 8], ['猕猴桃', 3], ['桃子', 1], ['橘子', 6], ['苹果', 8], ['梨', 4], ['柑橘', 4], ['橙子', 1], ['葡萄', 1]
let option = {
chart: {
type: 'pie',
options3d: {
enabled: true,
alpha: 60,
beta: 0
},
backgroundColor: 'none'
},
title: {
floating: true,
verticalAlign: 'middle',
x: -50,
useHTML: true,
text: ''
},
tooltip: {
pointFormat: '{point.percentage:.1f}%',
style: {
textOutline: "0px 0px contrast",
fontSize: 14,
color: "#000",
fontFamily: "SourceHanSansCN-Normal"
}
},
legend: {
enabled: true,
layout: 'vertical',
verticalAlign: 'middle',
align: 'right',
useHTML: true,
itemStyle: {
color: "#fff",
fontWeight: 'normal',
fontFamily: '宋体'
},
},
colors: ['#76F3A5', '#0080F8', '#1B51FF', '#2A00FF', '#518DDF', '#FFD074', '#FFD75B', '#FF5168'],
credits: {
enabled: false //禁用版权url 此处不设置,会显示highecharts.com
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
// size: 240,
depth: 25, //饼图厚度
color: 'red',
center: ['50%', '55%'],
showInLegend: true
}
},
series: [{
type: 'pie',
name: '',
startAngle: 0, //调整饼图的角度 方向:顺时针
dataLabels: {
enabled: true,
inside: false,
distance: '10%',
// format : '{point.name}{series.name}<br><span style="color:#FF8040">{point.y} </span>% ' ,
useHTML: true,
},
data: dataValue1
}]
};
$('#zuozhongpie').highcharts(option);
highcharts绘制3d饼状图
最新推荐文章于 2024-08-04 22:57:15 发布