Amcharts繼承字體或設置所有元素字體

我已經設置我的頁面的CSS：Amcharts繼承字體或設置所有元素字體

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');

這些解決方案都在工作。

我真的希望這影響至少包括以下：圖表標題，軸標題，軸標籤，圖形標籤，氣球文本，圖例標籤，圖例值

來源

2017-08-28 Nathan Clement

由於AmCharts使用內聯樣式和屬性，你可能需要使用!important覆蓋字體

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

另一種方式去了解這爲t o利用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。

來源

2017-08-28 21:26:59 xorspark

太棒了！我已經嘗試過'！important'的css覆蓋，但這並不起作用，但init處理程序非常完美。 –

奇怪的是，當我正在嘗試使用codepen時，「重要」工作。您還可以參考由圖表生成的[CSS類名稱]（http://www.amcharts.com/tutorials/css-class-names/）列表（您需要將'addClassNames'設置爲true）並且如果你喜歡通過CSS來直接設置文本元素的樣式，那就去那條路徑。 – xorspark

Amcharts繼承字體或設置所有元素字體

回答

相關問題