[Line Chart] How to create an ordinal/discrete xAxis? #29

lestopher opened this Issue Jan 9, 2013 · 7 comments


None yet

8 participants


I thought that I could set scale of the axis by doing the following:

  var chart;
  var xScale = d3.scale.ordinal()
                  .domain(_.map(seriesDef[0].values, function(d) {
                    return d.x;
                  // .rangeBands([0, seriesDef[0].values.length - 1]);

  nv.addGraph(function() {
    chart = nv.models.lineChart();

    chart.x(function(d, i) { return String(d.x); })
         .y(function(d) { return d.y; });





    return chart;

Here's what seriesDef looks like:

  "area": false,
  "key": "Total Amount By Term",
        "x": "199520",
        "y": 1119707
        "x": "199510",
        "y": 1253042
        "x": "199610",
        "y":  868849
        "x": "199540",
        "y": 50
        "x": "199430",
        "y":  6803
        "x": "199810",
        "y":  1850
        "x": "200820",
        "y":  30

The xAxis still ends up looking like an interval

Any suggestions?


I'm having a similar problem, I want an x axis with a d3.time.scale() scale, I thought I could do what you've done to set the axis scale but it doesn't work.

@arlm arlm pushed a commit to arlm/nvd3 that referenced this issue Feb 5, 2013
@bobmonteverde bobmonteverde Issue #29 removing deprected bar example 5beda82

Any update on the original question?


Similar question here. Eventually posted a question on SO: http://stackoverflow.com/questions/17296938/nvd3-scatter-plot-with-ordinal-scale

ccarse commented Oct 16, 2013

Anyone know how to do this?


Many thanks to @dgorissen for the work-around. Just mentioning that this would be ideal to support within NVD3 core for future releases.

robinfhu commented Feb 9, 2015

Don't use an ordinal scale.

Instead, set chart.x(function(d,i){ return i;})
And then in the chart.xAxis.tickFormat function, return the label you want to show depending on the index.

@robinfhu robinfhu closed this Feb 9, 2015

@robinfhu worked for me thanx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment