Echarts在线免费图表

 
              const dataArray = [10, 231, -331, 156, 831, -400, 100]
option = {
    xAxis: {
      // show: false, // 不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
      axisTick: {
        show: false // 不显示坐标轴刻度线
      },
      // axisLine: {
      //   show: false // 不显示坐标轴线
      // },
      axisLabel: {
        show: false // 不显示坐标轴上的文字
      },
      splitLine: {
        show: false // 不显示网格线
      },
      type: 'category'
    },
    yAxis: {
      show: false,
      type: 'value'
    },
    series: [
      {
        // data: [10, 231, -331, 156, 831, -400, 100],
        type: 'bar',
        data: dataArray.map((item) => {
          return {
            value: item,
            label: {
              show: true,
              position: item > 0 ? 'top' : 'bottom',
              color: '#333',
              fontSize: '12px'
            }
          }
        }),
        itemStyle: {
          normal: {
            color: function (params) {
              console.log(params)
              if (params.value > 0) {
                return '#FA243B'
              } else {
                return '#00D176'
              }
            }
          }
        }
      }
    ]
};