複数のシリーズをVaadinの複数のシリーズにドリルダウンして追加する

Question

Vaadinにthisを入力します。

$(function() { 

// Create the chart 
$('#container').highcharts({ 
    chart: { 
     type: 'column' 
    }, 
    title: { 
     text: 'Highcharts multi-series drilldown' 
    }, 
    subtitle: { 
     text: 'Click columns to drill down to single series. Click categories to drill down both.' 
    }, 
    xAxis: { 
     type: 'category' 
    }, 

    plotOptions: { 
     series: { 
      borderWidth: 0, 
      dataLabels: { 
       enabled: true 
      } 
     } 
    }, 

    series: [{ 
     name: '2010', 
     data: [{ 
      name: 'Republican', 
      y: 5, 
      drilldown: 'republican-2010' 
     }, { 
      name: 'Democrats', 
      y: 2, 
      drilldown: 'democrats-2010' 
     }, { 
      name: 'Other', 
      y: 4, 
      drilldown: 'other-2010' 
     }] 
    }, { 
     name: '2014', 
     data: [{ 
      name: 'Republican', 
      y: 4, 
      drilldown: 'republican-2014' 
     }, { 
      name: 'Democrats', 
      y: 4, 
      drilldown: 'democrats-2014' 
     }, { 
      name: 'Other', 
      y: 4, 
      drilldown: 'other-2014' 
     }] 
    }], 
    drilldown: { 
     series: [{ 
      id: 'republican-2010', 
      data: [ 
       ['East', 4], 
       ['West', 2], 
       ['North', 1], 
       ['South', 4] 
      ] 
     }, { 
      id: 'democrats-2010', 
      data: [ 
       ['East', 6], 
       ['West', 2], 
       ['North', 2], 
       ['South', 4] 
      ] 
     }, { 
      id: 'other-2010', 
      data: [ 
       ['East', 2], 
       ['West', 7], 
       ['North', 3], 
       ['South', 2] 
      ] 
     }, { 
      id: 'republican-2014', 
      data: [ 
       ['East', 2], 
       ['West', 4], 
       ['North', 1], 
       ['South', 7] 
      ] 
     }, { 
      id: 'democrats-2014', 
      data: [ 
       ['East', 4], 
       ['West', 2], 
       ['North', 5], 
       ['South', 3] 
      ] 
     }, { 
      id: 'other-2014', 
      data: [ 
       ['East', 7], 
       ['West', 8], 
       ['North', 2], 
       ['South', 2] 
      ] 
     }] 
    } 
}); 
}); 

私はシリーズを生成するために、非同期ドリルダウンを使用しています：あなたはhandleDrilldown(DrilldownEvent event)戻り1 DataSeriesを見ることができると私はリストを必要としたよう

chart.setDrilldownCallback(new DrilldownCallback() { 

    private static final long serialVersionUID = 6274915467357292767L; 

    @Override 
    public DataSeries handleDrilldown(DrilldownEvent event) { 
     i++; 
     return buildDataSeries(event.getItem()); 
    } 
}); 

を。

Vaadinで複数のシリーズをドリルダウンして追加する方法はありますか？

Answer 1

DataSeriesのリストが必要な理由がわかりません。 DrilldownEventオブジェクトには、どのバー（republican/democrat/other; 2010/2014）が選択されたかを知るには十分な情報が必要です。それを知っているならば、East、West、North、Southの4つの値をすべて含む単一のDataSeriesを構築することができます。送信したリンクが示すように、各ドリルダウンは1つのシリーズ "シリーズ3"に含まれています。

あなたはあなたのDataSeriesを構築することができることを知って

String year = event.getSeries().getName() // 2010 or 2014 
String party = event.getDataSeriesItem().getName() // Republican, Democrat or Other 

：

DataSeries series = new DataSeries(); 
series.add(new DataSeriesItem("East", a); 
series.add(new DataSeriesItem("West", b); 
series.add(new DataSeriesItem("North", c); 
series.add(new DataSeriesItem("South", d); 
// a, b, c, d depending on the year and party variables above