Echarts在线免费图表

 
            option = {
        //鼠标滑过提示栏
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "shadow",
          },
        },
        //图表选择栏
        legend: {
          // icon: "square",
          // top: 20,
          bottom: "2%",
          itemHeight: 8, //修改icon图形大小
          textStyle: {
            fontSize: 13,
            color: "#000",
          },
          data: [
            {
              name: "完成数",
              icon: "square",
            },
            {
              name: "完成率",
            },
          ],
        },
        //图标离容器的距离
        // grid: {
        //   left: "3%",
        //   right: "4%",
        //   bottom: "3%",
        //   //是否包含坐标轴
        //   containLabel: true,
        //   //鼠标滑过是否显示信息栏，目前来看最好在grid中配置tooltip鼠标滑过信息栏
        // },
        //x坐标轴
        xAxis: [
          {
            type: "category",
            data: [
              "合肥",
              "马鞍山",
              "芜湖",
              "安庆",
              "淮南",
              "宣城",
              "阜阳",
              "铜陵",
              "蚌埠",
              "滁州",
              "六安",
              "淮北",
              "宿州",
              "池州",
              "黄山",
              "亳州",
            ],
          },
        ],
        //y坐标轴
        yAxis: [
          {
            type: "value",
          },
          {
            type: "value",
            position: "right",
            axisLabel: {
              formatter: "{value}%",
            },
          },
        ],
        // 数据展示区域
        series: [
          {
            name: "完成数",
            type: "bar",
            color: "#6395f9",
            barWidth: 18,
            data: [
              50, 35, 23, 45, 33, 78, 22, 43, 12, 23, 13, 23, 74, 46, 12, 9,
            ],
          },
          {
            name: "完成率",
            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
            type: "line",
            color: "#5fd8a8",
            data: [
              99, 67, 87, 88, 56, 76, 58, 72, 67, 45, 63, 86, 45, 69, 65, 92,
            ],
          },
        ],
      };