2014-12-18 3 views
1

저는 Crossfilter를 시작하면서 일부 감소 함수의 작동 방식을 이해하려고합니다. 나는 그것이 나에게 의미가 있다고 생각하고 샘플 데이터를 기반으로 한 작은 예제를 만들려고 노력했지만 제대로 작동하지 않는 것 같습니다.여러 차원을 합하는 방법

내가하려는 것은 입력란 (예 : 유형)을 기반으로 합계 (예 : 합계 및 팁)를 얻기 위해 여러 열을 합계하는 것입니다. 이제는 여러 열을 사용하여이 작업을 수행하는 방법을 알지 못하지만 사실 내가 찾은 방법은 단일 열로도 작업하지 않는 것입니다.

짧은 스 니펫을 작성했는데 출력에서 ​​예상 한 결과는 tab, visacash에 대한 합계가 3 행이었습니다.

var payments = crossfilter([ 
 
    {date: "2011-11-14T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"}, 
 
    {date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab"}, 
 
    {date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa"}, 
 
    {date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "cash"}, 
 
    {date: "2011-11-14T16:58:03Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "tab"}, 
 
    {date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: 0, type: "cash"}, 
 
    {date: "2011-11-14T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "visa"} 
 
]); 
 

 
var typeDimension = payments.dimension(function(d) { return d.type; }); 
 
typeDimension.group().reduceSum(function(d) { return d.total; }); 
 

 
$(typeDimension.top(Infinity)).each(function(d) { 
 
    $('#tgt').append("<div>" + JSON.stringify(this) + "</div>"); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.11/crossfilter.min.js"></script> 
 
<div id="tgt"> 
 
</div>

편집

은 조금 더 내 사용 사례를 설명하기 - 나는 실제로 일부 다른 데이터, 다음과 같은 형식의 약 10,000 행이있어 :

{ athlete: "Michael Phelps",age:23,country:"United States",year:2008,date: 39684,sport:"Swimming",gold:8,silver:0,bronze:0,total: 8 }, 
{ athlete: "Michael Phelps",age:19,country:"United States",year:2004,date: 38228,sport:"Swimming",gold:6,silver:0,bronze:2,total: 8 }, 
{ athlete: "Michael Phelps",age:27,country:"United States",year:2012,date: 41133,sport:"Swimming",gold:4,silver:2,bronze:0,total: 6 }, 

내가 원하는 것은 수년에 걸쳐 청동,은 및 금 값을 그룹화하는 것입니다. 그래서 나는 그들을 올바르게 표시 할 수 있도록 매년 주어진 메달의 총 수를 볼 수 있습니다. 현재 사용하고있는 그래프 라이브러리는 그룹화되지 않았을 때 데이터를 처리 할 수 ​​없습니다. 다음 그림은 각 스택을 구성하는 작은 음영 처리 된 사각형이 수백 개 있기 때문에 각 막대의 음영 처리 된 밴드로이를 보여줍니다.

enter image description here

답변

1

또한 CrossFilter에 대한 대안으로 Alasql 자바 스크립트 SQL 라이브러리를 사용할 수 있습니다 (물론, CrossFilter의 사용하면 당신의 porject 중요하지 않은 경우) 여러 차원을 요약합니다.

var data = [ 
    {date: "2011-11-14T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"}, 
    {date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab"}]; 

var res = alasql('SELECT type, SUM(quantity) quantity AS , SUM(total) AS total, \ 
      SUM(tip) AS tip FROM ? GROUP BY type', [data]); 

이 샘플을 사용해보십시오. at jsFiddle. 또는 Alasql+d3.js integration의 다른 예는 여러 차원의 합계입니다.

그런데 Alasql은 CrossFilter보다 빠릅니다 (jsPerf test 참조).

죄송합니다. 'CrossFilter가 아닌'답변입니다.

+0

실제로 유용합니다. 현재 크로스 필터에 국한되지 않고 연결되어있는 대시 보드를 만들 수있는 무언가가 필요합니다. 나는 이것에 대해서도 고마워 할 것이다. 고마워. – Ian

+0

성능에 대해 언급 한 내용은 사실 훨씬 더 큰 데이터 세트를 사용하고 있습니다. 게시 된 샘플은 크로스 필터 예제입니다. 실제로 여기에서 데이터를 사용하고 있습니다. http://www.tableausoftware.com/public/sites/default/files/OlympicAthletes_0.xlsx – Ian

+0

오늘 밤 확인해 보겠습니다. XLSX에서 데이터를로드하려면 다음을 사용할 수 있습니다. var res = alasql ("SELECT 국가, SUM ([Gold 메달]) AS [Gold 메달] FROM XLSX ('data.xlsx', {headers : true, sheetid : 'OlympicAtletes'}) 국가 별 GROUP "); XLSX 파일을 읽으려면 XLSX.js 라이브러리 (https://github.com/SheetJS/js-xlsx)를 파일에 추가해야합니다. – agershun