lineChart xAxis 잘못된 날짜

Question

내 lineChart가 일요일 대신 xAxis에서 월을 표시하는 이유는 무엇입니까? 도움을

감사합니다 =) 여기

내 코드입니다 :

VAR hitslineChart = dc.lineChart ("# 차트 - 라인 hitsperday");

var data = [ 
     {date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100}, 
     {date: "12/28/2012", http_404: 2, http_200: 10, http_302: 100}, 
     {date: "12/29/2012", http_404: 1, http_200: 300, http_302: 200}, 
     {date: "12/30/2012", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "12/31/2012", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/01/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/02/2013", http_404: 1, http_200: 10, http_302: 1}, 
     {date: "01/03/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/04/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/05/2013", http_404: 2, http_200: 90, http_302: 0}, 
     {date: "01/06/2013", http_404: 2, http_200: 200, http_302: 1}, 
     {date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100} 
     ]; 

var ndx = crossfilter(data); 
var parseDate = d3.time.format("%m/%d/%Y").parse; 
data.forEach(function(d) { 
    d.date = Date.parse(d.date); 
    d.total= d.http_404+d.http_200+d.http_302; 
}); 

var dateDim = ndx.dimension(function(d) {return d.date;}); 
var hits = dateDim.group().reduceSum(function(d) {return d.total;}); 
var minDate = dateDim.bottom(1)[0].date; 
var maxDate = dateDim.top(1)[0].date; 

hitslineChart 
    .width(500).height(200) 
    .dimension(dateDim) 
    .group(hits) 
    .x(d3.time.scale().domain([minDate,maxDate])) 
    .xAxis().ticks(5) 
    .yAxisLabel("Hits per day"); 

dc.renderAll();![the result][1] 

x 축에 대한 결과는 다음과 같습니다 Thu27 - Fri28-Sat29-Dec30-Mon31-2013-Wed02-Thu03-Fri04-Sat05-Jan06 ...

Answer 1

1) 구문 분석 할 것이다 날짜 포맷을 사용하여 수신 데이터 :

d.date = Date.parse(d.date); \\ Old 
d.date = parseDate.parse(d.date); \\ New 

이 명시 적으로 입력 데이터의 형식과 일치합니다.

2) 데이터를 일 단위로 그룹화하려면 해당 단위를 차원으로 지정해야합니다. d3.time.day 도우미 메서드는 제공된 데이터에서 시간을 00:00:00으로 설정합니다. (일을 당신은 하루에 포인트를할지 여부 그것은 분명하지 않다

var dateDim = ndx.dimension(function(d) {return d.date;}); \\old 
var dateDim = ndx.dimension(function(d) {return d3.time.day(d.date);}); \\ new 

(등 1 월 1 일 1월 2일 월 3 일) 또는 일주일의 하루 지점이 당신이 원하는 함께 같은 데이터 그룹을 만든다 월, 화). d3.time.day 메서드는 달력 날짜별로 날짜를 그룹화합니다.

3) 다음과 같은 방법을 사용하여 진드기 형식을 지정할 수 있습니다 서식 https://github.com/mbostock/d3/wiki/Time-Formatting에서 확인할 수 있습니다 시간에 대해

.xAxis().tickFormat(function(v) {return displayDate(v)}); 

세부 사항을. 난이 도움이되기를 바랍니다 http://jsfiddle.net/djmartin_umich/6V4Ey/

:

는 여기에 x 축에 요일을 표시하는 코드를 적응 jsfiddle입니다! -DJ