1

考虑以下堆积条形图的示例。通过在系列中添加标签配置，我可以在条形图中显示每个字段（喜剧、动作、戏剧、惊悚片）的计数，但我还如何显示字段名称？label 的渲染器配置属性似乎没有多大用处，因为该函数仅接收计数作为参数。

label:{
  display:'insideStart'  ,
  field:[null, null, 'drama', 'thriller'],
  renderer:function(item){
    //For this case, item will be an int value. Thus, not sure how useful it is 
    //as we cannot get the field name from it.
  }          
}
4

1 回答 1

1

实际上，渲染器函数传递的参数不仅仅是值。这些参数与方法相同，只是onPlaceLabel在开头添加了值，并且在那里有更好的文档说明。

我们在index系列中得到了 of 字段，事实上，我们series在参数中也有可用的item。有了它，我们可以实现您想要的：

label: {
    display:'insideStart'
    ,field:[null, null, 'drama', 'thriller']
    ,renderer: function(value, label, storeItem, item, i, display, animate, index) {
        var series = item.series,
            titles = series.title;
        return titles && titles[index] || series.yField[index];
    }
}

我试图首先获得标题，因为在现实生活中，我不会向用户显示原始字段名称。为了记录，为了做到这一点，这是整个系列的配置方式。它没有出现在文档中，除了用户评论......

series: [{
    type: 'bar',
    axis: 'bottom',
    gutter: 80,
    xField: 'year',
    yField: ['comedy', 'action', 'drama', 'thriller'],
    title: ['Comédie', 'Action', 'Drame', 'Thriller'],
    stacked: true,
    label: {
        display:'insideStart'
        ,field:[null, null, 'drama', 'thriller']
        ,renderer: function(value, label, storeItem, item, i, display, animate, index) {
            var series = item.series,
                titles = series.title;
            return titles && titles[index] || item.yField;
        }
    }
}]
于 2013-07-31T22:27:00.793 回答