当前位置:网站首页>Highcharts sets the histogram width, gradient, fillet, and data above the column

Highcharts sets the histogram width, gradient, fillet, and data above the column

2022-06-11 19:12:00 hyduan200

highcharts Official website : link

Realization effect

 Insert picture description here

Implementation code

plotOptions: {
    
   series: {
    
     //  The gradient 
     color: {
    //  Be careful !!! If it is a histogram, please use color, For area drawings, please use fillColor
       linearGradient: {
    
         x1: 0,
         y1: 0,
         x2: 0,
         y2: 1
       },
       stops: [
         [0, '#49bdff'],
         [0.2, '#3B5BDF'],
         [0.8, '#303642'],
         [1, '#303642']
     }
   }
   //  Round corners 
   borderRadius: 4
 }
 column: {
    
    cursor: 'pointer',
    pointPadding: 0.2,
    borderWidth: 0,
    //pointWidth: 30,
    maxPointWidth: 100 //  Set the maximum width 
    dataLabels:{
     // Histogram data label 
       enabled:true,       // Whether to display data labels  
       color:'#49bdff',        // Data label font color  
       formatter: function() {
            // Format output display  
          return (this.y) + %;    
       },  
    }
  }
}
原网站

版权声明
本文为[hyduan200]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/162/202206111904103335.html