chart.js：设置垂直标签方向

Question

我需要在图表条上设置垂直值，

实际上，我可以设置水平值，但那不是我想要的结果。

IM使用此代码来设置酒吧顶部值：那给我这个

animation: { 
         duration: 1, 
         onComplete: function() { 

          if(byDetails){ 

           var chartInstance = this.chart, 
             ctx = chartInstance.ctx; 
           ctx.font = Chart.helpers.fontString(Chart.defaults.global.defaultFontSize, Chart.defaults.global.defaultFontStyle, Chart.defaults.global.defaultFontFamily); 
           ctx.textAlign = 'center'; 
           ctx.textBaseline = 'bottom'; 

           this.data.datasets.forEach(function (dataset, i) { 
            var meta = chartInstance.controller.getDatasetMeta(i); 
            meta.data.forEach(function (bar, index) { 

             ctx.fillStyle = 'black'; 
             dataset.data[index] = parseFloat(dataset.data[index]).toFixed(2); 
             var data = dataset.data[index]; 

             if (withPersent) { 
              data = dataset.data[index] + "%"; 
             } 


             var random = Math.floor(Math.random() * 16) + 5; 
             ctx.fillText(data, bar._model.x, bar._model.y - random); 


            }); 
           }); 
          } 

         } 
        } 

：

如你看到的棒顶部的值是水平的，但我需要改变取向是这样的：

PS：即时通讯使用这样的图表：

var ctx = document.getElementById(chartDiv); 
var myChart = new Chart(ctx, {type: 'bar',........});  

任何人有一个想法haw做到这一点？

Answer 1

也许你找到了你的问题的答案。 我的代码：

animation: { 
 
      duration: 1, 
 
      onComplete: function() { 
 

 
       if (byDetails) { 
 

 
        var chartInstance = this.chart, 
 
         ctx = chartInstance.ctx; 
 
        ctx.font = Chart.helpers.fontString(Chart.defaults.global.defaultFontSize, Chart.defaults.global.defaultFontStyle, Chart.defaults.global.defaultFontFamily); 
 
        ctx.textBaseline = 'bottom'; 
 

 
        this.data.datasets.forEach(function (dataset, i) { 
 
         var meta = chartInstance.controller.getDatasetMeta(i); 
 
         meta.data.forEach(function (bar, index) { 
 

 
          ctx.fillStyle = 'black'; 
 
          dataset.data[index] = parseFloat(dataset.data[index]).toFixed(2); 
 
          var data = dataset.data[index]; 
 

 
          if (withPersent) { 
 
           data = dataset.data[index] + "%"; 
 
          } 
 

 
          ctx.save(); 
 
          var random = Math.floor(Math.random() * 16) + 5; 
 
          ctx.translate(bar._model.x, bar._model.y - random); 
 
          ctx.rotate(-0.5 * Math.PI); 
 
          ctx.fillText(data, 0, 0); 
 
          ctx.restore(); 
 
         }); 
 
        }); 
 
       } 
 

 
      } 
 
     }