Использование chart.js для полярной диаграммы, Как создать каждое видимое значение для пользовательской ширины - PullRequest
Новая
       21

Использование chart.js для полярной диаграммы, Как создать каждое видимое значение для пользовательской ширины

0 голосов
/ 08 июня 2018

enter image description here

Выше приведено изображение моей полярной диаграммы, а ниже - код, который я использую. 

<div id="sale_process" style="height: 320px; width: auto;">
   <canvas id="sale_process_chart"></canvas>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script>
<script type="text/javascript">
$(window).on('load', function() {
    var data = {
      datasets: [{
        data: [ 
           100, 
            90, 
            80, 
            70, 
            60, 
            50 
         ],
        backgroundColor: [
           "#7ab5eb",
           "#444347",
           "#91eb7c",
           "#f7a15b",
           "#7e85e9",
           "#ed5d87"
          ],
        }],
        labels: [
         "40% Branding and Marketing ",
         "20% Gift Code Inventory",
         "18% Legal & Financial Over head",
         "10% IT Infrastructure",
         "8% Bounty & Overhead",
         "4% Management"
       ],
   };

   var ctx = $("#sale_process_chart");
   new Chart(ctx, {
     data: data,
     type: 'polarArea',
     options:{
        legend:{
            position:'right',
            labels: {
                boxWidth:8,
            },
        },
        scale: {
            display: false
        }
    },
});
</script>

Я хочу указать всю ширину какза их процент, например, синий цвет должен занимать 40% от диаграммы. Черный цвет должен занимать 20%, может кто-нибудь помочь мне в этом.Я не знаю, как создать кастом, я перебрал много ссылок, но не смог найти решение для этого.

...