2012-04-04 4 views
5

내 ExtJS4 차트 중 하나에 많은 LineSeries를 갖고 싶습니다.차트에 여러 계열로드하기

Ext.define('DayStatistics', { 
    extend:'Ext.data.ArrayStore', 
    fields:[ 'date', 'count_impressions', 'count_clicks', 'count_conversions' ] 
}); 

그리고 내 그리드 뷰에서 선택한 얼마나 많은 항목 A가, 내가 세 줄 ('count_impressions', 'count_clicks'을 그리려에 따라 :

나는 다음과 같습니다 상점이 'count_conversions')는 각 항목에 대해 그리드보기의 각 항목이 저장소에 몇 개의 항목을 갖는지를 나타냅니다. 나는 모든를 SelectionChange으로 호출되는 다음과 같은 기능을 가지고 순간

: 나는 변경할 수와

loadChart: function (Model, records) { 
    var removeChart = function (chart) { 
     var series = chart.series.items, surface = chart.surface, 
      length = series.length, len = surface.groups.keys.length, 
      array = []; 
     for (var i = 0; i < length; i++) 
      array = Ext.Array.merge(array, series[i].group.keys); 
     chart.series.clear(); 
     for (var j = 0; j < array.length; j++) 
      surface.items.getByKey(array[j]).destroy(); 
     for (var t = 0; t < len; t++) 
      surface.groups.items[t].destroy(); 
    }; 

    var chart = Ext.getCmp('advertiserstatisticlist.advertiserChart'); 
    removeChart(chart); 

    for (var record in records) { 
     chart.series.add({ 
      type:'line', 
      xField:'date', 
      yField:'count_impressions' 
     }); 
     chart.store.loadData(records[record].data.days, true); 
     chart.refresh(); 
    } 
} 

있는 그래프 격자보기에서 항목. 그러나 그것은 내가 갖고 싶은 것이 아닙니다. "여러 상점"을 표시하려면 어떻게해야합니까?

나는 {answer : date = 'impressions_1', 'impressions_2', ...}와 같은 작업을 수행하여 상점을 '선형화'해야하는 한 가지 해결책에 대해 생각했습니다. 그러나 그 해법은 해킹의 복잡성을 차트에서 매장으로 이동시킬뿐입니다.

+0

죄송 Brutos을하지만 난 당신의 문제를 이해하지 않았다. 선택한 각 레코드에 대해 세 줄을 표시하겠습니까? 4 개의 레코드를 선택하면 차트에 12 개의 행이 표시됩니까? 두 번째 : 차트의 하단 도끼가 date이고 왼쪽 도끼가 count_impressions입니다. 표시하려는 선의 예제가 있습니까? 즉, 표의 레코드를 클릭하면 차트에 어떤 종류의 데이터가 표시 될 것으로 예상합니까? – Wilk

답변

1

질문의 첫 번째 절반은 의미가 있지만,이 단락은을 던졌습니다 : 그와

내가 그래프 그리드 뷰에있는 항목을 변경할 수 있습니다. 하지만 은 내가 갖고 싶은 것이 아닙니다. "여러 상점"을 표시하려면 어떻게해야합니까?

나는 복수형을 의미합니다. .

그것은 당신이 질문에 포함 된 selectionchange 처리기를 사용하여 그렇게 꽤 간단해야한다이다 :

loadChart: function (selModel, records) { 

    var chart = Ext.getCmp('advertiserstatisticlist.advertiserChart'); 

    chart.series.clear(); 

    for (var record in records) { 
     chart.series.add({ 
      type:'line', 
      xField:'date', 
      yField: record.get(/*[whatever you named the "series name" field in the grid store]*/) 
     }); 
    } 
    chart.redraw(); 
} 
관련 문제