在amCharts雷达图中,可以使用valueAxes属性来定义值轴。要将两个值轴的起始半径设置为50%,可以按照以下步骤进行:
var chart = am4core.create("chartdiv", am4charts.RadarChart);
var valueAxis1 = chart.yAxes.push(new am4charts.ValueAxis());
var valueAxis2 = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis1.renderer.axisFills.template.fillOpacity = 0.1;
valueAxis1.renderer.axisFills.template.fill = chart.colors.getIndex(0);
valueAxis1.renderer.grid.template.strokeOpacity = 0.5;
valueAxis1.renderer.labels.template.fill = am4core.color("#000000");
valueAxis1.min = 0;
valueAxis1.max = 100;
valueAxis1.strictMinMax = true;
valueAxis1.renderer.labels.template.adapter.add("text", function(text) {
return text + "%";
});
valueAxis2.renderer.axisFills.template.fillOpacity = 0.1;
valueAxis2.renderer.axisFills.template.fill = chart.colors.getIndex(1);
valueAxis2.renderer.grid.template.strokeOpacity = 0.5;
valueAxis2.renderer.labels.template.fill = am4core.color("#000000");
valueAxis2.min = 0;
valueAxis2.max = 100;
valueAxis2.strictMinMax = true;
valueAxis2.renderer.labels.template.adapter.add("text", function(text) {
return text + "%";
});
在上面的代码中,我们首先设置了值轴的样式,然后设置了最小值和最大值为0和100,分别对应50%的起始半径。
chart.data = [{
"category": "Category 1",
"value1": 80,
"value2": 50
}, {
"category": "Category 2",
"value1": 50,
"value2": 70
}, {
"category": "Category 3",
"value1": 60,
"value2": 40
}];
var series1 = chart.series.push(new am4charts.RadarSeries());
series1.dataFields.valueY = "value1";
series1.dataFields.categoryX = "category";
series1.name = "Value 1";
series1.strokeWidth = 3;
var series2 = chart.series.push(new am4charts.RadarSeries());
series2.dataFields.valueY = "value2";
series2.dataFields.categoryX = "category";
series2.name = "Value 2";
series2.strokeWidth = 3;
chart.cursor = new am4charts.RadarCursor();
在上面的代码中,我们创建了两个雷达系列(series),分别绑定了值轴的值和类别字段,然后将它们添加到雷达图中。最后,添加了一个雷达光标(cursor)以提供交互功能。
以上就是使用amCharts库在雷达图中将两个值轴的起始半径设置为50%的解决方法。你可以根据自己的需求进行修改和扩展。