将多个数组传递给c3cgraph

passing multiple arrays to c3 graph

本文关键字：c3cgraph 数组      更新时间：2023-09-26

我有一个api给我返回多个数组，我必须放置在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图?我试过制作数组的数组并传递它。我也试过把它们放进一个物体里，但那也把它炸了。任何帮助将不胜感激!

应该非常直接地将三个数组转换为数组的数组，即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' />

相关文章：