9

Google의 시각화 API를 사용하여 google.visualization.data.group을 사용하여 원시 데이터를 기반으로하는 하위 테이블을 만듭니다. 내 원시 데이터는 {v : "US", f : "United States"}의 트릭을 사용하여 값 이외의 값을 표시하지만 집계 함수를 사용하면 서식이 "US"부분 만 남기고 제거됩니다.Google 시각화 API에서 그룹화 기준 그룹화를 사용하여 유지

원래 서식을 유지할 수있는 방법이 있습니까, 아니면 그룹 집계를 사용하여 만든 DataTable에 쉽게 다시 추가 할 수 있습니까?

샘플 데이터 :

[2010, {v:"MA", f:"Morocco"}, {v:"002", f:"Africa"}, {v:"002", f:"Northern Africa"}, 21.12724], 
[2010, {v:"AW", f:"Aruba"}, {v:"019", f:"Americas "}, {v:"019", f:"Caribbean"}, 0.98], 
[2010, {v:"AF", f:"Afghanistan"}, {v:"142", f:"Asia"}, {v:"142", f:"Southern Asia"}, 0.9861], 
[2010, {v:"AO", f:"Angola"}, {v:"002", f:"Africa"}, {v:"002", f:"Middle Africa"}, 5.11774], 

집계 기능 :

var countryData = google.visualization.data.group(
    rawData, 
    [0, 1], 
    [{'column': 4, 'aggregation': google.visualization.data.sum, 'type': 'number'}] 
); 

편집 : 보장이 없기 때문에 더 생각에

, 그것은 형식 그룹에 아마 불가능 그 형식 각 값은 일관성이 있습니다. 이를 염두에두고, 내 데이터의 각 열에 형식을 추가하는 함수를 작성하는 것이 더 좋을 수도 있고 가능할 수도 있습니다. 따라서 질문은 "도대체 어떻게 그 일을합니까?"

필자는 원시 데이터를 포맷되지 않은 값으로 작성하지 않고 각 값의 형식을 조회하기위한 추가 테이블을 작성하지 않을 것입니다. 그러면 추가 테이블이 2 개 필요합니다 (한 행은 28 행, 한 행은 240 행). 그리고 두 개의 함수를 작성하여 그룹화 된 테이블의 각 값을 검토합니다 (30 년 이상의 데이터, 수천 라인을 의미) 값을 추가합니다.

정말 복잡한 솔루션처럼 보입니다.

수정 자 함수로이를 수행 할 수있는 방법이 있습니까? 테이블의 각 값을 {v : "US", f : "United States"} 형식의 객체로 반환하는 함수를 작성할 수 있습니까? 아니면 원래 테이블에서 적절한 값을 찾아 해당 포맷을 채택 할 수있는 컬럼 포맷터를 작성하는 쉬운 방법이 있습니까? 어느 것이 나를 위해 (누가 그것을 써야 하는가), 그리고 사용자 (누가 그것을로드해야 하는가?) 모두 최소한의 두통을 일으킬 것인가?

편집 2 :

내가 이런 걸 사용하여 새 테이블의 포맷을 만들 수있을 것 같습니다

function (dt, row) { 
    return { 
     v: (dt.getValue(row, 1)/1000000), 
     f: (dt.getValue(row, 1)/1000000) + 'M' 
    } 
} 

을하지만 문제는 내가 번호를 다루고 있지 않다 때문에 것이된다 형식을 사용하려면 값을 가져 와서 조회 테이블에서 조회 한 다음 적절한 형식을 반환하는 조회 테이블을 만들어야합니다. 또한 수천 줄의 줄 단위로 전체 표를 반복해야 할 것처럼 보입니다.

나는 무차별 대입 루핑과 값을 지정하지 않으면 이것을 할 수있는 쉬운 방법이 없다고 상상할 수 없다.

편집 3 :

그래서 나는 까다로운 뭔가를 시도했다. 각 행을 값/형식으로 설정하는 대신 값/형식 부분을 문자열로 만든 다음 그룹화 한 후 개체를 평가하기 위해 eval()을 사용했습니다. 이것은 훌륭하게 작동했습니다.여기

[2010, "{v: 'MA', f: 'Morocco'}", 21.13], 
[2010, "{v: 'AW', f: 'Aruba'}", 0.98], 
[2010, "{v: 'AF', f: 'Afghanistan'}", 0.99], 
[2010, "{v: 'AO', f: 'Angola'}", 5.12], 

새로운 코드 : 여기서 데이터는

var countryCount = countryData.getColumnRange(0).count; 

    for (var i = 0; i <= countryCount; i++) { 
    countryData.setValue(i, 1, eval('(' + countryData.getValue(i,1) + ')')); 
    }; 

문제는 그 이것은 구글 DataTable을하기 위해서는 {V 표시 할 때 I 출력 'AE', F를 ' 제대로 평가와 결과를 확인한다는 사실에도 불구하고 아랍 에미리트는 '} 나 제공 :

>>> eval('(' + countryData.getValue(i,1) + ')') 
Object v="AE" f="United Arab Emirates" 

는 그래서 어떻게 내가 잘못 여기서 뭐하는 거지?

답변

1

나는이 문제를 직접 다루었습니다. 필자는 수정자를 사용하여 원래의 dataTable을 사용하여 형식화 된 값으로 변경하여 형식화 된 값을 찾습니다. 이것은 대단히 효율적은 아니지만 작동하며 컴퓨터가 빠릅니다.

