Как установить значения оси x в d3 График Javascript?

Question

Я использую библиотеку d3 JS для построения графиков. Он работает отлично, но я застрял на странной проблеме, с которой я боролся в течение часа - я не могу установить значения оси x. Вот график (я добавил предупреждение, которое покажет вам формат данных):

http://jovansfreelance.com/bikestats/d3/tipsy.php

Я хочу, чтобы ось х, чтобы показать года, но по какой-то причине, что я не могу увидеть где-нибудь в код, он использует десятичные значения вместо этого, поэтому вместо 2006 он имеет .006 - я понятия не имею, где это происходит, например, он извлекает первую цифру и делит остальные на 100!

Если кто-то может указать мне на строки кода, которые делают это, все будет хорошо, я могу взять его оттуда.

Answer 1

Как отмечалось в другом ответе, лучший способ обработки значений времени - явно использовать временные масштабы. Однако для достижения того, что вы хотите, достаточно указать формат для оси x явно. То есть,

var xAxis = d3.svg.axis() 
     .scale(x) 
     .tickSize(h - margin * 2) 
     .tickPadding(10) 
     .ticks(7) 

добавить

.tickFormat(d3.format("d")); 

Answer 2

Может быть связано с этим parseDate = d3.time.format("%Y") not working

Если да, то вам, возможно, потребуется

d3.svg.axis() 
    .scale(x) 
    .tickSize(h - margin * 2).tickPadding(10).ticks(7) 
    .tickFormat(function(d) { return d.toString(); }); // force the date value into a string 

или, если вам нужен разобрать дату

.tickFormat(function(d) { 
     var fmt = d3.time.format("%Y"); 
     return format.parse(d).toString() 
    });