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(); 
 
         }); 
 
        }); 
 
       } 
 

 
      } 
 
     }