2.饼图有颜色部分
series: [ // 数据
{
name: '访问来源',
type: 'pie',
radius: ['50%', '70%'], // 饼图有颜色部分
label: {
normal: {
formatter: '{b}'
}
},
3.自定义显示模块
series: [
{
type: 'pie',
radius: '65%',
center: ['50%', '50%'],
selectedMode: 'single',
data: [
{
value: 1548,
name: '幽州'
label: { // 自定义显示模块
formatter: [
4.文字标识部分
颜色的设置
https://blog.csdn.net/qiudechao1/article/details/97628338
position位置
https://blog.csdn.net/qq_34908167/article/details/78500921
文字省略
https://echarts.apache.org/zh/option.html#series-pie.label.formatter
文字始终在echarts内
https://segmentfault.com/q/1010000010939022
label: {
color: "#fff",
fontSize:14,
position: 'outer',
alignTo: 'edge',
margin: 10,
样式rich fontSize
https://blog.csdn.net/u010976347/article/details/81390107
rich: {
a: {
fontSize: 16,
fontWeight: 'normal',
color: '#fff'
}
},
textStyle: {
fontSize: 20,
fontWeight: 600
}
\n换行
series: [
{
name: '从业人员性别',
type: 'pie',
radius: ['50%', '70%'], // 饼图有颜色部分
label: {
normal: {
formatter: '{b}\n{d}',
textStyle: {
fontSize: 16,
color: '#fff'
}
}
},
position: ['320', '12'],
series: [
{
name: '访问来源',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: { // 文字提示部分
show: false,
position: 'center',
normal: {
formatter: '{b}%'
}
},
5.鼠标移入
emphasis: { // 鼠标移入
label: {
show: true
fontSize: '30',
fontWeight: 'bold'
}
},
6.文字标识移入中间显示
初始没有文字标识
label: { // 文字标识部分
show: false,
position: 'center'
// normal: {
// formatter: '{b}'
// }
},
7.工具栏
toolbox: {
show: true,
feature: {
mark: {show: true},
dataView: {show: true, readOnly: false},
magicType: {
show: true,
type: ['pie', 'funnel']
},
restore: {show: true},
saveAsImage: {show: true}
}
},
8.图的位置
series: [
{
name: '面积模式',
type: 'pie',
radius: [30, 110],
center: ['75%', '50%'], // 图的位置
roseType: 'area',
data: [
9.指示线长度
labelLine: { // 指示线
normal: {
length: 50
}
},
data: [
10.排序
yAxis: [{
type: 'category',
data: ['OPPO R9s', 'OPPO A57', 'OPPO A59s', 'OPPO R9m', 'OPPO A37m', 'vivo X9', 'OPPO A33', 'OPPO R11', 'OPPO A59m', 'vivo X7'],
inverse: true, // 排序
11.x轴、y轴
xAxis: [{ // x轴
yAxis: [{ // y轴
12.周围空白部分
grid: {
top: 1,
left: 20,
right: 0,
bottom: 1,
containLabel: true // 是否包含坐标
},
13.柱图宽度
14.轴线文字
https://blog.csdn.net/weixin_39090097/article/details/84230699
文字超出隐藏
https://www.imooc.com/article/68144
文字超出换行
https://blog.csdn.net/qq_34817440/article/details/101448194
倾斜
https://blog.csdn.net/xiongdaandxiaomi/article/details/84989059
坐标轴线颜色
https://blog.csdn.net/intelrain/article/details/82599647
axisLabel: { // label文字
15.legend
16.去掉刻度线
17.堆叠柱形图
// stack:"1", // 如果stack一样就会堆叠