Question

我绘制了3D堆叠条形图，如下所示。

$scope.DrawFunction = function()
{
am4core.useTheme(am4themes_animated);
// Themes end

// Create chart instance
var chart = am4core.create("chartdiv", am4charts.XYChart3D);

// Add data
chart.data = [{
    "country": "USA",
    "year2017": 3.5,
    "year2018": 4.2
}, {
    "country": "UK",
    "year2017": 1.7,
    "year2018": 3.1
}];

// Create axes
var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
categoryAxis.dataFields.category = "country";
categoryAxis.renderer.grid.template.location = 0;
categoryAxis.renderer.minGridDistance = 30;

var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.title.text = "GDP growth rate";
valueAxis.renderer.labels.template.adapter.add("text", function(text) {
  return text + "%";
});

// Create series
var series = chart.series.push(new am4charts.ColumnSeries3D());
series.dataFields.valueY = "year2017";
series.dataFields.categoryX = "country";
series.name = "Year 2017";
series.clustered = false;
series.columns.template.tooltipText = "[white]GDP grow in {category} (2017): [bold]{valueY}[/]";
series.columns.template.fillOpacity = 0.9;

var series2 = chart.series.push(new am4charts.ColumnSeries3D());
series2.dataFields.valueY = "year2018";
series2.dataFields.categoryX = "country";
series2.name = "Year 2018";
series2.clustered = false;
series2.columns.template.tooltipText = "GDP grow in {category} (2017): [bold]{valueY}[/]";
}

图形正确生成。我想将所有标签的字体颜色和标题更改为另一种颜色。我设法更改了tootltip字母的字体颜色，但找不到改变其他字母的字体颜色的方法。我该怎么做？

Answer 1

据我了解，除非更改所选主题，否则无法更改整个图中显示的所有字母的字体颜色。因此，在我的场景中，由于我的背景色是黑色，因此我想将图表中的所有字体更改为白色。为此，我们需要导入另一个主题，而不是尝试更改字体颜色。您可以从以下链接下载深色主题

https://www.amcharts.com/lib/4/themes/dark.js

并按如下所示在脚本中导入库

<script src="https://www.amcharts.com/lib/4/themes/dark.js"></script>

接下来，连同animation.js主题一起，按如下所述调用深色主题

am4core.useTheme(am4themes_dark);
am4core.useTheme(am4themes_animated);

然后所有字体都会变成白色，网格线也会变成白色

更改标签的字体颜色和使用amcharts绘制的3D条形图的标题

1 个答案: