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



我已经将页面CSS设置为:

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

我尚未在图表代码中指定字体,但是图表没有继承页面的CSS定义字体。

是否有一种方法可以一口气为所有Amcharts元素设置字体吗?类似:

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

我也会对某种类型的解决方案感到满意:

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

这些解决方案都无法使用。

我真的希望这至少会影响以下内容:图表标题,轴标题,轴标签,图标签,气球文字,传奇标签,图例值

由于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;
  }
});

这是该行动中的演示。

最新更新