2017-03-15 3 views
1

Um Daten in highcharts.js anzuzeigen muss ich folgende Daten wenden:Gruppenwerte mit dem gleichen Schlüssel in einem Array von Objekten

"personas": [ 
     { 
     "category":"Persona1", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.5, 
     "weekaverage":1.33333333333333, 
     "monthaverage":1.53571428571429 
     }, 
     { 
     "category":"Persona2", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.146477031224456, 
     "weekaverage":0.194758246723904, 
     "monthaverage":0.601273296708939 
     }, 
     { 
     "category":"Persona3", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":1.25559947299078, 
     "weekaverage":1.43618513323983, 
     "monthaverage":0.998426393184655 
     }, 
     { 
     "category":"Persona4", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.799332962757087, 
     "weekaverage":0.923262727610554, 
     "monthaverage":0.769477297163179 
     }, 
     { 
     "category":"Persona5", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.669041769041769, 
     "weekaverage":0.67394482002558, 
     "monthaverage":0.670944920469891 
     }, 
     { 
     "category":"Persona6", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.656381486676017, 
     "weekaverage":0.722973507315144, 
     "monthaverage":0.69689774371321 
     }, 
     { 
     "category":"Persona7", 
     "month":"6", 
     "week":"24", 
     "day":"18", 
     "dayaverage":0.540495407737267, 
     "weekaverage":0.576413277444205, 
     "monthaverage":0.693495281755596 
     } 
    ] 

in dieses Format:

[ 
    { 
     name: 'dayaverage', 
     data: [0.5, 0.146477031224456, 1.25559947299078, 0.799332962757087, 0.669041769041769, 0.656381486676017, 0.540495407737267] 
    }, 
    { 
    name: 'weekaverage', 
    data: [1.33333333333333, 0.194758246723904, 1.43618513323983, 0.923262727610554, 0.67394482002558, 0.722973507315144, 0.576413277444205] 
    }, { 
    name: 'monthaverage', 
    data: [1.53571428571429, 0.601273296708939, 0.998426393184655, 0.769477297163179, 0.670944920469891, 0.69689774371321, 0.693495281755596] 
    } 
]. 

All I‘ m doing gruppiert die dayaverage, weekaverage und monthaverage Werte in ein Array und gibt an, was sie mit einem Namen Schlüssel-Wert-Paar sind.

Ich habe Probleme, dies zu schreiben, weil die Elternfunktion mit einer Liste von Kriterien aufrufen wird (für das obige Beispiel war es: criteria = ['dayaverage', 'weekaverage', 'monthaverage'];) und das könnte sich ändern.

Jede Hilfe dankbar, danke

Antwort

2

Sie könnten ein Array für die gewünschten Eigenschaften verwenden, und ein Array mit den Daten, auf aufzubauen.

function getGrouped(array, groups) { 
 
    var grouped = groups.map(function (a) { 
 
      return { name: a, data: [] }; 
 
     }); 
 

 
    array.personas.forEach(function (a) { 
 
     groups.forEach(function (k, i) { 
 
      grouped[i].data.push(a[k]); 
 
     }); 
 
    }); 
 
    return grouped; 
 
} 
 

 
var data = { personas: [{ category: "Persona1", month: 6, week: 24, day: 18, dayaverage: 0.5, weekaverage: 1.33333333333333, monthaverage: 1.53571428571429 }, { category: "Persona2", month: 6, week: 24, day: 18, dayaverage: 0.146477031224456, weekaverage: 0.194758246723904, monthaverage: 0.601273296708939 }, { category: "Persona3", month: 6, week: 24, day: 18, dayaverage: 1.25559947299078, weekaverage: 1.43618513323983, monthaverage: 0.998426393184655 }, { category: "Persona4", month: 6, week: 24, day: 18, dayaverage: 0.799332962757087, weekaverage: 0.923262727610554, monthaverage: 0.769477297163179 }, { category: "Persona5", month: 6, week: 24, day: 18, dayaverage: 0.669041769041769, weekaverage: 0.67394482002558, monthaverage: 0.670944920469891 }, { category: "Persona6", month: 6, week: 24, day: 18, dayaverage: 0.656381486676017, weekaverage: 0.722973507315144, monthaverage: 0.69689774371321 }, { category: "Persona7", month: 6, week: 24, day: 18, dayaverage: 0.540495407737267, weekaverage: 0.576413277444205, monthaverage: 0.693495281755596 }] }; 
 

 
console.log(getGrouped(data, ['day', 'dayaverage', 'weekaverage', 'monthaverage']));
.as-console-wrapper { max-height: 100% !important; top: 0; }