var countryData = google.visualization.data.group(
    rawData, 
    [ 
    { 
     'column': 0, 
     'modifier': function(value) { return getFormatForValue(rawData, 0, value); }, 
     'type': 'string' 
    }, 
    { 
     'column': 1, 
     'modifier': function(value) { return getFormatForValue(rawData, 1, value); }, 
     'type': 'string' 
    } 
    ], 
    [{'column': 4, 'aggregation': google.visualization.data.sum, 'type': 'number'}] 
); 

업데이트 :

function getFormatForValue(dataTable, column, value) { 

    // we need to spin through column in the dataTable looking 
    // for the matching value and then return the formatted value 
    var rowcount = dataTable.getNumberOfRows(); 
    for (var i=0; i<rowcount; i++) { 
     if (dataTable.getValue(i, column) === value) { 

      // we found it, this will look much better 
      return dataTable.getFormattedValue(i, column);  
     } 
    } 

    // better than nothing 
    return value; 
} 

그런 다음 원래의 그룹 통화를 변경, 수정 자에 그 전화 :

먼저 조회 기능을 만들 당신이 값과 형식의 값을 필요 보인다 보존. 내 원형 차트를 표시하는 경우 원래 값을 유지하는 데 신경을 쓰지 않습니다. 나는 이것이 당신을 위해 작동하지 않을 것 같아요,하지만 내 대답처럼 간단한 사건을 가지고있는 다른 사람들을 위해이 대답을 남겨 둘 것입니다.

나는 여기에 몇 분을 더 보냈다. 원래의 셀 값을 유지하면서 형식화 된 값을 복사하는 대안이있다.

function copyFormattedValues(oldDataTable, oldColumn, newDataTable, newColumn) { 

    var rowcount = newDataTable.getNumberOfRows(); 
    for (var i=0; i<rowcount; i++) { 
     var value = newDataTable.getValue(i, newColumn); 
     var formatted = getFormatForValue(oldDataTable, oldColumn, value); 
     newDataTable.setFormattedValue(i, newColumn, formatted); 
    } 

} 

그런 다음 귀하의 경우, 복사 할 각 열에 대해 한 번 전화 :

는 검색 기능을 사용하는 복사 기능을 만듭니다.

copyFormattedValues(rawData, 0, countryData, 0); 
copyFormattedValues(rawData, 1, countryData, 1); 

원본과 대상 열은 동일하지만 경우에 따라 다를 수 있습니다.

물론 이상적으로 모든 것이 자동으로 발생했을 것입니다.

4

좋아, 나는 이것을 알아 냈다. (얼마나 불쾌하게 복잡한 지).

나는 새로운 접근 방식을 시도했다. 내 데이터를 다시 포맷 한 다음 해당 문자열 내의 구분선을 기반으로 값/형식을 반환하는 함수를 만들었습니다. 그래서 내 데이터는 이제 다음과 같습니다

[2010, "'MA'|'Morocco'", 21.13], 
[2010, "'AW'|'Aruba'", 0.98], 
[2010, "'AF'|'Afghanistan'", 0.99], 
[2010, "'AO'|'Angola'", 5.12], 
그때 열 1 디바이더의 위치를 ​​얻기 위해 이것을 사용

:

function splitFormat(dividerLocation, stringToSplit) { 
    // alert("entered splitFormat Function"); 
    var stringValue = ""; 
    var formatValue = ""; 
    stringValue = stringToSplit.substring(0, dividerLocation); 
    formatValue = stringToSplit.substring(dividerLocation + 1) 
    alert("v: " + stringValue + ", f: " + formatValue); 
    return { 
     v: stringValue, 
     f: formatValue 
    } 
     } 
: 문자열을 분할

var countryCount = countryData.getNumberOfRows(); 

for (var i = 0; i <= countryCount; i++) { 
    var stringToSplit = countryData.getValue(i,1); 
    var dividerLocation = stringToSplit.indexOf("|"); 
    alert("Divider: " + dividerLocation + ", String: " + stringToSplit); 
    countryData.setValue(i, 1, splitFormat(dividerLocation, stringToSplit)); 
}; 

을 그리고 나는이 기능을 사용

문제는 '데이터'열 1을 '문자열'로 정의했지만 방화 광에서 splitFormat() 함수에서 반환 된 객체가 객체라고 알려줍니다. 및 F : 나는 원래 AV와 데이터 테이블 설정하더라도

"Error: Type mismatch. Value [object Object] does not match type string in column index 1 (table.I.js,137)" 

문제 : 구성 요소를 지르고 나에게 다음과 같은 오 - 그래서 - 유용한 조언을 제공, 그것은, 반환 된 배열 객체의 값을 수락하지 않습니다 {v :, f :} 구문을 사용하여 DataTable을 정의 할 수는 있지만 해당 열의 값이 문자열로 설정되어 있기 때문에 해당 구문을 다시 테이블에 반환 할 수 없다는 것입니다. 이 대용량 데이터 세트에 대한 비트를 많이에도 불구하고,

function drawVisualization() { 
    var countryTable = new google.visualization.Table(document.getElementById('table')); 

    var countryCount = countryData.getNumberOfRows() - 1; 

    for (var i = 0; i <= countryCount; i++) { 
     var stringToSplit = countryData.getValue(i,1); 
     var dividerLocation = stringToSplit.indexOf("|"); 
     var stringValue = stringToSplit.substring(0, dividerLocation); 
     var stringFormat = stringToSplit.substring(dividerLocation + 1); 
     countryData.setValue(i, 1, stringValue); 
     countryData.setFormattedValue(i, 1, stringFormat); 
    }; 

이 제대로 모두 나에게 적절한 값을 준 대신 나는 문제를 해결하기 위해 DataTable의의 "setFormattedValue"속성을 사용했다. 누구든지이 일을하는 더 쉬운 방법을 안다면, 나는 그걸 듣게되어 기쁘다.