不可能从雷达图(chart.js)中删除比例尺

问题描述 投票:3回答:1

我整天都在尝试删除图表js中雷达图的比例。尽管该图表工作正常,但似乎没有任何措施可以消除该比例。不幸的是,文档对于解决该问题并没有帮助。这是图形的样子。比例每次看起来都一样。从浏览器清除缓存也无济于事。enter image description here这是图表的代码:

function setChart(){

var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
                        type: 'radar',
                        data: {
                            labels: ['classA','classB','classC','classD'],
                            datasets: [{
                                label: 'revenue proportion per class',
                                data: [0.25, 0.3, 0.15, 0.3],
                                backgroundColor: [
                                    'rgba(255, 99, 132, 0.2)',

                                ],
                                borderColor: ['rgba(255, 99, 132, 0.2)'],

                                borderWidth: 5

                            },
                                {

                             label: 'proportion of item quantity per class',
                                data: [0.25, 0.3, 0.15, 0.3],
                                    backgroundColor: [

                                    'rgba(54, 162, 235, 0.2)',


                                ],
                                    borderColor: ['rgba(54, 162, 235, 0.2)'],
                                    borderWidth: 5
                                }
                            ],

和选项:

options: {
                                scale: {

                                    ticks:{ 
                                           label: false,
                                            min: 0,
                                            max: 1,
                                            fixedStepSize: 4,
                                            showLabelBackdrop: false,
                                            fontSize: 0,
                                            color: "#eee"
                                    }
                                }
options: {
                                scale: {

                                    ticks:{ 
                                           display: false
                                    }
                                }

我正在做一些愚蠢的事情?对此的任何帮助都将受到欢迎!

javascript chart.js
1个回答
0
投票

linear radial axis documentation列出了四个配置选项:

  • angleLines
  • gridLines
  • pointLabels
  • 滴答

其中每个都是支持display属性的对象。在所有四个对象中指定display: false会删除比例。

options: {
  scale: {
    angleLines: {
      display: false
    },
    gridLines: {
      display: false
    },
    pointLabels: {
      display: false
    },
    ticks: {
      display: false
    },
  }
}

这是一个工作示例:

new Chart('myChart', {
  type: 'radar',
  data: {
    labels: ['A', 'B', 'C', 'D'],
    datasets: [{
      label: 'Series 1',
      data: [0.25, 0.3, 0.15, 0.3],
    }]
  },
  options: {
    scale: {
      angleLines: {
        display: false
      },
      gridLines: {
        display: false
      },
      pointLabels: {
        display: false
      },
      ticks: {
        display: false
      },
    }
  }
});
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Chart.min.js"></script>
<canvas id="myChart"></canvas>
© www.soinside.com 2019 - 2024. All rights reserved.