2016-03-17 60 views
2

我有以下數據集:d3.js映射數據集到一個新的使用不同的密鑰

dataset = [ 
    { 
    'date': '2015-11-11T19:15:00.000Z' 
    'cpu': 13 
    'ram': 128 
    'sessions': 1367 
    } 
    { 
    'date': '2015-11-11T19:16:00.000Z' 
    'cpu': 70 
    'ram': 128 
    'sessions': 3567 
    } 
    { 
    'date': '2015-11-11T19:17:00.000Z' 
    'cpu': 25 
    'ram': 250 
    'sessions': 567 
    } 
    { 
    'date': '2015-11-11T19:18:00.000Z' 
    'cpu': 20 
    'ram': 120 
    'sessions': 4567 
    } 
] 

..我想如下創建一個新的數據集:

newdataset = [ 
{ 'cpu': [ 
    {'date': '2015-11-11T19:15:00.000Z', 'value':13}, 
    {'date': '2015-11-11T19:16:00.000Z', 'value':70} 
    ] 
} 
{ 'ram': [ 
    {'date': '2015-11-11T19:15:00.000Z', 'value':128}, 
    {'date': '2015-11-11T19:16:00.000Z', 'value':128} 
    ] 
} 
{ 'sessions': [ 
    {'date': '2015-11-11T19:15:00.000Z', 'value':1367}, 
    {'date': '2015-11-11T19:16:00.000Z', 'value':3567} 
    ] 
} 
] 

雖然我對d3.js有很好的理解,我從來沒有使用過數據庫的經驗。到目前爲止,我成功地做到這一點:

multiplegroups = d3.keys(dataset[0]) 
    .filter((key) -> 
    key != 'date' 
) 

multiplegroups2 = dataset.map (o) -> 
    o.cpu 

有了這兩種功能上面我能到

Array [ "cpu", "ram", "sessions" ] 

Array [ 13, 70, 25, 20 ] 

事情剩下要做的就是以某種方式運行第二個功能每個鍵的x3次並將這些值數組附加到由第一個函數生成的數組中的鍵。

我試圖做到這一點的原因是一個小的倍數圖。我的意思是我可以使用第二個函數手動生成3個不同的數組並單獨使用它們,但是我確定有更好/更快的方法來完成它。

回答

1

在D3,你可以做這樣的:

var dataset = [{ 
 
    'date': '2015-11-11T19:15:00.000Z', 
 
    'cpu': 13, 
 
    'ram': 128, 
 
    'sessions': 1367 
 
    }, { 
 
    'date': '2015-11-11T19:16:00.000Z', 
 
    'cpu': 70, 
 
    'ram': 128, 
 
    'sessions': 3567 
 
    }, { 
 
    'date': '2015-11-11T19:17:00.000Z', 
 
    'cpu': 25, 
 
    'ram': 250, 
 
    'sessions': 567 
 
    }, { 
 
    'date': '2015-11-11T19:18:00.000Z', 
 
    'cpu': 20, 
 
    'ram': 120, 
 
    'sessions': 4567 
 
    }], 
 

 

 

 
    multiplegroups = d3.keys(dataset[0]) 
 
    .filter(function(key) { 
 
    return key != "date"; //get all not date key 
 
    }).map(function(d) { 
 
    var ob = {};//iterate on non date keys 
 
    ob[d] = dataset.map(function(d1) { 
 
\t \t //iterate on full data to pluck our desired value 
 
     return { 
 
     date: d1.date, 
 
     value: d1[d] 
 
     }; 
 
    }); 
 
    return ob; 
 
    }); 
 

 
document.write('<pre>' + JSON.stringify(multiplegroups, 0, 4) + '</pre>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

+1

謝謝,我知道我足夠接近,但不知道如何合併這兩個功能:) – scooterlord

1

用簡單的Javascript,你可以寫這個。

var dataset = [{ 'date': '2015-11-11T19:15:00.000Z', 'cpu': 13, 'ram': 128, 'sessions': 1367 }, { 'date': '2015-11-11T19:16:00.000Z', 'cpu': 70, 'ram': 128, 'sessions': 3567 }, { 'date': '2015-11-11T19:17:00.000Z', 'cpu': 25, 'ram': 250, 'sessions': 567 }, { 'date': '2015-11-11T19:18:00.000Z', 'cpu': 20, 'ram': 120, 'sessions': 4567 }], 
 
    newdataset = function (array) { 
 
     var r = [], o = {}; 
 
     array.forEach(function (a) { 
 
      Object.keys(a).filter(function (a) { 
 
       return a !== 'date'; 
 
      }).forEach(function (k) { 
 
       if (!o[k]) { 
 
        o[k] = {}; 
 
        o[k][k] = []; 
 
        r.push(o[k]); 
 
       } 
 
       o[k][k].push({ date: a.date, value: a[k] }); 
 
      }); 
 
     }); 
 
     return r; 
 
    }(dataset); 
 

 
document.write('<pre>' + JSON.stringify(newdataset, 0, 4) + '</pre>');

+0

感謝您的答案,但我要尋找一個D3的解決方案 – scooterlord

相關問題