jiahuang / d3-timeline

Simple JS timeline plugin for d3
1.04k stars 281 forks source link

d3.time.days not working #49

Closed MSCAU closed 9 years ago

MSCAU commented 9 years ago

I want to show a series of points (circles) across several months. I can't get a scale going with days instead of hours. All your examples use hours. Please explain how to achieve ticks in the "23 Feb" format.

At the moment I have this:

    var chart = d3.timeline()
        .tickFormat({
            format: d3.time.format("%e %b"),
            tickTime: d3.time.days,
            tickInterval: 1,
            tickSize: 20
        })
      .display("circle");

But I only get a blank tick on the left and right of my axis with the following test data:

  var testData = [
    {times: [
        {"starting_time": 1431248400, "ending_time": 1431252000},
        {"starting_time": 1431338400, "ending_time": 1431342000},
        {"starting_time": 1431680400, "ending_time": 1431684000}
    ]},
    {times: [
        {"starting_time": 1432285200, "ending_time": 1432292400},
        {"starting_time": 1433156400, "ending_time": 1433160000},
        {"starting_time": 1433332800, "ending_time": 1433340000}
    ]},
    {times: [
        {"starting_time": 1430229600, "ending_time": 1430236800},
        {"starting_time": 1430305200, "ending_time": 1430312400},
        {"starting_time": 1431874800, "ending_time": 1431885600}
    ]}
  ];

Thanks

jiahuang commented 9 years ago

Your timeline data does not span more than a day.

var circledata = [
        {times: [
            {"starting_time": 1431248400, "ending_time": 1431252000},
            {"starting_time": 1431338400, "ending_time": 1431342000},
            {"starting_time": 1431680400, "ending_time": 1431684000}
        ]},
        {times: [
            {"starting_time": 1432285200, "ending_time": 1432292400},
            {"starting_time": 1433156400, "ending_time": 1433160000},
            {"starting_time": 1433332800, "ending_time": 1433340000}
        ]},
        {times: [
            {"starting_time": 1430229600, "ending_time": 1430236800},
            {"starting_time": 1430305200, "ending_time": 1430312400},
            {"starting_time": 1431874800, "ending_time": 1431885600}
        ]},
        {times: [
            {"starting_time": 1533988480, "ending_time": 1533989480}
        ]}
      ];

image