Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/variables/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript NReco构建数据透视表图表_Javascript_C#_Json_C3.js_Nreco - Fatal编程技术网

Javascript NReco构建数据透视表图表

Javascript NReco构建数据透视表图表,javascript,c#,json,c3.js,nreco,Javascript,C#,Json,C3.js,Nreco,我正在使用NReco构建数据透视表,我想显示一个与表中显示的数据相对应的图表。我正试图用c3图表来实现这一点(非常喜欢它的外观),但另一种图表是受欢迎的 我将通过ajax发送NReco Pivot表的JSON,并遵循上的示例,用以下代码构建JSON: var pivotTable = new PivotTable(lines, columns, pivotData); var htmlResult = new StringWriter(); va

我正在使用NReco构建数据透视表,我想显示一个与表中显示的数据相对应的图表。我正试图用c3图表来实现这一点(非常喜欢它的外观),但另一种图表是受欢迎的

我将通过ajax发送NReco Pivot表的JSON,并遵循上的示例,用以下代码构建JSON:

        var pivotTable = new PivotTable(lines, columns, pivotData);

        var htmlResult = new StringWriter();
        var jsonResult = new StringWriter();
        var pvtHtmlWr = new PivotTableHtmlWriter(htmlResult);
        var chartJsonWr = new PivotTableJsonWriter(jsonResult);
        pvtHtmlWr.Write(pivotTable);
        chartJsonWr.Write(pivotTable);
        
        return new   {Pvt = htmlResult.ToString(), Chart = jsonResult.ToString()};
产生以下JSON

"Chart":"{\"Columns\":[\"Year\"],\"Rows\":[\"Spot\"],\"ColumnKeys\":[[2004],[2005]],\"RowKeys\":[[\"A\"],[\"B\"],[\"C\"]],\"Values\":[[1483.0,1396.0],[1237.0,1700.0],[18276.0,17643.0]],\"GrandTotal\":41735.0,\"ColumnTotals\":[20996.0,20739.0],\"RowTotals\":[2879.0,2937.0,35919.0],\"MeasureLabels\":[\"Sum"],\"PivotDataVersion\":\"TRIAL http://www.nrecosite.com/pivot_data_library_net.aspx\"}"
在ajax调用中,我解析Json并尝试构建图表

    success: function (response) {
            $("#pvtTable").html(response.Pvt);
          
            var crt = JSON.parse(response.Chart);
            var rows = crt.RowKeys;
            var vals = crt.Values;
            
            var chart = c3.generate({
                bindto:"#pvtChart",
                data: {
                    rows: [rows, vals]
                       
                }
            });
但图表仅显示行的标签


我尝试重建阵列,但没有成功。所以我的问题是:我做错了什么?我可以用NReco Json和c3或其他图表来实现这一点吗?

查看PivotData示例包中的小部件,该小部件通过PivotTableJsonWriter返回的Json结构呈现带有ChartistJS库的pivot图表:

其使用方式如下:

<div id='pivotChart'></div>
<script type="text/javascript">
$('#pivotChart').nrecoPivotChart( { 
  chartType : "bar",
  pivotData : JSON.parse( jsonProducedByPivotTableJsonWriter )
});
</script>

要正确显示二维透视表数据,您可能还需要指定自定义轴标签。

我尝试使用您的解决方案,结果相同,如何查看图表结果:

var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: [
        ['data1', 30, 200, 100, 400, 150, 250],
        ['data2', 50, 20, 10, 40, 15, 25]
      ]
    }
});
var pivotData = {
        "Columns": [],
        "Rows": ["country_code"],
        "ColumnKeys": [],
        "RowKeys": [["AR"], ["AT"], ["AU"], ["BE"], ["BG"], ["BR"], ["CA"], ["CH"], ["CY"], ["CZ"], ["DE"], ["DK"], ["EE"], ["ES"], ["FI"], ["FR"], ["GB"], ["GR"], ["HK"], ["HR"], ["HU"], ["IC"], ["ID"], ["IE"], ["IN"], ["IS"], ["IT"], ["JP"], ["KR"], ["LT"], ["LU"], ["LV"], ["MC"], ["MT"], ["MX"], ["NL"], ["NO"], ["PL"], ["PT"], ["RO"], ["RS"], ["RU"], ["SE"], ["SI"], ["SK"], ["TW"], ["UA"], ["US"]],
        "Values": [[], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], []],
        "GrandTotal": [1099930.98],
        "ColumnTotals": [],
        "RowTotals": [[212.0], [8037.5], [1199.80], [5885.6], [559.79], [269.1], [2027.49], [10291.71], [488.2], [60119.58], [67519.10], [1340.0], [180.0], [28126.66], [2473.98], [30158.81], [30894.91], [3580.03], [290.0], [7354.7], [83371.2], [48.50], [325.8], [854.34], [173.50], [319.0], [161664.01], [323.0], [506.0], [786.8], [544.3], [1618.66], [2882.0], [98.90], [2745.0], [12125.1], [52.0], [3151.6], [2894.69], [7968.99], [119.99], [538542.9], [1126.05], [599.18], [2223.32], [70.5], [400.0], [13386.69]],
        "MeasureLabels": ["Sum of total_product_paid"]
    };
$('#_1506339485927').nrecoPivotChart( {
            pivotData: pivotData,
            chartType: "bar"})