更改'rallychart'組件的高度以填充外部容器

我的頁面上有一個'rallychart'組件，它使用填充外部容器的動態寬度呈現，但是誰的高度固定爲400px。我試圖使用組件的setSize函數，但它似乎更改圖表容器大小而不是圖表本身。是否有設置讓圖表默認填充寬度和高度，或者至少有一種方法可以讓我監聽頁面大小調整事件並手動更改圖表高度？更改'rallychart'組件的高度以填充外部容器

謝謝！

來源

2013-10-11 Conner Reeves

我有其中一個容器的height和width指定一個應用程序：

var c2 = Ext.create('Ext.Container', { 
     id:'c2', 
     border: 5, 
     style: { 
      borderColor: 'red', 
      borderStyle: 'solid' 
     }, 
     height: 450, 
     width:600 
     });  
     this.add(c2);

後來加了圖表到該容器僅height指定與：

this.down('#c2').add(
     { 
      xtype: 'rallychart', 
      id: 'ch', 
      height: 200, 
      chartConfig: { 
       chart:{ 
        type: 'scatter', 
        zoomType: 'xy' 
     }, 
    //....

和圖表填充兩默認寬度和高度：

enter image description here

你的例子有什麼不同？

來源

2013-10-14 23:15:05 nickm

當我設置rallychart組件的'height'屬性時，它將更改外部容器高度，而不是圖表本身。如果我將高度更改爲200，則只顯示圖表的上半部分，因爲下半部分由容器切斷。例如，如果我將高度更改爲600，則容器高度將爲600px，但圖表仍然爲400px。 –

嗨康納，我看到了相反的結果：圖表默認填充容器，它的高度對容器高度沒有影響。讓我知道我需要改變以複製你看到的內容。我的代碼在這裏：https://github.com/nmusaelian-rally/game-of-chicken-0 – nickm

我加載了你的代碼，並看到了與你的例子相同的結果，但在更改容器的高度屬性和圖表，高度仍然固定在400px的最大值。幸運的是，我能夠通過在渲染之前更改圖表配置來自行解決問題。我會爲遇到這個問題的未來開發者添加答案。 –

要創建一個高度大於400px的'rallychart'組件，請更改chartConfig - > chart - > height設置以反映所需的高度。

注意：高度將被固定，因此爲容器大小調整設置偵聽器，使用此解決方案將觸發圖表重繪。

this.down('#chartContainer').add({ 
    xtype  : 'rallychart', 
    chartConfig : { 
     chart : { 
      height : 500 //Set chart height here 
     } 
    } 
});

來源

2013-10-15 18:54:57

更改'rallychart'組件的高度以填充外部容器

回答

相關問題