Форматирование JSON для C3.js

Question

У меня есть конкретный вывод JSON, что мне нужно преобразовать в х и у-оси для графа C3.js линии, но это, кажется, не нравится, как это в настоящее время отформатированный:

{ 
    "results": [ 
     { 
      "param": "x", 
      "val": [ 
       1, 
       2, 
       3, 
       4 
      ] 
     }, 
     { 
      "param": "y", 
      "val": [ 
       2, 
       3, 
       5, 
       6 
      ] 
     } 
    ] 
} 

Какой лучший способ преобразовать это (используя JS), чтобы он мог быть прочитан C3.

В конце концов я буду загружать несколько диаграмм линии ХУ, поэтому я предполагаю, что это собирается быть что-то вроде this sample code, но вместо того, чтобы вытягивать его из JSON:

var chart = c3.generate({ 
    data: { 
     url: '/sampleJSON', 
     mimeType: 'json', 
     xs: { 
      'param-y': 'param-x', 
      'data2': 'x2', //not sure how to name these ones differently on load, but this is a different issue 
     }, 
     columns: [ 
      ['param-x', 1, 2, 3, 4], 
      ['param-y', 2, 3, 5, 6], 
      ['x2', 30, 50, 75, 100, 120], //again just placeholder to eventually have other data 
      ['data2', 20, 180, 240, 100, 190] //again just placeholder to eventually have other data 
     ] 
    } 
}); 

Answer 1

Вместо того, чтобы использовать c3 сделать запрос json, я бы просто обработал его в три этапа.

1. Сделайте звонок json.
2. Привлечь данные к структуре c3columns хочет.
3. Создать диаграмму.

---

d3.json("sample.json", function(data) { 
    var modData = []; 
    data.results.forEach(function(d, i) { 
    var item = ["param-" + d.param]; 
    d.val.forEach(function(j) { 
     item.push(j); 
    }); 
    modData.push(item); 
    }); 
    var chart = c3.generate({ 
    data: { 
     columns: modData 
    } 
    }); 
}); 

Пример here.

Answer 2

Так ответ Марка делает всю тяжелую работу, но я подумал, что добавлю слегка измененный ответ (чтобы выделить мой комментарий к его ответу), потому что ответ Маркса использует C3 для построения двух независимых графиков, измененный код ниже показывает это построение объектов в формате JSON, как х/у cordintes:

d3.json("sample.json", function(data) { 
    var modData = []; 
    data.results.forEach(function(d, i) { 
    var item = ["param-" + d.param]; 
    d.val.forEach(function(j) { 
     item.push(j); 
    }); 
    modData.push(item); 
    }); 
    var chart = c3.generate({ 
    data: { 
     xs: { 
      'param-y':'param-x' 
     }, 
     columns: modData 
    } 
    }); 
}); 

Вы можете увидеть мои небольшие изменения его примеру here

Answer 3

Я хотел бы использовать эту страницу в качестве справки: http://c3js.org/reference.html#data-keys

Вы можете себе e, как он определяет отдельную область для конкретных ключей

keys: { 
    // x: 'name', // it's possible to specify 'x' when category axis 
    value: ['upload', 'download'], 
}