Amcharts 继承字体或设置所有元素字体

Question

我已将页面 css 设置为：

html { 
    font-family: 'Not the Default AmCharts Font';
}

我没有在我的图表代码中指定字体，但是图表没有继承页面的 css 定义的字体。

有没有办法一次性为所有 Amcharts 元素全局设置字体？ 比如：

AmCharts.defaultFontFamily = 'Not the Default AmCharts Font';

我也很喜欢某种 jQuery 解决方案，例如：

$('.amcharts').find('*').css('font-family', 'Not the Default AmCharts Font');

这些解决方案都不起作用。

我真的希望这至少能影响以下方面： 图表标题 , 轴标题 , 轴标签 , 图形标签 , 气球文本 , 图例标签 , 图例值

Answer 1

由于 AmCharts 使用内联样式和属性，您可能需要使用 !important 来覆盖字体

.yourchartclass * {
  font-family: 'Impact' !important;
}

解决此问题的另一种方法是利用AmCharts.addInitHandler 方法创建一个全局init 侦听器，该侦听器在您想要的多种类型的图表上运行，并在初始化期间设置fontFamily 和其他属性。例如：

AmCharts.addInitHandler(function(chart) {
  chart.fontFamily = 'Oswald';
  chart.fontSize = 16;
});

您还可以指定一组图表类型来限制 initHandler 可以运行的内容。您还可以向图表对象添加自定义标志，并使用它们来确定要设置的设置，例如：

AmCharts.addInitHandler(function(chart) {
  if (chart.useLato) {
    chart.fontFamily = "Lato";
    chart.fontSize = 16;
  } else if (chart.useRoboto) {
    chart.fontFamily = "Roboto";
    chart.fontSize = 12;
  } else {
    chart.fontFamily = "Oswald";
    chart.fontSize = 12;
  }
});

这是demo 的实际操作。