相同的配置在多個Highcharts

我有三個highcharts用於EXTJS 4.1.1應用程序，幾乎使用相同的配置。 我能有這樣的事情相同的配置在多個Highcharts

var config = { 
// configurations 
} 

Ext.define('chartsA',{ 
    extend:'Ext.panel.Panel', 
    items:[{ 
     xtype:'highcharts', 
     chartConfig:{ 
     // config defined above 
     // customConfigs for the particluar chart (if any) 
     } 
    }] 
});

喜歡本作的接下來的兩個圖也。

有沒有辦法做到這一點？

來源

2013-04-29 user2803

這將可能幫助：http://stackoverflow.com/questions/8253590/manage-multiple-highchart-charts-in-a-single-webpage – 2013-04-29 11:55:19

我用了一個父類和擴展它爲其他圖表。 – user2803 2013-04-30 12:37:37

請參考示例代碼，它會工作。以下所有代碼都需要寫入控制器。

注意：所有MyChart.xxxxx值都寫在我的自定義css文件中。你可以寫你自己的CSS或硬編碼的價值。

/* 
* Inside init function of controller 
*/ 
this.control({ 
      'Panel[id = chartPanel]' : { 
       afterrender : this.onPanelRendered 
      } 




/* 
* This function will be invoked on initial rendering of chart panel 
*/ 
    ,onPanelRendered : function(chartPanel) { 
     this.loadPanel(chartPanel); 
    } 




,loadPanel : function(chartPanel) { 
     this.setChartTheme(); 
     this.updateChartInfo(); 

    } 




/* 
    * to set chart custom theme 
    */ 
    ,setChartTheme:function(){ 
     Ext.define('Ext.chart.theme.myTheme',{ 
      extend:'Ext.chart.theme.Base' 
      ,constructor:function(config){ 
       this.callParent([Ext.apply({ 
        axisTitleTop: { 
         font: MyChart.chartThemeAxisTitleTopFont, 
         fill: MyChart.chartThemeAxisTitleTopFill 
        }, 
        axisTitleRight: { 
         font: MyChart.chartThemeAxisTitleFont, 
         fill: MyChart.chartThemeAxisTitleTopFill, 
         rotate: { 
          x:MyChart.chartThemeAxisTitleRotatex, 
          y:MyChart.chartThemeAxisTitleRotatey, 
          degrees: MyChart.chartThemeAxisTitleRotateDegree 
         } 
        }, 
        axisTitleBottom: { 
         font: MyChart.chartThemeAxisTitleFont, 
         fill: MyChart.chartThemeAxisTitleTopFill 
        }, 
        axisTitleLeft: { 
         font: MyChart.chartThemeAxisTitleFont, 
         fill: MyChart.chartThemeAxisTitleTopFill, 
         rotate: { 
          x:MyChart.chartThemeAxisTitleRotatex, 
          y:MyChart.chartThemeAxisTitleRotatey, 
          degrees: MyChart.chartThemeAxisTitleRotateDegree 
         } 
        } 
       },config)]) ; 

      } 
     }); 
    } 






,updateChartInfo : function() { 
     this.updatexChart(); 
     Ext.getCmp(<Ur panel id>).add(MyChart.xChart); 

    } 





,updatexChart:function(){ 

     MyChart.xChart = Ext.create('Ext.chart.Chart',{ 
      ........ 
      ........ 
      ........ 
      ,style : 
      ,theme : 'myTheme' // This is our custom theme 
      ,legend : { 
       position  : 
       labelFont  : 
      } 
      ,store : 
      ,axes :[ 
       { 
        type  : 
        ,position: 
      ...... 
      ....... 
      .......

感謝

來源

2013-04-29 11:17:17 Hariharan

相同的配置在多個Highcharts

回答

相關問題