2020-01-03 12:42:42 版本 : echarts展示组件所有数据案例
作者: 陈婉 于 2020年01月03日 发布在分类 / 人防组 / 人防前端 下,并于 2020年01月03日 编辑
 历史版本

修改日期 修改人 备注
2020-01-07 08:42:55[当前版本] 陈婉 格式调整
2020-01-06 18:01:30 陈婉 格式调整
2020-01-03 12:42:42 陈婉 格式调整
2020-01-03 12:42:18 陈婉 创建版本

echarts展示组件所有数据案例

data1:{
                showLabel:true,
                data:[0.6, 0.5, 0.4, 0.3],
                color:["#0a69b6"],
                bgColor:"rgba(255,255,255,0)"
            },
dataList: [
        {//柱状图
          title: "分队人数统计",
          component: 'BarChart',
          isSelect: false,
          data: {
            interval: 50,
            gridData: {
              left: "40",
              right: "45",
              bottom: "25",
              top: "30",
            },
            xAxisName: '名称',
            yAxisName: '人数',
            xAxisData: ["分队1", "分队2", "分队3", "分队4", "分队5", "分队6", "分队7"],//x 轴
            yData: [220, 182, 191, 234, 290, 330, 310],//y轴数据
          }
        },
        {//柱状图2
          title: "专业分队统计",
          component: 'BarChart2',
          isSelect: false,
          data: {
            gridData: {
              top: "10",
              left: "30",
              right: "30",
              bottom: "3%",
              containLabel: true
            },
            // xAxisName: '名称',
            // yAxisName: '人数',
            xAxisData: ["风", "水", "电", "土建"],//x 轴
            seriesData: [220, 182, 191, 234],//y轴数据
          }
        },
        {//多柱状图
          title: "各工程的报警类型月均报警率",
          component: 'BarsChart',
          isSelect: false,
          data: {
            color: ["#f28758", "#d4787d", "#ae9eec", "#00d086", "#3eead0", "#3aacfb", "#fac201"],
            legendData: ["工程1", "工程2", "工程3", "工程4", "工程5", "工程6", "工程7"],
            interval: 50,
            gridData: {
              left: "3%",
              right: "4%",
              bottom: "10",
              top: "45",
              containLabel: true
            },
            yAxisData: "个",
            barWidth: "5%",
            xAxisData: ["设备级别", "系统级别", "工程级别"],
            seriesData: [
              {
                name: "工程1",
                data: [180, 215, 610]
              },
              {
                name: "工程2",
                data: [350, 420, 260]
              },
              {
                name: "工程3",
                data: [280, 57, 560]
              },
              {
                name: "工程4",
                data: [780, 650, 680]
              },
              {
                name: "工程5",
                data: [555, 580, 345]
              },
              {
                name: "工程6",
                data: [637, 753, 285]
              },
              {
                name: "工程7",
                data: [650, 580, 480]
              }
            ]
          }
        },
        {//圆环
          title: "按军衔统计人数",
          component: 'RingChart',
          isSelect: false,
          data: {
            text: 8000,
            subtext: '工程总人数范围',
            legendData: {
              top: "13%",
              right: "5%",
              data: ["将官", "士兵", "校官", "尉官"],
            },
            seriesData: {
              radius: ["62%", "72%"],
              center: ["50%", "40%"],
              color: ["#f66400", "#981dee", "#0078ff", "#2acb84"],
              rankData: [
                { value: 2392, name: "将官" },
                { value: 1922, name: "士兵" },
                { value: 1862, name: "校官" },
                { value: 3200, name: "尉官" }
              ]
            }
          }
        },
        {//横向柱状图
          title: "按职业资格证书统计人数",
          component: 'BarTransverseChart',
          isSelect: false,
          data: {
            xAxisData: [
              {
                isShow: true,
                name: "人数",
                type: "value",
                position: "bottom",
                data: null
              }
            ],
            gridData: {
              left: "5",
              right: "42",
              bottom: "30",
              top: "30",
              containLabel: true
            },
            yAxisData: [
              {
                name: "证书种类",
                type: "category",
                data: ["证书1", "证书2", "证书3", "证书4", "证书5", "证书6", "证书7"]
              }
            ],
            seriesData: [
              {
                barWidth: "16",
                color: ["#2bce9d", "#3fe9b5"],
                name: null,
                data: [22, 33, 44, 55, 66, 77, 88]
              }
            ],

          }
        },
        {//饼图
          title: "按学历统计人数",
          component: 'PieChart',
          isSelect: false,
          data: {
            titleData: [],
            legendData: {
              top: "13%",
              right: "5%",
              data: ["小学", "初中", "高中", "大学"]
            },
            seriesData: [
              {
                name: "学历",
                data: [
                  {
                    value: 45,
                    name: "小学"
                  },
                  {
                    value: 25,
                    name: "初中"
                  },
                  {
                    value: 15,
                    name: "高中"
                  },
                  {
                    value: 8,
                    name: "大学"
                  }
                ],
                center: ['50%', '45%'],
                radius: "68%"
              }
            ],
            color: ['#fea700', '#00fefe', '#705eca', '#29ee9d'],
          }
        },
        {//折线图
          title: "按政治面貌统计人数",
          component: 'PolygonalChart',
          isSelect: false,
          data: {
            xAxisName: '政治面貌',
            yAxisName: '人数',
            xAxisData: ["团员", "党员", "群众"],
            yData: [28, 12, 6, 28, 7, 6, 3],
          }
        },
        {//折线图2
          title: "能耗统计",
          component: 'PolygonalChart2',
          isSelect: false,
          data: {
            color: ["#3398DB"],
            xAxisData: [
              {
                name: "时",
                value: ["2", "4", "6", "8", "10", "12", "14", "16", "18", "20", "22", "24"]
              }
            ],
            yAxisData: ["kwh"],
            seriesData: [
              {
                name: "总电量",
                value: [246, 250, 160, 451, 455, 148, 243, 143, 156, 258, 160, 142]
              }
            ]
          }
        },
        {//柱状图+折线图
          title: "每年故障处理平均消耗时长",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            xAxisName: '年',
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["个", "时"],
            legendData: ["月故障数", "处理时长"],
            seriesData: [
              {
                name: '处理时长',
                type: 'line',
                color: ["#59ff8c", "#59ff8c"],
                data: [10, 5, 5, 25, 15, 18, 25, 18, 22, 20, 18, 12]
              },
              {
                name: '月故障数',
                type: 'bar',
                barWidth: 15,
                color: ["rgba(47, 151, 226, 0.4)", "rgb(47, 151, 226)"],
                data: [200, 382, 102, 267, 186, 315, 316, 289, 684, 892, 521, 892]
              }
            ],
          }
        },
        {//横向柱状图2
          title: "专业设备平均消耗备品备件TOP5",
          component: 'BarTransverseChart2',
          isSelect: true,
          data: {
            gridData: {
              top: "10",
              right: "30",
              left: "50",
              bottom: "20"
            },
            yDate1: ["设备1", "设备2", "设备3", "设备4", "设备5"],
            yDate2: [150, 134, 114, 183, 145],
            seriesData: [150, 134, 114, 183, 145],
          }
        },
        {//多柱状图+多折线图
          title: "按年统计故障来源次数以及处理结果",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: ["系统分配", "手动添加", "未接收", "已接收", "已完成"],
            xAxisData: ["2015", "2016", "2017", "2018", "2019"],
            yAxisData: ["故障来源(个)", "处理结果(个)"],
            seriesData: [
              {
                name: '系统分配',
                type: 'bar',
                color: ["#11eed6", "#31f2c9"],
                data: [50, 200, 100, 80, 180],
                barWidth: 15
              },
              {
                name: '手动添加',
                type: 'bar',
                color: ["#c4374b", "#c4374b"],
                data: [58, 126, 87, 45, 35],
                barWidth: 15
              },
              {
                name: '未接收',
                type: 'line',
                color: ["#f90", "#f90"],
                data: [15, 10, 22, 18, 24],
              },
              {
                name: '已接收',
                type: 'line',
                color: ["#447bf7", "#447bf7"],
                data: [8, 11.5, 13.2, 21.6, 9.8],
              },
              {
                name: '已完成',
                type: 'line',
                color: ["#59ff8c", "#59ff8c"],
                data: [18, 13.5, 11.2, 11.6, 2.8]
              },
            ]
          }
        },
        {//横向柱状图2
          title: "累计设备生命周期内平均故障次数Top5",
          component: 'BarTransverseChart2',
          isSelect: true,
          data: {
            gridData: {
              top: "10",
              right: "30",
              left: "50",
              bottom: "20"
            },
            yDate1: ["设备1", "设备2", "设备3", "设备4", "设备5"],
            yDate2: [150, 134, 114, 183, 145],
            seriesData: [150, 134, 114, 183, 145],
          }
        },
        {//多圆环
          title: "按(等级[一般、轻微、严重]、专业设备)故障占比统计",
          component: 'RingsChart',
          isSelect: true,
          data: {
            width: 250,
            height: 300,
            parentOption: {
              seriesData: {
                name: null,
                radius: ["50%", "70%"],
                color: ['#37a2da', '#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378ea']
              }
            },
            childOption: {
              seriesData: {
                name: null,
                radius: ["50%", "70%"],
                color: ['#37a2da', '#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378ea']
              }
            },
            dataArray: [
              { value: 1, name: "一般", id: "001", parentId: "0" },
              { value: 0, name: "通风", id: "001", parentId: "001" },
              { value: 0, name: "给排水", id: "002", parentId: "001" },
              { value: 0, name: "电气", id: "003", parentId: "001" },
              { value: 1, name: "消防", id: "004", parentId: "001" },
              { value: 0, name: "防护", id: "005", parentId: "001" },
              { value: 0, name: "土建", id: "006", parentId: "001" },
              { value: 2, name: "严重", id: "002", parentId: "0" },
              { value: 1, name: "通风", id: "001", parentId: "002" },
              { value: 0, name: "给排水", id: "002", parentId: "002" },
              { value: 0, name: "电气", id: "003", parentId: "002" },
              { value: 0, name: "消防", id: "004", parentId: "002" },
              { value: 0, name: "防护", id: "005", parentId: "002" },
              { value: 1, name: "土建", id: "006", parentId: "002" },
              { value: 0, name: "紧急", id: "003", parentId: "0" },
              { value: 0, name: "通风", id: "001", parentId: "003" },
              { value: 0, name: "给排水", id: "002", parentId: "003" },
              { value: 0, name: "电气", id: "003", parentId: "003" },
              { value: 0, name: "消防", id: "004", parentId: "003" },
              { value: 0, name: "防护", id: "005", parentId: "003" },
              { value: 0, name: "土建", id: "006", parentId: "003" },
            ]
          }
        },
        {//圆环2
          title: "按设备专业类型统计个数及所占比",
          component: 'RingChart2',
          isSelect: false,
          data: {
            scaleData: [
              {
                name: "专业类型1",
                value: 10
              },
              {
                name: "专业类型2",
                value: 10
              },
              {
                name: "专业类型3",
                value: 10
              },
              {
                name: "专业类型4",
                value: 10
              },
              {
                name: "专业类型5",
                value: 10
              },
              {
                name: "专业类型6",
                value: 10
              }
            ],
            seriesObjData: {
              radius: ["60%", "63%"],
              center: ["50%", "45%"],
            }

          }
        },
        {//横向柱状图3
          title: "重要设备使用时长和使用年限对比",
          component: 'BarTransverseChart',
          isSelect: false,
          data: {
            xAxisData: [
              {
                isShow: false,
              },
              {
                isShow: true,
                name: "年",
                type: "category",
                position: "bottom",
                data: [2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019]
              }
            ],
            yAxisData: [
              {
                name: "设备名称",
                type: "category",
                data: ["污水泵", "给水泵", "排风机", "油烟机", "空调2", "空调1"]
              }
            ],
            legendData: ["使用时长", "使用年限"],
            seriesData: [
              {
                barWidth: "35%",
                name: "使用时长",
                color: ["#9715e6", "#a815e6"],
                data: [2015, 333, 222, 541, 341, 133]
              },
              {
                barWidth: "35%",
                name: "使用年限",
                color: ["#f76400", "#f78800"],
                data: [120, 132, 101, 134, 90, 120]
              },
            ]
          }
        },
        {//多柱状图+多折线图2
          title: "时间总任务与来源统计",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            gridData: {
              top: "65",
              left: "20",
              right: "5",
              bottom: "40",
              containLabel: true
            },
            legendData: ["维护任务", "设备故障", "备品备件", "物资情况", "环境报警", "应急任务", "任务总数"],
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["数量(个)", "总数(个)"],
            // yAxisData: ["数量(个)", "总数(个)"],
            yAxisName: ["数量(个)", "总数(个)"],
            minInterval: 100,
            seriesData: [
              {
                name: "背景",
                type: "bar",
                color: null,
                hasBG: true,
                bgbarWidth: "70%",
                bgbarGap: "-75%",
                hasStack: false,
                color: ["rgba(47, 151, 226, 0)", "rgba(47, 151, 226, 0.4)"],
                data: [250, 250, 250, 250, 250, 250, 250, 250, 250, 250, 250, 250],
              },
              {
                name: "维护任务",
                type: "bar",
                color: ["#7900cd"],
                hasBG: false,
                hasStack: true,
                data: [15.6, 16.7, 15.6, 12.2, 2.6, 12.0, 16.4, 13.3, 15.6, 16.7, 15.6, 12.2]
              },
              {
                name: "设备故障",
                type: "bar",
                color: ["#4c4cff"],
                hasBG: false,
                hasStack: true,
                data: [18.7, 17.7, 17.6, 18.2, 18.7, 18.8, 16.0, 12.3, 18.7, 17.7, 15.6, 18.2],
              },
              {
                name: "备品备件",
                type: "bar",
                color: ["#5883ff"],
                hasBG: false,
                hasStack: true,
                data: [12.3, 11.5, 12.3, 10.2, 20.3, 23.4, 13.0, 16.5, 12.0, 15.2, 14.3, 15.5],
              },
              {
                name: "物资情况",
                type: "bar",
                color: ["#5fccff"],
                hasBG: false,
                hasStack: true,
                data: [12.3, 11.5, 12.3, 10.2, 20.3, 23.4, 13.0, 16.5, 12.0, 15.2, 14.3, 15.5],
              },
              {
                name: "环境报警",
                type: "bar",
                color: ["#5ffff6"],
                hasBG: false,
                hasStack: true,
                data: [12.3, 11.5, 12.3, 10.2, 20.3, 23.4, 13.0, 16.5, 12.0, 15.2, 14.3, 15.5],
              },
              {
                name: "应急任务",
                type: "bar",
                color: ["#5ffff6"],
                hasBG: false,
                hasStack: true,
                data: [12.3, 11.5, 12.3, 10.2, 20.3, 23.4, 13.0, 16.5, 12.0, 15.2, 14.3, 15.5],
              },
              {
                name: "任务总数",
                type: "line",
                color: ["#5ffff6"],
                hasBG: false,
                hasStack: false,
                data: [13.3, 14.5, 16.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 16.2, 13.3, 14.5],
              },
            ]
          }
        },
        {//多柱状图+多折线图3
          title: "任务分配情况统计",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: ["风专业队", "水专业队", "电专业队", "土建专业队", "平均处理时长"],
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["数量(个)", "时长(h)"],
            seriesData: [
              {
                name: '风专业队',
                type: 'bar',
                barWidth: 4,
                color: ["#11eed6", "#31f2c9"],
                data: [50, 200, 100, 80, 180, 230, 110, 90, 150, 140, 125, 168]
              },
              {
                name: '水专业队',
                type: 'bar',
                barWidth: 4,
                color: ["#c4374b", "#dd696b"],
                data: [58, 126, 87, 45, 35, 82, 98, 158, 99, 136, 163, 82]
              },
              {
                name: '电专业队',
                type: 'bar',
                barWidth: 4,
                color: ["#00afe9", "#00abeb"],
                data: [115, 110, 221, 181, 124, 157, 240, 189, 115, 185, 168, 128]
              },
              {
                name: '土建专业队',
                type: 'bar',
                barWidth: 4,
                color: ["#f90", "#f80"],
                data: [8, 11.5, 13.2, 21.6, 9.8, 3.5, 5.6, 7.5, 6.4, 6.2, 8.9, 10.2],
              },
              {
                name: '平均处理时长',
                type: 'line',
                barWidth: null,
                color: ["#59ff8c", "#59ff8c"],
                data: [8, 11.5, 13.2, 21.6, 9.8, 3.5, 5.6, 7.5, 6.4, 6.2, 8.9, 10.2],
              },
            ]
          }
        },
        {//多圆环2
          title: "任务来源与报警来源",
          component: 'RingsChart2',
          isSelect: true,
          data: {
            seriesData: [
              {
                name: "任务来源",
                data: [
                  {
                    value: 6,
                    name: "维护任务"
                  },
                  {
                    value: 5,
                    name: "设备故障"
                  },
                  {
                    value: 6,
                    name: "备品备件"
                  },
                  {
                    value: 5,
                    name: "物资情况"
                  },
                  {
                    value: 6,
                    name: "环境报警"
                  },
                  {
                    value: 5,
                    name: "应急任务"
                  }
                ]
              },
              {
                name: "报警来源",
                data: [
                  {
                    value: 15,
                    name: "误报"
                  },
                  {
                    value: 12,
                    name: "处理"
                  },
                  {
                    value: 8,
                    name: "厂商协助"
                  }
                ]
              }
            ]
          }
        },
        {//柱状图+折线图2
          title: "各专业人均处理任务统计",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: ["月故障数", "处理时长"],
            xAxisData: ["专业队1", "专业队2", "专业队3", "专业队4", "专业队5"],
            yAxisData: ["故障数(个)", "处理时长(h)"],
            seriesData: [
              {
                name: "处理时长",
                type: "line",
                color: ["#28ffb3", "#28ffb3"],
                barWidth: null,
                data: [10, 5, 5, 25, 15]
              },
              {
                name: "月故障数",
                type: "bar",
                color: ["#00edef", "#118ffb"],
                barWidth: 15,
                data: [200, 182, 102, 230, 186]
              },
              {
                name: "背景",
                type: "bar",
                color: null,
                hasBG: true,
                bgbarWidth: "40",
                bgbarGap: "-180%",
                color: ["rgba(47, 151, 226, 0)", "rgba(47, 151, 226, 0.4)"],
                data: [250, 250, 250, 250, 250]
              },
            ]
          }
        },
        {//多柱状图+多折线图3
          title: "每月应急事件统计",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: ["真实事件", "模拟演练", "已结束", "未开始", "进行中"],
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["应急数量", "处理数量"],
            seriesData: [
              {
                name: '真实事件',
                type: 'bar',
                barWidth: 20,
                hasStack: true,
                color: ["#7594ff", "#7594ff"],
                data: [25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3, 25.6, 76.7, 135.6, 162.2]
              },
              {
                name: '模拟演练',
                type: 'bar',
                barWidth: 20,
                hasStack: true,
                color: ["#ff779d", "#ff779d"],
                data: [28.7, 70.7, 75.6, 82.2, 48.7, 18.8, 6.0, 2.3, 28.7, 70.7, 75.6, 82.2]
              },
              {
                name: '已结束',
                type: 'line',
                barWidth: null,
                color: ["#f90", "#f80"],
                data: [3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2, 3.3, 4.5],
              },
              {
                name: '未开始',
                type: 'line',
                barWidth: null,
                color: ["#4bd17c", "#4bd17c"],
                data: [4.3, 5.5, 7.3, 11.2, 21.3, 24.4, 24.0, 17.5, 13.0, 7.2, 4.3, 5.5],
              },
              {
                name: '进行中',
                type: 'line',
                barWidth: null,
                color: ["#01f2e1", "#01f2e1"],
                data: [2.3, 3.5, 5.3, 9.2, 19.3, 22.4, 22.0, 15.5, 11.0, 5.2, 2.3, 3.5],
              },
              {
                name: "背景",
                type: "bar",
                color: null,
                hasBG: true,
                bgbarWidth: "60",
                bgbarGap: "-175%",
                hasStack: false,
                color: ["rgba(47, 151, 226, 0)", "rgba(47, 151, 226, 0.4)"],
                data: [250, 250, 250, 250, 250, 250, 250, 250, 250, 250, 250, 250],
              },
            ]
          }
        },
        {//饼图
          title: "每类应急事件平均发生事件所占比统计",
          component: 'PieChart',
          isSelect: false,
          data: {
            titleData: [
              {
                text: "系统检测(报警)",
                x: "20%",
                y: "5%"
              },
              {
                text: "模拟演练(计划)",
                x: "65%",
                y: "5%"
              }
            ],
            legendData: {
              top: "13%",
              right: "5%",
              data: []
            },
            // seriesName: '学历',
            seriesData: [
              {
                name: "系统检测(报警)",
                data: [
                  {
                    value: 456,
                    name: "消防"
                  },
                  {
                    value: 251,
                    name: "入侵"
                  },
                  {
                    value: 456,
                    name: "核生化"
                  },
                  {
                    value: 251,
                    name: "核电磁脉冲攻击"
                  },
                  {
                    value: 251,
                    name: "其他"
                  }
                ],
                center: ["25%", "50%"]
              },
              {
                name: "模拟演练(计划)",
                data: [
                  {
                    value: 456,
                    name: "口部损毁"
                  },
                  {
                    value: 251,
                    name: "航空航天侦查"
                  },
                  {
                    value: 456,
                    name: "敌特骚扰"
                  },

                  {
                    value: 251,
                    name: "其他"
                  }
                ],
                center: ["70%", "50%"]
              }
            ],
            color: ['#37a2da', '#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378ea']
          }
        },
        {//柱状图+折线图2
          title: "最近24小时用电趋势",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: [],
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["能耗(KW/h)", ""],
            seriesData: [
              {
                name: "能耗",
                type: "line",
                color: ["#f12628", "#f12628"],
                barWidth: null,
                data: [100, 160, 160, 260, 350, 250, 300, 200, 160, 190, 180, 80, 100, 160, 160, 260, 350, 250, 300, 200, 160, 190, 180, 80, 100, 160, 160, 260, 350, 250,]
              },
              {
                name: "背景",
                type: "bar",
                color: null,
                hasBG: true,
                bgbarWidth: "75%",
                bgbarGap: 0,
                color: ["rgba(241, 38, 40, 0)", "rgba(241, 38, 40, 0.1)"],
                data: ["500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500",]
              },
            ]
          }
        },
        {//柱状图+折线图2
          title: "昨日用电、昨日温度、昨日湿度趋势对比",
          component: 'BarPolygonaChart',
          isSelect: true,
          data: {
            legendData: ["昨日", "今日"],
            xAxisData: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
            yAxisData: ["能耗(KW/h)", ""],
            seriesData: [
              {
                name: "今日",
                type: "line",
                color: ["#f0b310", "#f0b310"],
                barWidth: null,
                data: [100, 160, 160, 260, 350, 250, 300, 200, 160, 190, 180, 80]
              },
              {
                name: "昨日",
                type: "line",
                color: ["#28e9ff", "#28e9ff"],
                barWidth: null,
                data: [140, 130, 110, 130, 210, 280, 180, 110, 200, 280, 220, 100]
              },
              {
                name: "背景",
                type: "bar",
                color: null,
                hasBG: true,
                bgbarWidth: "75%",
                bgbarGap: 0,
                color: ["rgba(43, 120, 247, 0)", "rgba(43, 120, 247, 0.1)"],
                data: ["500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500", "500",]
              },
            ]
          }
        },
        {//柱状图+折线图2
          title: "各工程的报警占比及各类型报警数目统计",
          component: 'BarPolygonaChart2',
          isSelect: true,
          data: {
            color: ["#f28758", "#d4787d", "#ae9eec", "#00d086", "#3eead0", "#3aacfb", "#fac201"],
            legendData: ["工程1", "工程2", "工程3", "工程4", "工程5", "工程6", "工程7"],
            gridData: {
              left: "30",
              right: "4%",
              bottom: "20",
              top: "40",
              containLabel: true
            },
            yAxisData: "个",
            xAxisData: ["设备故障", "环境异常", "备件阈值", "物资阈值", "消防", "入侵", "三防"],
            showSymbol: false,
            seriesData: [
              {
                name: "工程1",
                type: "line",
                data: [120, 132, 101, 134, 90, 230, 210],
              },
              {
                name: "工程2",
                type: "line",
                data: [220, 182, 191, 234, 290, 330, 310],
              },
              {
                name: "工程3",
                type: "line",
                data: [150, 232, 201, 154, 190, 330, 410],
              },
              {
                name: "工程4",
                type: "line",
                data: [320, 332, 301, 334, 390, 330, 320],
              },
              {
                name: "工程5",
                type: "line",
                data: [420, 332, 601, 534, 290, 330, 730],
              },
              {
                name: "工程6",
                type: "line",
                data: [720, 232, 401, 634, 290, 330, 320],
              },
              {
                name: "工程7",
                type: "line",
                data: [620, 532, 501, 634, 490, 330, 520]
              },
            ]
          }
        },
        {
          title: "任务状态",
          component: 'RingChart3',
          isSelect: false,
          data: {
            intervalvValue: 1.4, // 两曲线环间距
            scaleData: [
              {
                name: "待接收",
                value: 20
              },
              {
                name: "已完成",
                value: 15
              },
              {
                name: "处理中",
                value: 10
              }
            ],
            colorData: [["#01c0e0", "#00a8ec"], ["#70fbaf", "#547be2"], ["#726ef5", "#726ef5"], ["#726ef5", "#726ef5"]],
            titleDta: {
              text: "任务状态",
              x: "45%",
            },
            legendData: {
              data: ["待接收", "已完成", "处理中"]
            },
            seriesData: {
              radius: ["62%", "65%"],
              center: ["50%", "50%"]
            }
          }
        },
        {//横向柱状图3
          title: "各工程报警率",
          component: 'BarTransverseChart3',
          isSelect: false,
          data: {
            myColor: ["#f28758", "#d4787d", "#ae9eec", "#00d086", "#3eead0", "#3aacfb", "#fac201"],
            gridData: {
              left: "20",
              right: "20",
              bottom: "0",
              top: "0",
              containLabel: true
            },
            yAxisData: [
              {
                axisLabel: {
                  color: "#fff",
                  rich: {
                    lg: {
                      backgroundColor: "#339911",
                      color: "#fff",
                      padding: 5,
                      align: "center",
                      width: 15,
                      height: 15
                    }
                  }
                },
                name: null,
                data: ["工程1", "工程2", "工程3", "工程4", "工程5", "工程6", "工程7"]
              },
              {
                axisLabel: {
                  textStyle: {
                    fontSize: 12,
                    color: "#fff"
                  }
                },
                data: ["110", "98", "100", "99", "80", "110", "98"]
              }
            ],
            seriesData: [
              {
                barWidth: "30%",
                name: null,
                data: [110, 98, 100, 99, 80, 110, 98]
              },
            ]
          }
        },
        {
          title: "各工程的报警占比及各类型报警数目统计",
          component: 'PieChart2',
          isSelect: false,
          data: {
            myColor: ["#f28758", "#d4787d", "#ae9eec", "#00d086", "#3eead0", "#3aacfb", "#fac201"],
            titleData: {
              text: '总工程数量',
              subtext: 80,
              x: '50%',
              y: '35%',
            },
            seriesData: [
              {
                center: ['50%', '40%'],
                radius: ['40%', '71%'],
                data: [
                  {
                    name: "工程1",
                    value: 10
                  },
                  {
                    name: "工程2",
                    value: 10
                  },
                  {
                    name: "工程3",
                    value: 10
                  },
                  {
                    name: "工程4",
                    value: 10
                  },
                  {
                    name: "工程5",
                    value: 10
                  },
                  {
                    name: "工程6",
                    value: 20
                  },
                  {
                    name: "工程7",
                    value: 30
                  }
                ]
              },
              {
                radius: ['40%', '44%'],
                center: ['50%', '40%'],
              },
              {
                radius: ['75%', '75%'],
                center: ['50%', '40%'],
              }
            ]
          }
        },
        {
          title: "各工程各类型应急事件及所占比",
          component: 'PiePolygonaChart',
          isSelect: false,
          data: {
            yAxisData: "数量",
            myColor: ["#f28758", "#d4787d", "#ae9eec", "#00d086", "#3eead0", "#3aacfb", "#fac201"],
            dataset: [
              ['类型', '消防', '入侵', '核生化', '核电磁脉冲攻击', '敌特袭扰', '其他'],
              ['工程1', 41.1, 30.4, 65.1, 53.3, 83.8, 98.7],
              ['工程2', 86.5, 92.1, 85.7, 83.1, 73.4, 55.1],
              ['工程3', 24.1, 67.2, 79.5, 86.4, 65.2, 82.5],
              ['工程4', 55.2, 67.1, 69.2, 72.4, 53.9, 39.1]
            ]
          }
        },
        {
          title: "油位",
          component: 'BarChart3',
          isSelect: false,
          data: {
            gridData: {
              top: '10%',
              left: '5%',
              right: '5%',
              bottom: '80',
            },
            xAxisData:['油位1.5m\n保障时间15h', '油位1.5m\n保障时间15h', '油位1.5m\n保障时间15h'],
            seriesData:[49, 80, 67]
          }
        },
      ],
历史版本-目录  [回到顶端]
    知识分享平台 -V 4.8.7 -wcp