Highcharts - 無法將樣式應用於x軸標籤

我正在使用Highcharts，並且無法通過我的主題應用x軸標籤樣式......如果我在創建圖表時應用它，它會正常工作..但主題選項似乎只能在x軸上被忽略。相同的樣式適用於y軸。Highcharts - 無法將樣式應用於x軸標籤

下面的代碼。謝謝！

主題

Highcharts.theme = { 
    chart: { 
     zoomType: 'x' 
    }, 
    plotOptions: { 
     column: { 
      borderColor: null, 
      borderWidth: 1, 
      borderRadius: 3, 
      shadow: true 
     }, 
     line: { 
      lineWidth: 3, 
      shadow: false, 
      marker: { 
       radius: 10 
      } 
     } 
    }, 
    xAxis: { 
     gridLineColor: '#ebebeb', 
     lineColor: '#ebebeb', 
     minorGridLineColor: '#ebebeb', 
     tickColor: '#ebebeb', 
     plotLines: [{ 
      color: '#ebebeb' 
     }], 
     showLastLabel: true, 
     labels: { 
      style: { 
       color: '#525151', 
       font: '12px Helvetica', 
       fontWeight: 'bold' 
      }, 
      formatter: function() { 
       return this.value; 
      } 
     }, 
     title: { 
      text: "TEST" 
     } 
    }, 
    yAxis: { 
     gridLineColor: '#ebebeb', 
     lineColor: '#ebebeb', 
     minorGridLineColor: '#ebebeb', 
     tickColor: '#ebebeb', 
     plotLines: [{ 
      color: '#ebebeb' 
     }], 
     labels: { 
      style: { 
       color: '#525151', 
       font: '12px Helvetica', 
       fontWeight: 'bold' 
      }, 
      formatter: function() { 
       return this.value; 
      } 
     }, 
     title: { 
      text: null 
     } 
    } 
}; 

// Apply the theme 
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);

而我將其應用於圖表：

chart1 = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'showChart' 
     }, 
     colors: [{ 
      linearGradient: perShapeGradient, 
      stops: [ 
         [0, 'rgba(32, 106, 166, 0.3)'], 
         [1, 'rgba(32, 106, 166, 0)'] 
         ] 
     }, { 
      linearGradient: perShapeGradient, 
      stops: [ 
         [0, 'rgba(120, 99, 181, 0.3)'], 
         [1, 'rgba(120, 99, 181, 0)'] 
         ] 
     }, 
       ], 
     xAxis: [{ 
      type: 'datetime', 
      labels: { 
       formatter: function() { 
        var monthStr = Highcharts.dateFormat('%l:%M %P', this.value); 
        return monthStr; 
       } 
      } 
     }], 
     series: [{ 
      name: 'Public Views', 
      type: 'area', 
      marker: { 
       symbol: 'url(/Assets/images/marker_blue.png)' 
      }, 
      pointInterval: 3600000, // one hour 
      pointStart: Date.UTC(2009, 9, 6, 0, 0, 0), 
      data: [502, 435, 309, 247, 302, 434, 568, 702, 935, 809, 647, 502, 834, 526, 302, 335, 409, 647, 702, 634, 668, 902, 935, 1009] 
     }, { 
      name: 'Company Views', 
      type: 'area', 
      marker: { 
       symbol: 'url(/Assets/images/marker_purple.png)' 
      }, 
      pointInterval: 3600000, // one hour 
      pointStart: Date.UTC(2009, 9, 6, 0, 0, 0), 
      data: [406, 307, 211, 133, 221, 367, 366, 506, 707, 611, 333, 221, 567, 466, 106, 107, 281, 433, 221, 567, 466, 606, 607, 811] 
     }] 
    });

來源

2012-07-12 Adam Storr

什麼是錯誤？ – 2012-07-12 21:03:33

沒有真正的錯誤。創建圖表時設置的xAxis屬性似乎覆蓋了xAxis主題選項。 – 2012-07-12 21:21:10

你能jsfiddle嗎？ – 2012-07-12 21:36:05

yAxis: [{ 
     gridLineColor: '#ebebeb', 
     lineColor: '#ebebeb', 
     minorGridLineColor: '#ebebeb', 
     tickColor: '#ebebeb', 
     plotLines: [{ 
      color: '#ebebeb' 
     }], 
     labels: { 
      style: { 
       color: '#525151', 
       font: '12px Helvetica', 
       fontWeight: 'bold' 
      }, 
      formatter: function() { 
       return this.value; 
      } 
     }, 
     title: { 
      text: null 
     } 
    }]

注意額外的[]周圍的括號爲y軸。 x不需要。因爲yAxis可能有第二個y軸。

來源

2012-07-13 14:55:57 ras

謝謝拉斯......括號是變相殺手。 – 2012-07-13 18:04:19

這也救了我。在我的主題文件中添加數組括號爲我解決了這個問題。 – lislis 2016-10-07 20:29:58

Highcharts - 無法將樣式應用於x軸標籤

回答

相關問題