如何在 amcharts4 - 编程之家

如何解决如何在 amcharts4

我想更改分类轴标签文本样式，我在 amcharts4 中怎么做？下面是代码，

/**
 * --------------------------------------------------------
 * This demo was created using amCharts V4 preview release.
 *
 * V4 is the latest installement in amCharts data viz
 * library family,to be released in the first half of
 * 2018.
 *
 * For more information and documentation visit:
 * https://www.amcharts.com/docs/v4/
 * --------------------------------------------------------
 */

am4core.useTheme(am4themes_animated);
am4core.useTheme(am4themes_dataviz);

var chart = am4core.create("chartdiv",am4charts.XYChart);

chart.data = [
  {
    category: "One",value1: 1,value2: 5,value3: 3,value4: 3
  },{
    category: "Two",value1: 2,value4: 4
  },{
    category: "Three",value1: 3,value3: 4,{
    category: "Four",value1: 4,value3: 6,{
    category: "Five",{
    category: "Six",value1: 8,value2: 7,value3: 10,{
    category: "Seven",value1: 10,value2: 8,value4: 4
  }
];

chart.colors.step = 2;

var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
categoryAxis.datafields.category = "category";
// categoryAxis.renderer.grid.template.location = 0;
// categoryAxis.renderer.line.strokeOpacity = 1;
categoryAxis.renderer.minGriddistance = 30;
 categoryAxis.renderer.grid.template.disabled = true;
categoryAxis.renderer.labels.template.adapter.add("dy",function(dy,target) {
  if (target.dataItem && target.dataItem.index & 2 == 2) {
    return dy + 15;
  }
  return dy;
});
categoryAxis.title.text = "Numbers";

var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());  

var series1 = chart.series.push(new am4charts.ColumnSeries());
series1.columns.template.width = am4core.percent(70);
series1.columns.template.tooltipText = "{name}: {valueY.value}";
series1.name = "Series 1";
series1.datafields.categoryX = "category";
series1.datafields.valueY = "value1";
series1.columns.template.width = am4core.percent(30);

body {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

#chartdiv {
  width: 400px;
  height: 250px;
}

<script src="//www.amcharts.com/lib/4/core.js"></script>
<script src="//www.amcharts.com/lib/4/charts.js"></script>
<script src="//www.amcharts.com/lib/4/themes/animated.js"></script>
<script src="//www.amcharts.com/lib/4/themes/dataviz.js"></script>
<div id="chartdiv"></div>

这是相同的快照，

我想将文本“数字”调低一点并使其加粗，我该怎么做？

解决方法

对于轴标签（一、二、...）：

var axisLabels = categoryAxis.renderer.labels.template;
axisLabels.fontSize = 17;
axisLabels.fontWeight = "bold";
axisLabels.fontFamily = "Tahoma";
axisLabels.fill = "#ff0000"; // labels color

对于轴标题（数字）：

categoryAxis.title.fontWeight = "bold";
categoryAxis.title.fontSize = 20;
categoryAxis.title.fontFamily = "Helvetica";
categoryAxis.title.fill = "#ff0000";