Need help : NVD3 + ZoomData axis format

Question

I am currently using ZoomData for my vizualisation needs. I also use NVD3 library to add a LineChart to Zoomdata, since there is not a template for what i need. With absolutely no documentation whatsoever, i am in deep trouble. :)

I watched the ZoomData videos on Youtube. Therefore i understood the controller thing for rendering custom charts. I have a data file that i read, with dates (X Axis) and values for these dates (Y Axis).

My problem is i can't seem to get the dates to be rendered properly. My line chart does not show in some cases. However, it works fine with simple data set (like an array of numbers). Here is my code so far :

var svg = d3.select(controller.element).append("svg")

.attr("width", "100%")
.attr("height", "100%");
var format = d3.time.format("%Y-%m-%d");
var chart;

nv.addGraph(function() {
    CreateLabels();
  chart = nv.models.lineChart()
  .options({
    margin: {left: 100, bottom: 100},
  //  x: function(d,i) { return i},
    showXAxis: true,
    showYAxis: true,
    transitionDuration: 250
  })
  ;

  chart.x(function(d){return d.group});
  chart.y(function(d,i){return d.current.count});

Now i need help on data format for the axis. I have dates going from 2014 to 2015, and what i see on the X axis is : 2014.2 2014.4 2014.6 .... 2015. I don't understand what is going on here, and my NVD3 line chart is not showing properly. Thanks for the read, hope this is clear enough.

Finally, my ZoomData Update function, where i get my data.

    controller.update = function(data)
{
    var newData = [{key:"Test Line", values: data }];

    d3.select(controller.element).select("svg")
    .datum(newData)
    .call(chart)
    ;    
}

Could you put you code on a [Fiddle](http://jsfiddle.net/), so someone can have a look. — shabeer90, Jul 08 '14 at 09:26

score 0 · Accepted Answer · edited May 23 '17 at 12:05

0

Are you using Zoomdata's newest release, v1.4.0? You can download it for free from our website: http://www.zoomdata.com/download

We're also hard at work improving our documentation, you can see it here: http://zoomdata.github.io/ZoomdataJS-docs/

To answer your question, I think that you are sending data to NVD3 as timestamps, but it expects Javascript Date Objects. Here's an answer that is similar: https://stackoverflow.com/a/14060684

edited May 23 '17 at 12:05

Community

1
1

answered Jul 08 '14 at 18:48

wlindner

850
1
9
16

I still get : Jan 01, Jan 01, Jan 01 ... though. Looks like my d.group (representing the dates) is wrong, but i can clearly see in debug mode that d.group contains correct date values. – Griga Jul 10 '14 at 07:37

Need help : NVD3 + ZoomData axis format

1 Answers1