2015-06-03 2 views
1

У меня есть api, который возвращает мне несколько массивов, которые я должен разместить на диаграмме c3. Кажется, я умею хорошо рисовать, но если я начну проходить в кратных, он начнет пригодиться. Я сделал некоторые поиски, но из того, что я видел, мне нужно быть более динамичным, чем вызывать имена определенных переменных в данных, потому что я не знаю, сколько у меня будет в любой момент времени.Передача нескольких массивов на график c3

Мой код вид выглядит как этот

array1 = []; 
array2 = []; 
array 3 = []; 
Data = ?; 
c3.generate({ 
bindto: '.timeline', 
        data:{ 
         columns: [ 
          Data, 
         ], 
         axes: { 
          data2: 'x' // ADD 
         } 
        }, 
        axis: { 
         y: { 
          label: { // ADD 
           text: 'Waiting', 
           position: 'outer-middle' 
          } 
         }, 
         x: { 
          type: 'category', 
          categories: hour, 
          show: true, // ADD 
          label: { // ADD 
           text: '', 
           position: 'outer-center' 
          } 
         } 
        } 
       }); 

я видел вокруг, чтобы сделать что-то вроде этого

columns: [ 
      Data1, 
      Data2, 
      Data3 
], 

Есть ли способ, что я могу поместить эти массивы в одну переменную, чтобы перейти в c3-граф? Я попытался сделать массив массивов и передать это. Я также попытался поместить их в объект, но это просто взорвало его. Любая помощь будет оценена!

+0

Если вы сделаете массив массивов, он должен работать, как показано в работе, например, в ответ я дал ниже. Если вы не публикуете фактические данные для array1, array2 и array3, я не могу сказать, имеют ли они правильные данные, чтобы заставить график работать. (У вашего кода также есть 'array 3' вместо' array3' как имя переменной, поэтому я предполагаю, что это не 100% фактический код, который вы используете). Можете ли вы опубликовать данные своего кода/массива или сообщить мне, где ответ, который я дал, не работает на вас? – Sean

ответ

2

Должно быть довольно прямолинейно, чтобы получить три массива в массив массивов, который является массивом columns.

var array1 = ['data1', 30, 200, 100, 400, 150, 250]; 
 
var array2 = ['data2', 50, 20, 10, 40, 15, 25]; 
 
var array3 = ['data3', 230, 190, 300, 500, 300, 400]; 
 
var Data = [array1, array2, array3]; 
 

 
c3.generate({ 
 
    bindto: '.timeline', 
 
    data: { 
 
    columns: Data 
 
    } 
 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
<div class='timeline' />

+0

Спасибо за ответ! Мой код действительно работал, но я не мог его видеть, потому что все они разделяли одну и ту же категорию, и все значения были равны 0, поэтому он выглядел так, как будто рисовалась только первая строка. – zazvorniki

Смежные вопросы