【问题标题】:Chart.js different scaleLine color of radar chart (angular)Chart.js 雷达图的不同 scaleLine 颜色(角度)
【发布时间】:2018-08-28 11:22:12
【问题描述】:

目前我在我的 Angular 项目中使用雷达图 (chart.js)。我想改变不同部分的 scaleLineColor 不知道如何实现这个结果:

根据这个新的修复它应该是可能的: https://github.com/chartjs/Chart.js/pull/2732

我也试过这个:Chart.js (Radar Chart) different scaleLineColor for each scaleLine

但完全没有效果;((我认为是因为它是用旧版本编写的)

【问题讨论】:

    标签: angular chart.js styling radar-chart


    【解决方案1】:

    gridlines color 属性设置为您要使用的颜色数组(强调我的):

    网格线的颜色。 如果指定为数组,则第一种颜色适用于第一条网格线,第二种颜色适用于第二条网格线,依此类推。

    示例:

    var chart1 = new Chart(document.getElementById('chart'), {
      type: 'radar',
      data: {
        labels: ['a', 'b', 'c', 'd', 'e', 'f', 'g'],
        datasets: [{
          label: 'series1',
          data: [1, 2, 3, 6, 3, 2, 4]
        }]
      },
      options: {
        scale: {
          gridLines: {
            color: ['black', 'red', 'orange', 'yellow', 'green', 'blue', 'indigo']
          }
        }
      }
    });
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>
    <canvas id="chart"></canvas>

    【讨论】:

    最近更新 更多