Question

我有以下c3.js代码来制作一个从0开始构建的条形图（动画从0到每个条形的值）。该图还具有与其一起动画的标签。标签显示图表的最终值。

blankData=[
  ['data1',0,0,0,0],
  ['data2',0,0,0,0],
  ['data3',0,0,0,0]
]

chartData=[
  ['data1',60,10,4,25],
  ['data2',30,22,5,30],
  ['data3',30,9,4,17]
]

var chart = c3.generate({
    bindto: '#chart',
    size: {
        height: 500,
    },
    data: {
        columns: blankData,
        colors:{
          data1:'#00af50',
          data2:'#F7931E',
          data3: '#FF0000'
        },
        names:{
          data1:'namedata1',
          data2:'namedata2',
          data3:'namedata3'

        },

        type:'bar',

        labels: true,
    },



    tooltip: {
        show: false
    },    
    legend: {
        show: false
    },
    axis: {
        x: {
            type: 'category',
            categories: ['001', '002','003','004'],
             tick: {

             format: function (d) { 
              return "" ; }
            }
        }        
    },
    transition: {
      duration: 2000
    }
});
setTimeout(function () {
    chart.load ({columns: chartData});
 }, 500)

这很好用，但我喜欢标签“＃34;积累＆＃34;以及动画酒吧。也就是说，标签将从0开始并增加到条形的最终值，因为条形图为动画。

另外，作为一个附带问题，是否有人知道要更改.css文件中的哪个属性以使标签变为黑色？默认情况下，标签与条形图的颜色相同。

任何帮助将不胜感激。谢谢！

c3.js的动态标签（也是标签颜色）

0 个答案: