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

  • 相关阅读:
    jquery $.fn $.fx 的意思以及使用
    jQuery树形控件zTree使用
    myeclipse9.0安装svn插件
    读取properties和xml中配置文件的值
    Jquery之ShowLoading遮罩组件
    程序员需谨记的8条团队开发原则(转)
    决策树算法
    第N个丑数
    数组反转
    倒数第K个结点
  • 原文地址:https://www.cnblogs.com/jervy/p/14357647.html
Copyright © 2011-2022 走看看