ComboChart带gwt google-visualization中的注释文本 [英] ComboChart with annotation text in gwt google-visualization

问题描述

我使用 gwt-visualization （围绕图表工具一>）。我有一个包含两个条形图（堆叠）和折线图的ComboChart，并且我想添加一个注释和 annotationText 一些行。

DataTable 定义如下：

  private DataTable buildData（）{
 
 DataTable data = DataTable.create（）; 
 data.addColumn（ColumnType.STRING，Day）; 
 data.addColumn（ColumnType.NUMBER，Domain）; 
 data.addColumn（ColumnType.NUMBER，Domain（Source 1））; 
 data.addColumn（ColumnType.NUMBER，Domain（Source 2））; 
 
 addAnnotationColumn（data）; 
 
返回数据; 
 
 $ b private private void addAnnotationColumn（DataTable data）/ *  -  {
 data.addColumn（{
 type：'string'，
 role： 'annotation'
}）; 
 data.addColumn（{
 type：'string'，
 role：'annotationText'
}）; 
}  -  * /; 
  

然后选择图表...

  private ComboChart.Options createComboOptions（String title）{
 ComboChart.Options options = ComboChart.createComboOptions（）; 
 Series line = Series.create（）; 
 line.setType（Type.LINE）; 
 options.setSeries（0，line）; 
 
系列bars1 = Series.create（）; 
 bars1.setType（Type.BARS）; 
 options.setSeries（1，bars1）; 
 
系列bars2 = Series.create（）; 
 bars2.setType（Type.BARS）; 
 options.setSeries（2，bars2）; 
 
 options.setIsStacked（true）; 
返回选项; 
} 
  

其结果如下：

我需要的是为某些行添加注释在系列中，换句话说如何在ComboChart中设置角色，但似乎无法找到任何有关如何在gwt中执行此操作的文档在ComboChart中使用纯JS）。帮助？

解决方案

原来，ComboChart将annotation / annotationText列添加到图上创建的最后一个系列 - 意思是角色被添加到条形图中，它不支持ComboChart中的注释。

然而，折线图支持它们 - 所以'脏修复'是为了图表中最后一行是系列：

  private ComboChart.Options createComboOptions（String title）{
 ComboChart.Options options = ComboChart.createComboOptions（）; 
 
系列bars1 = Series.create（）; 
 bars1.setType（Type.BARS）; 
 options.setSeries（0，bars1）; 
 
系列bars2 = Series.create（）; 
 bars2.setType（Type.BARS）; 
 options.setSeries（1，bars2）; 
 
 Series line = Series.create（）; 
 line.setType（Type.LINE）; 
 options.setSeries（2，line）; 
 
 options.setIsStacked（true）; 
返回选项; 
} 
  

I'm using gwt-visualization (a wrapper around Chart Tools). I have a ComboChart that includes two bar charts (stacked) and a line chart, and I want to add an annotation and annotationText to some rows.

The DataTable is defined like this:

private DataTable buildData() {

    DataTable data = DataTable.create();
    data.addColumn(ColumnType.STRING, "Day");
    data.addColumn(ColumnType.NUMBER, "Domain");
    data.addColumn(ColumnType.NUMBER, "Domain (Source 1)");
    data.addColumn(ColumnType.NUMBER, "Domain (Source 2)");

    addAnnotationColumn(data);

    return data;
}

private native void addAnnotationColumn(DataTable data) /*-{
    data.addColumn({
        type : 'string',
        role : 'annotation'
    });
    data.addColumn({
        type : 'string',
        role : 'annotationText'
    });
}-*/;

And then the chart options...

private ComboChart.Options createComboOptions(String title) {
    ComboChart.Options options = ComboChart.createComboOptions();
    Series line = Series.create();
    line.setType(Type.LINE);
    options.setSeries(0, line);

    Series bars1 = Series.create();
    bars1.setType(Type.BARS);
    options.setSeries(1, bars1);

    Series bars2 = Series.create();
    bars2.setType(Type.BARS);
    options.setSeries(2, bars2);

    options.setIsStacked(true);
    return options;
}

Which results in something like this:

What I need is to add annotations to some rows in the line series, or in other words how to set roles in a ComboChart, but I can't seem to find any documentation on how to do it in gwt (or even how to do it in pure JS in a ComboChart). Help?

解决方案

Turns out that the ComboChart adds the annotation/annotationText columns to the last series created on the graph - Meaning that the roles were being added to the Bar graph, which does not support annotations in the ComboChart.

The Line graph, however, supports them - So the 'dirty fix' was to have the line series being the last one in the graph:

private ComboChart.Options createComboOptions(String title) {
    ComboChart.Options options = ComboChart.createComboOptions();

    Series bars1 = Series.create();
    bars1.setType(Type.BARS);
    options.setSeries(0, bars1);

    Series bars2 = Series.create();
    bars2.setType(Type.BARS);
    options.setSeries(1, bars2);

    Series line = Series.create();
    line.setType(Type.LINE);
    options.setSeries(2, line);

    options.setIsStacked(true);
    return options;
}

这篇关于ComboChart带gwt google-visualization中的注释文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！