自学内容网 自学内容网

ehcarts进度

 

let value = [75.6];
option = {
  grid: {
    top:"48",
      bottom:"56",
  },
      backgroundColor: '#101129',
  xAxis: {
    show: false,
    type: "value",
    boundaryGap: [0, 0],
    max:100
  },
  yAxis: {
    type: 'category',
    axisTick: 'none',
    axisLine: 'none',
    show: true,
    position:"right",
    // axisLabel: {
    //   padding:[-5,-30,0,0],
    //   // align:"right",
    //   // verticalAlign:"top",
    //   textStyle: {
    //     color: '#397EF0',
    //     fontSize: '14',
    //     fontFamily:"Source Han Sans CN-Regular"
    //   },
  //   formatter: '{value}%'
    // },
    data:value
  },
  series: [
    {
      data: value,
      type: 'bar',
      barWidth:14,
      showBackground:true,
      backgroundStyle:{
        borderRadius: 50,
        color:"rgba(131, 130, 181, 0.5)"
      },
        label:{
                show:true,
                position:'right',
                distance: 0,
                formatter:'{Right|{@[0]}%}',
                rich: {
                  Right: {
                  color: '#FFF',
                   align: 'center' ,
                  width: 10,     
                  fontSize: '18',// 3  
                  // verticalAlign:'middle'
                   verticalAlign: "bottom",
                  lineHeight: 72 ,
                 
                  },
                 
                }
            },
      itemStyle:{
         // barBorderRadius: [100, 100, 100, 100],
        color:{
          x: 1,
          y: 0,
          x2: 0,
          y2: 0,
          colorStops: [{
            offset: 0,
            color: 'rgba(95, 242, 253, 1)' // 0% 处的颜色
          }, {
            offset: 1,
            color: 'rgba(76, 176, 255, 1)' // 100% 处的颜色
          }],
        },
      //   color:'#61A5FF',
        borderRadius: 50,
      },
    },{
      name: '圆',
      type: 'scatter',
      data: value,
      label:"none",
      symbolSize: 20,
   
      itemStyle: {
          normal: {
                shadowBlur: 4,
                shadowColor: 'rgba(95, 241, 253, 1)',
                 color:"rgba(95, 241, 253, 1)",
                  
            },
      //   borderColor: 'rgba(95, 241, 253, 0.8)',
      //   borderWidth:14,
        // color: {
        //   x: 1,
        //   y: 0,
        //   x2: 0,
        //   y2: 0,
        //   colorStops: [{
        //     offset: 0,
        //     color: '#2AB0FF' // 0% 处的颜色
        //   }, {
        //     offset: 1,
        //     color: '#494CF3' // 100% 处的颜色
        //   }],
        // },
        
      
      //   color:"rgba(95, 241, 253, 1)",
      //   opacity: 1,
      },
      z: 2
  }
  ]
};


原文地址:https://blog.csdn.net/weixin_42120669/article/details/144748594

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!