在NV D3水平条形图中如何使用Json作为数据？

它的nv d3条形图程序的源程序现在我把条形图数据的硬编码分开了，即data.json，它现在不显示图表。在NV D3水平条形图中如何使用Json作为数据？

<script> 
    d3.json("Data.json", function (data) { 
    var chart; 
    nv.addGraph(function() { 
    chart = nv.models.multiBarHorizontalChart() 
    .x(function(d) { return d.label }) 
    .y(function(d) { return d.value }) 
    .margin({top: 30, right: 20, bottom: 50, left: 175}) 
    .showValues(true) 
    .tooltips(false) 
    .showControls(false); 

    chart.yAxis 
    .tickFormat(d3.format(',.2f')); 

    d3.select('#chart1 svg') 
    .datum(data) 
    .transition().duration(500) 
    .call(chart); 

    nv.utils.windowResize(chart.update); 

chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e));     
    }); 

    return chart; 
    }); 

    }); 

    </script>

下面是我从源分离data.json它不工作

[ 
    { 
    "label" : "Group A" , 
    "value" : -1.8746444827653 
    } , 
    { 
    "label" : "Group B" , 
    "value" : -8.0961543492239 
    } , 
    { 
    "label" : "Group C" , 
    "value" : -0.57072943117674 
    } , 
    { 
    "label" : "Group D" , 
    "value" : -2.4174010336624 
    } , 
    { 
    "label" : "Group E" , 
    "value" : -0.72009071426284 
    } , 
    { 
    "label" : "Group F" , 
    "value" : -0.77154485523777 
    } , 
    { 
    "label" : "Group G" , 
    "value" : -0.90152097798131 
    } , 
    { 
    "label" : "Group H" , 
    "value" : -0.91445417330854 
    } , 
    { 
    "label" : "Group I" , 
    "value" : -0.055746319141851 
    } 
]

请大家帮我出了什么问题，当我分开JSON

来源

2013-02-22 Purushoth

您没有任何数据传递到图表，除非它是之前声明的...

d3.select('#chart1 svg') 
    .datum(long_short_data)

这应该可能是：

d3.select('#chart1 svg') 
    .datum(data)

，如果你的目的是为了从JSON文件

来源

2013-02-22 10:33:06 paxRoman

我已经改变仍无法正常工作.. – Purushoth 2013-02-23 17:00:16

第二个错误是由kapep提到的：你需要坚持，即使你有一个系列相同的格式，否则所有的功能，将需要在图表级别处理这些数据将不起作用（他们将没有数据加载，例如...） – paxRoman 2013-02-23 19:15:22

棒装载图表数据......在example code使用的格式，您需要提供数据的系列，即使你只有一个系列。或者，您也可以为每个系列设置一个颜色名称。

long_short_data = [ 
    { 
    key: 'Series1', // optional 
    color: '#d62728', // optional 
    values: [ 
     { 
     "label" : "Group A" , 
     "value" : -1.8746444827653 
     } , 
     { 
     "label" : "Group B" , 
     "value" : -8.0961543492239 
     } 
    /* ... */ 
    } 
];

来源

2013-02-23 17:17:31 Kapep

伙计们我以默认格式尝试过也没有用，有没有人分开json文件可用的任何示例？我需要的只是从sql db中获取数据并相应地绘制图表。告诉我的朋友，我需要从sql db中获取数据的格式。 – Purushoth 2013-02-25 06:53:20

@Purushoth如果你确定'd3.json'函数的'data'参数的格式如上（使用console来验证），那么我确定它不是_json file_问题。查看js控制台日志是否有任何错误。 – Kapep 2013-02-25 11:04:51

在NV D3水平条形图中如何使用Json作为数据？

回答

相关问题