C3js, keep xx axis values ​​and remove points

I have this x-axis chart that loads from almost a thousand time points.

These points are unattractive.

enter image description here

I could hide the x axis, but I want the dates to appear below them, minus the timestamps.

Is there a way to remove the marks while leaving time. (Please ignore the x-axis numbers. I know they are wrong).

Preferably, I would like it to be a category line chart and eliminate timeouts entirely.

Code, removed data for simplicity -

var chart = c3.generate({
        padding: {
            right: 30
        },
        data: {
          x: 'x',
          columns: [
                ['x',1324252800,1324339200],
                ['OECD Crude Oil Price',102.91,105.05]         
          ],
          type: 'line',
          onclick: function (d, element) { console.log("onclick", d, element); },
          onmouseover: function (d) { console.log("onmouseover", d); },
          onmouseout: function (d) { console.log("onmouseout", d); },
          order: null
        },
        point: {
            show: false
        },
        axis: {
          x: {

            //show:false, 
            //I don't want this, I want to see the dates

            type: 'timeseries',
            tick: {
                culling: {
                    max: 3 
                },
                multiline: false
            }
          },
          y: {
            tick: {
                format: function (d) { return  "$ " + d ; }
            }
          }
        },  
      });

      

Thank you in advance

+3


source to share


1 answer


Okay, wow, stupid me. I found this solution earlier.

Here's my answer just two weeks ago.

Facepalm.



This is what the diagram looks like now, with the desired effect -

enter image description here

+2


source







All Articles