Question

我的要求是根据chartType和特定格式的dataSet的Web服务响应动态绘制图表，但FusionChart无法做到这一点。

在下面的示例中，假设所有图表类型（如线，列，堆叠等）的dataSet格式都相同，但是当我更改图表类型时，它会显示无可用数据

*注意：我在HighCharts中获得了同样的效果，但是我的客户被迫使用融合图

export const getChartOptions = (chartOptions) => {
    return {
        chartConfig: {
            type: chartOptions.type,
            dataFormat: chartOptions.dataFormat,
        },
        dataSource: {
            chart: {
                caption: chartOptions.caption,
                subCaption: chartOptions.subCaption,
                xAxisName: chartOptions.xAxisName,
                yAxisName: chartOptions.yAxisName,
                numberSuffix: chartOptions.numberSuffix,
                theme: chartOptions.theme,
                showLegend: '1'
            },
            categories: [
                {
                    category: [{
                        label: 'Q1'
                    }, {
                        label: 'Q2'
                    }, {
                        label: 'Q3'
                    }, {
                        label: 'Q4'
                    }]
                }
            ],
            dataset: [{
                seriesname: 'Last Year',
                data: [{
                    value: 10000
                }, {
                    value: 11500
                }, {
                    value: 12500
                }, {
                    value: 15000
                }]
            }]
        }
    };
};

Answer 1

FusionCharts为单序列图和多序列图提供了一些规定的数据格式，对于单序列图，您需要像这样的数据data:[{label:"mylabel"},{value:123}]

类似地，对于多系列图表，您需要具有类别对象，该对象将保存x轴标签，而数据集对象将为每个系列保存多个数据对象

提示：如果要使用现有的dataSource绘制柱线图，请将图表类型设置为mscolumn2d或msline

FusionCharts.ready(function() {
  var revenueChart = new FusionCharts({
    type: 'mscolumn2d',
    renderAt: 'chart-container',
    width: '700',
    height: '400',
    dataFormat: 'json',
    dataSource: {
      chart: {

        showLegend: '1'
      },
      categories: [{
        category: [{
          label: 'Q1'
        }, {
          label: 'Q2'
        }, {
          label: 'Q3'
        }, {
          label: 'Q4'
        }]
      }],
      dataset: [{
        seriesname: 'Last Year',
        data: [{
          value: 10000
        }, {
          value: 11500
        }, {
          value: 12500
        }, {
          value: 15000
        }]
      }]
    }
  }).render();
});

演示-http://jsfiddle.net/tz0orfkq/

FusionCharts无法在同一数据源上绘制不同的图表

1 个答案: