Question

我正在尝试使用以下数据显示此https://jsfiddle.net/OlegKi/bebuyk67/7/之类的图表：

[{"name":"doctor","monetary":"on","number":57},{"name":"programmer","monetary":"non-monetary","number":15}]

但我不能将货币与其他数据进行货币对或有价值分组。是否有其他方法可以显示包含这些数据的图表？

以下是控制器中的定义：

$scope.chart = c3.generate({
          bindto: d3.select('#chart'),
          data: {
            json: $scope.data,
            columns: [
                ['monetary'], 
                ['number']
            ],
            keys: {
                value: ['doctor', 'programmer']
            },
            groups: [
                ['number'],['monetary']
             ],
            type: 'bar'
            },

          bar: {
            width: {
                ratio: 0.5 
              }
          },
        });
      },

    function formatData ( json ) {
      var formattedData = [],
          object        = {};

      // fill object with data
      angular.forEach(json, function(row) {
        if (row.hasOwnProperty('name') && row.hasOwnProperty('number')) {
          this[row.name] = row.number;
        }
      },object);

      formattedData.push(object); // push c3 object in the array

      return formattedData;
    }
}]);

Answer 1

如果我没有错，请删除此部分代码，然后单独显示

  groups: 
[ ['number'],['monetary']],

修改后的代码如下，并且还给出了一个小提琴链接。

var chart = c3.generate({
    data: {
        columns: [
            ['MONETARY', 0, 3259, 10415, 14660, 2950, 16705, 22255, 4000],
            ['NON-MONETARY', 12335, 18041, 35900, 21985, 15110, 370, 13055, 20740]
        ],
        type: 'bar',

    },
    axis: {
        x: {
            type: 'category',
            categories: ['DENTIST', 'PROGRAMMER/ANALYST', 'CORPORATE SECRETARY', 'PHYSICIAN', 'PROFESSOR', 'PRESIDENT', 'MANAGER', 'CO-OWNER']
        }
    }    
});

看到修改过的小提琴： http://jsfiddle.net/63cp42Lv/4/

带有3个变量的C3条形图

1 个答案: