Порядковый масштаб D3.js только возвращает крайние значения

Question

Я новичок в d3.js. Я пытаюсь построить, чтобы получить порядковые значения по оси X, заменив значения даты. Я использую пример из http://bl.ocks.org/hopelessoptimism/b8ef4734abad1c644221. У меня трудности с использованием d3.js: Порядковая шкала.

Я тоже пробовал эту ссылку и другие альтернативы безуспешно.

данные 2 csv:

метка времени, AJU, BEL, BPS, BSB, BVB, КРО, ГКГ, РКУ, CNF, CWB, FLN, FOR, GIG, ГРУ, гинекология, МГС, IMP, IOS, JOI, JPA, БОД, МАБ, МАО , МСР, MCZ, NAT, НВТ, PMW, POA, ПВХ, РАО, RBR, ЗАП, СБД, SJP, SLZ, SSA, СТМ, то, UDI, ПДС, VIX A, 7,5,8,4,3,8,6,7,10,4,10,2,6,8,2,3,3,4,5,10,4,4,2,9, 8,9,5,7,7,7,10,4,6,9,5,3,8,5,4,3,8,3 В, 7,6,10,7,6,4,7,5,3,4,7,6,5,2,9,10,10,4,7,6,2,2,2,9, 3,4,7,9,2,4,8,10,2,3,9,2,2,2,2,10,4,9 С, 6,4,7,4,5,8,8,10,9,5,2,2,8,2,2,6,8,4,10,5,2,9,3,4, 6,3,9,2,2,4,2,10,9,5,6,4,10,10,4,3,7,10 D, 8,5,10,2,7,3,6,3,6,9,7,8,5,2,3,5,6,7,2,10,3,4,4,6, 9,3,4,7,2,2,3,7,4,8,6,7,3,8,5,9,7,8

ошибка изображения

Это часть кода линии:

       // maximum reviews
        var max_y = d3.max(data[2], function(d) {
            var max = 0;

            d3.values(d).forEach(function(i) {
              if (+i && (+i > max)) {
                max = +i;
              }
            });

            return max;
        });

        // Create y-axis scale mapping price -> pixels
        var measure_scale = d3.scale.linear()
            .range([height, 100])
            .domain([0, max_y])
			;

        // Create D3 axis object from measure_scale for the y-axis
        var measure_axis = d3.svg.axis()
            .scale(measure_scale)
            .orient("right");

        // Append SVG to page corresponding to the D3 y-axis
        d3.select('#chart').append('g')
              .attr('class', 'y axis')
              .attr("transform", "translate(" + width + " , -15)")
              .call(measure_axis);

        // add label to y-axis	
        d3.select(".y.axis")
              .append("text")
              .attr('class', 'label')
              .text("Daily")
              .attr("transform", "translate(45,110) rotate(90)");

        // create a function to draw the timeseries for each neighborhood
        var drawChart = function(field) {
          // remove the previous chart
          d3.select('#chart').select('.x.axis').remove();
          d3.select('#chart').select('path').remove();

          // update the title
          d3.select('#heading')
            .text(field);

          // remove missing values
          var neigh_data = data[2].filter(function(d) {
            return d[field];
          });

          // get min/max dates
          var time_extent = d3.extent(neigh_data, function(d){
            return d['timestamp'];
			 ;
          });
		  
          // Create x-axis scale mapping dates -> pixels
          var time_scale = d3.scale.ordinal()
              .range([0, width - margin])
		   // .rangePoints([0, width - margin])
           // .range([0, width - margin])
		   // .rangeBands([0, width], .1)
			  .domain(time_extent)
			  ;

			  
          // Create D3 axis object from time_scale for the x-axis
          var time_axis = d3.svg.axis()
              .scale(time_scale)
		   // .ticks(10)
           // .tickFormat(d3.format(""))
		   // .tickFormat(d3.time.format("%b '%y"))
		   ;			  
			  
          // Append SVG to page corresponding to the D3 x-axis
          d3.select('#chart').append('g')
              .attr('class', 'x axis')
              .attr('transform', "translate(" + margin + ',' + (height - 15) + ")")
              .call(time_axis)
          .selectAll("text")
            .attr("y", 0)
            .attr("x", 9)
            .attr("dy", ".35em")
            .attr("transform", "rotate(90)")
            .style("text-anchor", "start");

          // define the values to map for x and y position of the line
          var line = d3.svg.line()
                       .x(function(d) { return time_scale(d['timestamp']); })
                       .y(function(d) { return measure_scale(+d[field]); });
					   
					 
					   
					   ;

          // append a SVG path that corresponds to the line chart
          d3.select('#chart').append("path")
            .datum(neigh_data)
            .attr("class", "line")
            .attr("d", line)
            .attr('transform', 'translate(' + margin + ', -15)');
        };

        drawChart(field);

        // create a callback for the neighborhood hover
        var mover = function(d) {
          var neigh = d.iata;
          d3.select('#map path.' + neigh).style('fill', '#9999ff');

          drawChart(neigh);
        };

Может кто-нибудь сказать мне, что я делаю не так?