1

Sie können zusammen mit .reduce() dies mit .map() tun wie so:

, auch dynamische Eigenschaften zu verwenden, Sie Klammer Syntax ([]) für den Zugriff auf Eigenschaften auf verwenden können ein Objekt. Hier können Sie .map() Ihre Kriterienliste in die gewünschte Struktur auflisten und die Daten mit .reduce() berechnen.

EDIT - Datenstruktur befestigt resultierenden genau gewünschte Ausgabeergebnisse

var personas = [{ 
 
    "category": "Persona1", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.5, 
 
    "weekaverage": 1.33333333333333, 
 
    "monthaverage": 1.53571428571429 
 
    }, 
 
    { 
 
    "category": "Persona2", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.146477031224456, 
 
    "weekaverage": 0.194758246723904, 
 
    "monthaverage": 0.601273296708939 
 
    }, 
 
    { 
 
    "category": "Persona3", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 1.25559947299078, 
 
    "weekaverage": 1.43618513323983, 
 
    "monthaverage": 0.998426393184655 
 
    }, 
 
    { 
 
    "category": "Persona4", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.799332962757087, 
 
    "weekaverage": 0.923262727610554, 
 
    "monthaverage": 0.769477297163179 
 
    }, 
 
    { 
 
    "category": "Persona5", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.669041769041769, 
 
    "weekaverage": 0.67394482002558, 
 
    "monthaverage": 0.670944920469891 
 
    }, 
 
    { 
 
    "category": "Persona6", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.656381486676017, 
 
    "weekaverage": 0.722973507315144, 
 
    "monthaverage": 0.69689774371321 
 
    }, 
 
    { 
 
    "category": "Persona7", 
 
    "month": "6", 
 
    "week": "24", 
 
    "day": "18", 
 
    "dayaverage": 0.540495407737267, 
 
    "weekaverage": 0.576413277444205, 
 
    "monthaverage": 0.693495281755596 
 
    } 
 
]; 
 
var criteria = ['dayaverage', 'weekaverage', 'monthaverage']; 
 

 
function getMerged(objArr, criteria) { 
 
    var dataMap = objArr.reduce(function (result, current) { 
 
     criteria.forEach(function (elem) { 
 
      if (result[elem] != undefined) { 
 
       result[elem].push(current[elem]); 
 
      } 
 
      else { 
 
       result[elem] = [current[elem]]; 
 
      } 
 
     }); 
 
     return result; 
 
    }, {}); 
 

 
    return criteria.map(function (elem) { 
 
     return { 
 
      name: elem, 
 
      data: dataMap[elem] 
 
     }; 
 
    }); 
 
} 
 

 
console.log(getMerged(personas, criteria));

+0

kann diese Funktion nur durch Arbeit von einem Kriterien-Array wie 'var Kriterien = [ 'dayaverage', 'weekaverage'] dynamisch sein;'? wenn ich nur diese 2 für ex – Apswak

+0

@Apswak wollte Ja, ich habe meine Antwort aktualisiert, um es dynamisch zu machen. Probieren Sie die neueste Version des Codes aus. Tut mir leid, ich habe das beim ersten Durchstart verpasst – mhodges

+0

Warum der Downvote? – mhodges

0

try this:

var criteria = ['dayaverage', 'weekaverage', 'monthaverage']; //your dynamic criteria 
    var arr= []; //the filtered array you want 
    criteria.forEach(function(criterium){ 
     // for each criterium you create a new object that you add to arr 
     arr.push({ 
      name: criterium, 
      data: [] 
     }); 
     // then you populate the data field of the newly created field by browsing your big array "personas" that you need to parse before btw 
     personas.forEach(function (persona) { 
      arr[arr.length-1].data.push(persona[criterium]); 
     }); 
    }); 
1

