C3.js - 嵌套的JSON对象,如何访问和加载数据?

时间:2021-10-24 14:31:57

guys,

I have the following JsonResult

我有以下JsonResult

JsonResult

And i use this code to render my chart

我用这段代码来渲染我的图表

    var chart = c3.generate({
        bindto: "#graficoProjeto",
        x: 'x',
        data: {
            url: '/AdminOrdemServico/OrdemServProjetos',
            mimeType: 'json',
            xFormat: '%d/%m/%Y',
            keys: {
                x: 'DataEmiss',
                value: ['TotalOs']
            },
            type: 'bar'
        },
        axis: {
            x: {
                type: 'timeseries',
                tick: {
                    format: '%d/%m/%Y'
                }
            }
        }
    });

And how can you see Chart on screen, it's working. But i need to add a new line for the object inside the json called "OrdemServMot" and the values of this object, to make like this Combination Chart, how can i do this ? thx.

如何在屏幕上看到图表,它正在运行。但是我需要为json中的对象添加一个名为“OrdemServMot”的新行和这个对象的值,使这个组合图表,我该怎么做?谢谢。

1 个解决方案

#1


0  

  1. Latest c3.js version should allow you to specify value "path" instead of just value key. This can help you taking deep values from json structure.

    最新的c3.js版本应该允许您指定值“path”而不仅仅是值键。这可以帮助您从json结构中获取深度值。

  2. To have different chart types, use types instead of type.

    要使用不同的图表类型,请使用类型而不是类型。

    data: {
        url: '/AdminOrdemServico/OrdemServProjetos',
        mimeType: 'json',
        xFormat: '%d/%m/%Y',
        keys: {
            x: 'DataEmiss',
            value: ['TotalOs', 'OrdemServMot[0].TotalOs'] // 1
        },
        types: ['bar', 'line'] // 2
    },
    

Good luck!

#1


0  

  1. Latest c3.js version should allow you to specify value "path" instead of just value key. This can help you taking deep values from json structure.

    最新的c3.js版本应该允许您指定值“path”而不仅仅是值键。这可以帮助您从json结构中获取深度值。

  2. To have different chart types, use types instead of type.

    要使用不同的图表类型,请使用类型而不是类型。

    data: {
        url: '/AdminOrdemServico/OrdemServProjetos',
        mimeType: 'json',
        xFormat: '%d/%m/%Y',
        keys: {
            x: 'DataEmiss',
            value: ['TotalOs', 'OrdemServMot[0].TotalOs'] // 1
        },
        types: ['bar', 'line'] // 2
    },
    

Good luck!