echart配置彙總

重新加載動畫

itemChart4.clear();
itemChart4.setOption(itemoption1);

 

      var mychart = echarts.init(document.getElementById('center-top-chart'));
      var option = {
        title: {
          text: ''
        },
        tooltip: {},
        legend: {
          data: []
        },
        grid: {
          top: "3%",
          left: "4%",
          right: "4%",
          bottom: 60,
        },
        xAxis: {
          data: ["00:00", "01:00", "02:00", "03:00"],
          "axisTick": {       //x軸刻度線
            "show": false
          },
          axisLine: {
            lineStyle: {
              color: '#C4C6CF', // 顏色
              width: 1 // 粗細
            },
          },
          axisLabel: {
            textStyle: {
              color: '#000',  //更改座標軸文字顏色
              fontSize: 12      //更改座標軸文字大小
            }
          }
        },
        yAxis: {
          "axisLine": {  // y軸
            "show": false
          },
          "axisTick": {       //y軸刻度線
            "show": false
          },
          splitLine: {  // y軸網格線
            show: true,
            lineStyle: {
              color: ['#EBECF0'],
              width: 1,
              type: 'solid'
            }
          }
        },
        series: [{
          name: '銷量',
          type: 'bar',
          data: [5, 20, 36, 10, 10, 20],
          stack: '總量',
          itemStyle: {
            normal: {
              color: yellow,      // 拐點顏色
              // borderColor: green,  // 拐點邊框顏色
            }
          },
        }, {
          name: '銷量2',
          type: 'bar',
          data: [5, 20, 36, 10, 10, 20],
          stack: '總量',
          itemStyle: {
            normal: {
              color: '#F7F8FA',      // 拐點顏色
              // borderColor: green,  // 拐點邊框顏色
            }
          },
        }]
      };
      mychart .setOption(option);