Eine der Möglichkeiten, wie es zu lösen, Array#forEach verwenden.

var json = {personas:[{category:"Persona1",month:"6",week:"24",day:"18",dayaverage:.5,weekaverage:1.33333333333333,monthaverage:1.53571428571429},{category:"Persona2",month:"6",week:"24",day:"18",dayaverage:.146477031224456,weekaverage:.194758246723904,monthaverage:.601273296708939},{category:"Persona3",month:"6",week:"24",day:"18",dayaverage:1.25559947299078,weekaverage:1.43618513323983,monthaverage:.998426393184655},{category:"Persona4",month:"6",week:"24",day:"18",dayaverage:.799332962757087,weekaverage:.923262727610554,monthaverage:.769477297163179},{category:"Persona5",month:"6",week:"24",day:"18",dayaverage:.669041769041769,weekaverage:.67394482002558,monthaverage:.670944920469891},{category:"Persona6",month:"6",week:"24",day:"18",dayaverage:.656381486676017,weekaverage:.722973507315144,monthaverage:.69689774371321},{category:"Persona7",month:"6",week:"24",day:"18",dayaverage:.540495407737267,weekaverage:.576413277444205,monthaverage:.693495281755596}]}, 
 
    criteria = ['dayaverage', 'weekaverage', 'monthaverage'], 
 
    arr = criteria.reduce(function(s,a){ 
 
     s.push({name: a, data: []}); 
 
     return s; 
 
     }, []); 
 

 
    arr.forEach(function(v) { 
 
     json.personas.forEach(function(c) { 
 
     v.data.push(c[v.name]); 
 
     }) 
 
    }) 
 
    console.log(arr);

+0

Dies entspricht nicht der Anforderung an dynamische Kriterien, nur – mhodges

+1

@ Mhodges Ich habe meine Antwort verbessert. –

0

Sie können die Schlüssel auf ein Array von Gegenständen Karte und jedes der Objekte Werte, die durch den aktuellen Schlüssel in dem Zuordnungsprozess abzubilden.

var data = getData(); 
 
var modified = modify(data, 'personas', ['dayaverage', 'weekaverage', 'monthaverage']); 
 

 
console.log(JSON.stringify(modified, null, 2)); 
 

 
function modify(data, root, keep) { 
 
    data = data[root] != null ? data[root] : data; 
 
    var keys = Object.keys(data[0]); 
 
    if (keep != null && keep.length > 0) 
 
    keys = keys.filter(key => keep.indexOf(key) > -1); 
 
    return keys.map(key => { 
 
    return { 
 
     name: key, 
 
     data: data.map(item => item[key]) 
 
    } 
 
    }); 
 
} 
 

 
function getData() { 
 
    return { 
 
    "personas": [{ 
 
     "category": "Persona1", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.5, 
 
     "weekaverage": 1.33333333333333, 
 
     "monthaverage": 1.53571428571429 
 
    }, { 
 
     "category": "Persona2", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.146477031224456, 
 
     "weekaverage": 0.194758246723904, 
 
     "monthaverage": 0.601273296708939 
 
    }, { 
 
     "category": "Persona3", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 1.25559947299078, 
 
     "weekaverage": 1.43618513323983, 
 
     "monthaverage": 0.998426393184655 
 
    }, { 
 
     "category": "Persona4", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.799332962757087, 
 
     "weekaverage": 0.923262727610554, 
 
     "monthaverage": 0.769477297163179 
 
    }, { 
 
     "category": "Persona5", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.669041769041769, 
 
     "weekaverage": 0.67394482002558, 
 
     "monthaverage": 0.670944920469891 
 
    }, { 
 
     "category": "Persona6", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.656381486676017, 
 
     "weekaverage": 0.722973507315144, 
 
     "monthaverage": 0.69689774371321 
 
    }, { 
 
     "category": "Persona7", 
 
     "month": "6", 
 
     "week": "24", 
 
     "day": "18", 
 
     "dayaverage": 0.540495407737267, 
 
     "weekaverage": 0.576413277444205, 
 
     "monthaverage": 0.693495281755596 
 
    }] 
 
    }; 
 
}
.as-console-wrapper { top: 0; max-height: 100% !important; }

Verwandte Themen