amCharts: 如何在图表标题中设置字体族？

Question

这是如何在amCharts中定义标题的方法：

您可以使用以下代码：

"titles": [{
    "text": "My Chart Title"
}, {
    "text": "My Chart Title  222",
    "bold": false
}]

然而，由于标题类不支持定义字体系列（如Arial），所以我无法定义字体系列。有什么想法可以实现这一点吗？

- ps0604

Answer 1

首先需要确定正确的标题。
为此，您需要在配置中添加addClassNames。

var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "addClassNames": true,
    "theme": "none"
});

接下来，您需要为标题设置一个id。 AmCharts将在DOM元素上创建一个包含指定id的附加类。

"titles": [{
        "text": "My Chart Title",
        "id": "main"
 }]

生成的类名：amcharts-title-main

现在你需要做的就是，每当使用jQuery绘制图表时更改字体族：

$(".amcharts-title-main").css("font-family", "Arial");

演示可见此处。

- gerric

Answer 2

补充评论：@gerric 为了在4版本中添加类，您需要：

import * as am4core from '@amcharts/amcharts4/core'
...
am4core.options.autoSetClassName = true

https://www.amcharts.com/docs/v4/reference/options/ https://www.amcharts.com/docs/v4/tutorials/chart-element-class-names-and-css/

标题将按照模板生成类名：${classNamePrefix}${id} P.S. 默认情况下，classNamePrefix 为 'amcharts-'。

- Дмитрий Сальников