echarts图表集
var dataValue = [{name:'今日待分配方量',value:49}, {name:'今日已分配方量',value:602}, {name:'今日完成方量',value:1037}]
var piedata1 = [{
name: '1#拌和机',
value: 20
},
{
name: '2#拌和机',
value: 22
},
{
name: '3#拌和机 ',
value: 17
},
{
name: '4#拌和机',
value: 18
},
{
name: '5#拌和机',
value: 10
},
{
name: '6#拌和机',
value: 13
},
{
name: '7#拌和机',
value: 12
},
{
name: '8#拌和机',
value: 17
}
]
var piedata2 = [{
name: '1#拌和机',
value: 20
},
{
name: '2#拌和机',
value: 22
},
{
name: '3#拌和机 ',
value: 17
},
{
name: '4#拌和机',
value: 19
},
{
name: '5#拌和机',
value: 10
},
{
name: '6#拌和机',
value: 20
},
{
name: '7#拌和机',
value: 13
},
{
name: '8#拌和机',
value: 16
}
]
var piedata3 = [{
name: '1#拌和机',
value: 13
},
{
name: '2#拌和机',
value: 12
},
{
name: '3#拌和机 ',
value: 17
},
{
name: '4#拌和机',
value: 18
},
{
name: '5#拌和机',
value: 10
},
{
name: '6#拌和机',
value: 10
},
{
name: '7#拌和机',
value: 13
},
{
name: '8#拌和机',
value: 15
}
]
option = {
backgroundColor: '#0C1E49',
color: ['#5E92F7', '#8BF4C8', '#F5E46C', '#E9A252','#EB95F7', '#C4FC5E', '#E68582', '#9A6FF6', '#b23aee', '#50b332'],
legend: {
show: true,
width: '80%',
top:"5%",
textStyle: {
inside: true,
color: "#9FC3E7",
padding: [14, 0, 10, 0],
align: "left",
verticalAlign: "center",
fontSize: 14,
rich: {},
},
// icon: "rect",
itemGap: 10,
itemWidth: 12,
itemHeight: 12,
// bottom: '15%'
},
// legend: {
// type: "scroll",
// orient: 'vertical',
// left: '65%',
// align: 'left',
// top: 'middle',
// textStyle: {
// color: '#8C8C8C'
// },
// },
tooltip: {},
// grid: [{
// bottom: '55%',
// top: '15%',
// left: '15%',
// right: '5%',
// }],
series: [
{
name: '今日待分配方量',
type: 'pie',
radius: ['40%', '60%'],
// center: ['50%', '50%'],
data: piedata1,
bottom: '0%',
top: '7%',
left: '0%',
right: '65%',
label: {
show: false
},
labelLine: {
show: false
},
},
{
type: "gauge",
zlevel: 1,
// z: 198,
splitNumber: 0,
radius: "39%",
center: ['18%', '55%'],
// startAngle: 190,
endAngle: -269.9999,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
length: 6,
lineStyle: {
width: 3,
color: "rgba(108,173,202,1)",
},
},
data: [
{
value: dataValue[0].value,
name: dataValue[0].name,
title: {
// 配置“家居总数”的样式
show: true,
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily65W,
color: "#BADBFB",
offsetCenter: [0, "100%"],
},
},
],
detail: {
// 调节数字位置
offsetCenter: [-2, -17],
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily95W,
color: "#fff",
},
pointer: {
show: false,
},
// detail: {
// show: 0,
// },
},
{
name: '今日已分配方量',
type: 'pie',
radius: ['40%', '60%'],
//center: ['50%', '50%'],
data: piedata2,
bottom: '0%',
top: '7%',
left: '33%',
right: '32%',
label: {
show: false
},
labelLine: {
show: false
},
},
{
type: "gauge",
zlevel: 1,
// z: 198,
splitNumber: 0,
radius: "39%",
center: ['51%', '55%'],
// startAngle: 190,
// endAngle: -269.9999,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
length: 6,
lineStyle: {
width: 3,
color: "rgba(108,173,202,1)",
},
},
data: [
{
value: dataValue[1].value,
name: dataValue[1].name,
title: {
// 配置“家居总数”的样式
show: true,
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily65W,
color: "#BADBFB",
offsetCenter: [0, "100%"],
},
},
],
detail: {
// 调节数字位置
offsetCenter: [-2, -17],
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily95W,
color: "#fff",
},
pointer: {
show: false,
},
// detail: {
// show: 0,
// },
},
{
name: '今日完成方量',
type: 'pie',
radius: ['40%', '60%'],
//center: ['50%', '50%'],
data: piedata3,
bottom: '0%',
top: '7%',
left: '65%',
right: '0%',
label: {
show: false
},
labelLine: {
show: false
},
},
{
type: "gauge",
zlevel: 1,
// z: 198,
splitNumber: 0,
radius: "39%",
center: ['83%', '55%'],
// startAngle: 190,
// endAngle: -269.9999,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
length: 6,
lineStyle: {
width: 3,
color: "rgba(108,173,202,1)",
},
},
data: [
{
value: dataValue[2].value,
name: dataValue[2].name,
title: {
// 配置“家居总数”的样式
show: true,
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily65W,
color: "#BADBFB",
offsetCenter: [0, "100%"],
},
},
],
detail: {
// 调节数字位置
offsetCenter: [-2, -17],
fontSize: 25,
fontWeight: 700,
// fontFamily: fontFamily.fontFamily95W,
color: "#fff",
},
pointer: {
show: false,
},
// detail: {
// show: 0,
// },
},
]
};
