Javascript 在nvd3.js中使用适当的值创建图形

Javascript 在nvd3.js中使用适当的值创建图形,javascript,graph,nvd3.js,Javascript,Graph,Nvd3.js,我第一次在php代码中使用nvd3.js。 我想显示特定用户的日期图表计数。我想水平显示日期,垂直计数。但我不知道该怎么做。 我的json数据如下:[“key”:“0”,“values”:[“1374517800000”,“2”]],[182398]:{“key”:“182398”,“values”:[“1375295400000”,“2”],[“1374517800000”,“2”],[“1374604200000”,“12”],[“1374431400000”,“1”],[137512260

我第一次在php代码中使用nvd3.js。 我想显示特定用户的日期图表计数。我想水平显示日期,垂直计数。但我不知道该怎么做。 我的json数据如下:
[“key”:“0”,“values”:[“1374517800000”,“2”]],[182398]:{“key”:“182398”,“values”:[“1375295400000”,“2”],[“1374517800000”,“2”],[“1374604200000”,“12”],[“1374431400000”,“1”],[1375122600000”,“4”],[1375209000000”,“19”],[185271]:{“key”:“185271”,“values”:[“key”:“key”:“185271”,“values”:[“1374604200000”,“13744200000”,“13744200000”,“13744200000”],][”],[511”],[517800000],]

var chart;
nv.addGraph(function() {  
    chart = nv.models.cumulativeLineChart()
    .x(function(d) { return d[0]})
    .y(function(d) { return d[1]})
    .color(d3.scale.category10().range())
    .clipVoronoi(false);

    chart.xAxis
    .tickFormat(function(d) {
        return d3.time.format('%x')(new Date(d))
    });

    chart.yAxis
    .tickFormat(d3.format(',.1%'));

    d3.select('#cumulative_line_chart svg')
    .datum(stageArr)
    //.transition().duration(500)
    .call(chart);

    //TODO: Figure out a good way to do this automatically
    nv.utils.windowResize(chart.update);
    //nv.utils.windowResize(function() { d3.select('#chart1 svg').call(chart) });
    chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e)); });
    return chart;
    });
在本例中,我的第一个问题是日期显示不正确(我将日期转换为strotime(),然后使用日期concat 000,例如
1375295400000=strotime(“23-07-2013”)“000”
,这种转换是在php中进行的)。 第二个问题是在y轴上,我想显示像2,12,4,19这样的整数(根据上面的json数据)等等。 所以请指导我怎么做。 提前谢谢

更新:
很抱歉,它不是d3.js,而是nvd3.js。

您必须定义轴的比例:它不是根据您的数据计算的,但您可以使用d3的帮助函数,如d3.max

var xScale = d3.scale.linear()
                 .domain([0, d3.max(dataset, function(d) { return d[0]; })])
                 .range([0, w]);
c、 f

然后,可以将比例定义添加到轴:

var xAxis = d3.svg.axis()
              .scale(xScale)
              .orient("bottom");

c、 f.

正在寻找类似的东西吗?并且是cde的工作版本

nv.addGraph(function () {
    var chart = nv.models.lineChart().margin({
        top: 30,
        right: 20,
        bottom: 50,
        left: 45
    }).showLegend(true).tooltipContent(function (key, y, e, graph) {
        return '<h3>' + key + '</h3>' + '<p>' + e + '% at ' + y + '</p>'
    });

    chart.xAxis.tickFormat(function (d) {
        return d3.time.format('%x')(new Date(d))
    });

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

    nv.utils.windowResize(chart.update);
    return chart;
});

data = [{
    "values": [{
        "x": 1025409600000 ,
            "y": 2
    }, {
        "x": 1028088000000 ,
            "y": 4
    }, {
        "x": 1030766400000 ,
            "y": 1
    }, {
        "x": 1033358400000 ,
            "y": 3
    }, {
        "x": 1036040400000  ,
            "y": 0
    }, {
        "x": 1038632400000  ,
            "y": 3
    }],
        "key": "Sine Wave",
}]
nv.addGraph(函数(){
var chart=nv.models.lineChart().margin({
前30名,
右:20,,
底数:50,
左:45
}).showLegend(true).tooltipContent(函数(键、y、e、图形){
在“+y+”处返回“+key+”+”“+e+”

” }); chart.xAxis.tickFormat(函数(d){ 返回d3.time.format(“%x”)(新日期(d)) }); d3.选择(“#线形图svg”) .基准(数据) .transition().持续时间(500) .电话(图表); nv.utils.windowResize(图表更新); 收益表; }); 数据=[{ “价值观”:[{ “x”:1025409600000, “y”:2 }, { “x”:1028088000000, “y”:4 }, { “x”:1030766400000, “y”:1 }, { “x”:1033358400000, “y”:3 }, { “x”:1036040400000, “y”:0 }, { “x”:103863240000, “y”:3 }], “键”:“正弦波”, }]

希望有帮助。

nvd3.js和d3.js是一样的吗?如果没有,请帮助我们了解nvd3.js。很抱歉更改它。my mystake:我不知道nvd3.js,我只是使用和喜欢d3.js。@Mausumi nvd3是一套可重复使用的图表,构建在d3.js之上。谢谢你的建议。你能告诉我日期格式吗。我必须如何表示它,让我说吧s 06-12-2012?