2016-10-17 2 views
2

동적 데이터로 히트 맵 달력 (http://cal-heatmap.com/)을 채우려고합니다. 그래서 파일에서 다른 날짜를 가져와 달력에 필요한 키 - 값 쌍을 만들기 위해 밀리 초로 변환합니다.Cal-HeatMap 데이터

이 같은이 일을 해요 : 나는 dataJSON의 결과를 인쇄 할 경우

var aux = {}; 
var dataJSON = {}; 
for(var i=0; i<activity.length; i++) { 
    var date = new Date(activity[i].date); // Date of activity 
    var ms = date.getTime();    // Date Conversion 
    aux[ms] = 1;       // Pair "Key-Value" for calendar data 
    dataJSON = JSON.stringify(aux);   // Convert to JSON format 
} 

, 나는 (분명히)받을 올바른 대상 :

{"1426204800000":1,"1426464000000":1,"1426636800000":1,"1426550400000":1,"1425945600000":1,"1426118400000":1,"1426032000000":1,"1432771200000":1,"1432857600000":1,"1432598400000":1,"1432684800000":1,"1432080000000":1,"1432166400000":1,"1425513600000":1,"1435708800000":1,"1439164800000":1,"1425427200000":1,"1432512000000":1,"1439251200000":1,"1425340800000":1,"1432252800000":1,"1439337600000":1,"1425254400000":1,"1425859200000":1,"1425686400000":1,"1435881600000":1,"1425600000000":1,"1435795200000":1,"1436400000000":1,"1436313600000":1,"1436227200000":1,"1436140800000":1,"1435536000000":1,"1434931200000":1,"1427673600000":1,"1434758400000":1,"1435276800000":1,"1427760000000":1,"1435190400000":1,"1435104000000":1,"1435017600000":1,"1427241600000":1,"1434672000000":1,"1427155200000":1,"1434585600000":1,"1427414400000":1,"1434499200000":1,"1427328000000":1,"1434412800000":1,"1433980800000":1,"1433894400000":1,"1434326400000":1,"1426809600000":1,"1427068800000":1,"1427846400000":1,"1434067200000":1,"1428451200000":1,"1438646400000":1,"1428364800000":1,"1438560000000":1,"1428278400000":1,"1438387200000":1,"1438905600000":1,"1438819200000":1,"1428537600000":1,"1438732800000":1,"1430092800000":1,"1430179200000":1,"1437177600000":1,"1437091200000":1,"1430265600000":1,"1429488000000":1,"1436486400000":1,"1429747200000":1,"1437004800000":1,"1429833600000":1,"1436918400000":1,"1429574400000":1,"1436832000000":1,"1429660800000":1,"1436745600000":1,"1429142400000":1,"1429228800000":1,"1428969600000":1,"1429056000000":1,"1435622400000":1,"1428883200000":1,"1428624000000":1,"1428710400000":1,"1430956800000":1,"1430870400000":1,"1430784000000":1,"1430697600000":1,"1431043200000":1,"1424736000000":1,"1424649600000":1,"1431907200000":1,"1424908800000":1,"1431648000000":1,"1424822400000":1,"1424995200000":1,"1431993600000":1,"1438300800000":1,"1431475200000":1,"1431561600000":1,"1431302400000":1,"1424476800000":1,"1431388800000":1,"1423958400000":1,"1438128000000":1,"1423872000000":1,"1438041600000":1,"1424131200000":1,"1424304000000":1,"1424217600000":1,"1430352000000":1,"1437609600000":1,"1437523200000":1,"1437436800000":1,"1437350400000":1,"1423180800000":1,"1433203200000":1,"1437955200000":1,"1433116800000":1,"1423612800000":1,"1423526400000":1,"1437696000000":1,"1433376000000":1,"1433289600000":1,"1438214400000":1,"1433808000000":1,"1433721600000":1}; 

을 그러나, 나는 결과를 볼 수 없습니다 달력에. 한편

var dataJSON = {"1420498800":2,"1420585200":4,"1420671600":2,"1420758000":1,"1421103600":2,"1421190000":1,"1421276400":1,"1421362800":1,"1421622000":1,"1421708400":1,"1422226800":1,"1422313200":1,"1422399600":2,"1422486000":1,"1422572400":1,"1423695600":3,"1424127600":2,"1424214000":1,"1424300400":3,"1424386800":1,"1424646000":2,"1424732400":1,"1424818800":2,"1424905200":2,"1424991600":1,"1425337200":1,"1425855600":4,"1426201200":2,"1426460400":2,"1426546800":1,"1426633200":2,"1426719600":1,"1426806000":1,"1427065200":1,"1427151600":1,"1427238000":2,"1427324400":1,"1427670000":2,"1428361200":2,"1428447600":2,"1428534000":3,"1428620400":3,"1428966000":2,"1429138800":2,"1429225200":1,"1429484400":2,"1429570800":1,"1429657200":2,"1429743600":2,"1429830000":3}; 

, 나는에서 다음 GET 오류를 받고 있어요 : 나는 놀랍게도 작동이 정적 데이터로 시도하고, 어쨌든

var cal = new CalHeatMap(); 
cal.init({ 
    itemSelector: "#cal-heatmap", 
    domain: "month", 
    subDomain: "x_day", 
    start: new Date(init), 
    data: dataJSON 
}); 

:이 달력의 구성입니다 d3.js :

GET http://localhost:9000/%7B%221426204800000%22:2,%2...2,%221433808000000%22:2,%221433721600000%22:2%7D 

Aborted 

희망 사항을 미리 알려 주시면 감사하겠습니다.

답변

0

데이터 변환은 "afterLoadData (data)"함수를 통해 수행해야합니다. 그럼, 내 예 :

var parserData = function (data) { 
    var dataJSON = {}; 

    for(var i=0; i<data.length; i++) { 
    var date = new Date(data[i].date); // Date of activity 
    var sec = date.getTime()/1000; // Convert to sec 

    // Pair "Key-Value" for calendar data 
    if(dataJSON[sec]) { 
     dataJSON[sec]++; 
    } else { 
     dataJSON[sec] = 1; 
    } 
    } 

    return dataJSON; 
} 

var cal = new CalHeatMap(); 
cal.init({ 
    itemSelector: "#cal-heatmap", 
    domain: "month", 
    subDomain: "x_day", 
    data: activity_sorted_by_date, // Dates Array 
    afterLoadData: parserData  // Parser function 
});