Question

如何在加载方法中对数据进行分组？当您在generate方法中对数据进行分组时，其工作完美。生成方法中的分组示例：

var chart = c3.generate({
    data: {
        columns: [
            ['data1', -30, 200, 200, 400, -150, 250],
            ['data2', 130, 100, -100, 200, -150, 50],
            ['data3', -230, 200, 200, -300, 250, 250]
        ],
        type: 'bar',
                    groups: [
                        ['data1', 'data2']
                    ]
    },
    grid: {
        y: {
            lines: [{value:0}]
        }
    }
});

但是，在我的应用程序中，数据的名称是动态生成的，因此数据必须按加载方法分组，我从Web服务接收JSON。例如：

chart.load({
    json: dataJsonGraph,
    bindto: '#chart'                    
});

我尝试过以这种方式添加数据组

chart.load({
    json: dataJsonGraph,
    bindto: '#chart',
    data: {
        groups: [
            ['dynData1', 'dynData2']
        ]
    }                       
});

但它根本不起作用......

有什么想法吗？

Answer 1

我遇到了和你一样的问题。为了解决这个问题，我在调用chart.load()后使用了chart.load({ json: dataJsonGraph, bindto: '#chart' }); chart.groups([ ['dynData1', 'dynData2'] ]);。

var xyz = 'data:image/svg+xml;utf-8, \
    <svg width="30" height="60" xmlns="http://www.w3.org/2000/svg"> \
        <defs><linearGradient id="mygx"> \
            <stop offset="5%" stop-color="yellow"/> \
            <stop offset="95%" stop-color="red"/> \
        </linearGradient></defs> \
        <path fill="url(#mygx)" stroke="black" stroke-width="1.5" d="M0 0 L0 35 L15 60 L30 35 L30 0 L0 0Z"></path> \
        </svg>';

var myIcon = {
    url: xyz,
    fillOpacity: 0.7,
    scale: 1
};

var marker = new google.maps.Marker({
    position: markerLocation,
    icon: myIcon,
    map: map,
    title: 'hello'
});

以加载方法

1 个答案: