echarts多个环形图

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,
            // },
        },
        ]
};