我整天都在尝试删除图表js中雷达图的比例。尽管该图表工作正常,但似乎没有任何措施可以消除该比例。不幸的是,文档对于解决该问题并没有帮助。这是图形的样子。比例每次看起来都一样。从浏览器清除缓存也无济于事。这是图表的代码:
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
}
}
我正在做一些愚蠢的事情?对此的任何帮助都将受到欢迎!
linear radial axis documentation列出了四个配置选项:
其中每个都是支持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>