zoukankan      html  css  js  c++  java
  • echarts 多条柱状图

    下面是配置项:

    barsOptions: {
            color: ["#ffdf25", "#36a9ce", "#d0e17d"],
            tooltip: {
              trigger: "axis",
              axisPointer: {
                type: "shadow",
              },
            },
            legend: {
              data: ["苯","甲苯","二甲苯","非甲烷总烃"],
              top: "0",
            },
            title: {
              text: "地市排放均值",
              left: "5%",
              top: "0%",
              textStyle: {
                fontSize: "14",
                color: "#000",
                fontStyle: "normal",
              },
            },
            grid: {
              left: "0%",
              right: "0%",
              bottom: "10%",
              top: "15%",
              containLabel: true,
            },
            calculable: true,
            xAxis: [
              {
                type: "category",
                axisTick: { show: false },
                data: [
                  "郑州",
                "开封",
                "洛阳",
                "安阳",
                "三门峡",
                "新乡",
                "许昌",
                "济源",
                "郑州",
                "开封",
                "洛阳",
                "安阳",
                "焦作",
                "新乡",
                "许昌",
                "驻马店",
                "焦作",
                "新乡",
                ],
              },
            ],
            yAxis: [
              {
                type: "value",
                name: "mg/m³",
                nameLocation: "end",
              },
            ],
            series: [
              {
                name: "苯",
                type: "bar",
                barGap: 0,
                data: [320, 332, 301, 334, 390, 360, 320, 332, 301, 334, 390, 360,289,390,20,389,290,389],
              },
              {
                name: "甲苯",
                type: "bar",
                data: [220, 182, 191, 234, 290,320,220, 182, 191, 234, 290,320,330,289,390,20,389,290,389],
              },
              {
                name: "二甲苯",
                type: "bar",
                data: [150, 232, 201, 154, 190,150,150, 232, 201, 154, 190,150,160,289,390,20,389,290,389],
              },
              {
                name: "非甲烷总烃",
                type: "bar",
                data: [110, 222, 201, 154, 190,150,150, 232, 201, 154, 120,150,760,289,390,20,389,290,389],
              },
            ],
          },

  • 相关阅读:
    枚举
    交房租
    Schtasks 命令详解
    记录自己在 cmd 中执行 jar 文件遇到的一些错误
    Java 8 日期时间 API
    Java 8 Optional 类
    Java 8 Stream
    Java 8 默认方法
    Java 8 函数式接口
    Java 8 方法引用
  • 原文地址:https://www.cnblogs.com/jervy/p/14357647.html
Copyright © 2011-2022 走看看