Highcharts使用css類將自定義樣式應用於上下文按鈕

Question

我有一大堆Highcharts圖形，它們都使用exports.js庫以各種格式下載。 我想在這些圖表上自定義上下文按鈕以匹配應用程序的本機樣式。

雖然我已經在Highcharts圖表級腳本（即本示例 ）的范圍內找到了幾個如何實現這一點的例子，但是在每個圖表中實現這些樣式似乎相當重復，因為我知道我有一大組受影響。

我意識到這可能是使用Highcharts中的全局主題實現的，但是我仍然受到庫本身的配置選項的限制。

例如，這將是建議的路徑：

var chartingOptions = {
exporting: {
    buttons: {
        'myButton': {
            id: 'myButton',
            symbol: 'circle',
            x: -62,
            symbolFill: '#B5C9DF',
            hoverSymbolFill: '#779ABF'
        }
    }
}

但不幸的是，它並沒有提供很多表現力。

我能夠定義一個css樣式並以某種方式使用其ID或CLASS將其傳遞給全局主題或圖表集嗎？

Answer 1

是的，您可以使用theme屬性設置按鈕的class或id 。

buttons: {
    'myButton': {
        symbol: 'circle',
        symbolFill: '#B5C9DF',
        hoverSymbolFill: '#779ABF',
        theme: {
            class: "myButton highcharts-button highcharts-button-normal",
            id: "myDiamondButton"
        }
    }
}