gpt4 book ai didi

javascript - 在C3.js中设置图形名称

转载 作者:行者123 更新时间:2023-12-03 10:03:46 26 4
gpt4 key购买 nike

我有一个图表,我使用以下函数在其中加载新数据:

function insertGraph(yAxis, xAxis, Header) {
setTimeout(function () {
chart.load ({
bindto: "#graph",
xs: {
'y':'x'
},
columns: [
yAxis,
xAxis
]
});
}, 100);
}

传入的 yAxis、xAxis 和 Header 值示例如下:

y 轴:

["y", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]

x轴:

["x", 0, 131.35, 26971.3, 27044.75, 27351.4, 27404.483333333334, 27419.416666666668, 33128.96666666667, 33549.13333333333, 34049.48333333333, 77464.26666666666, 77609.71666666666, 174171.85, 259166.98333333334]

标题:

MakeModeChange

一切都很好,除了加载图表时它给出数据名称“y”,我需要它有 Header (在本例中为 MakeModeChange)作为数据名称。我尝试使用 name ,如下面的代码,但什么也没发生:

function insertGraph(yAxis, xAxis, Header) {
setTimeout(function () {
console.log(Header);
console.log(yAxis);
chart.load ({
bindto: "#graph",
xs: {
'y':'x'
},
columns: [
yAxis,
xAxis
],
names: {
y: 'Header'
}
});
}, 100);
}

我还尝试将传递给 yAxis 的内容更改为如下所示:

["MakeModeChange", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]

然后将加载函数更改为如下所示:

function insertGraph(yAxis, xAxis, Header) {
setTimeout(function () {
chart.load ({
bindto: "#graph",
xs: {
Header:'x'
},
columns: [
yAxis,
xAxis
],
});
}, 100);
}

但是我收到以下错误:

Uncaught Error: x is not defined for id = "MakeModeChange".

知道如何实现这个功能吗?

最佳答案

您的 x 和 y 轴变量/数组方向是否错误?我预计 x 轴值为 1、2、3、4 等,y 轴值为 0、131.35 等

尽管如此,数组中的 y 值将是系列名称,然后使用 xs 对象指定 x 值数组。此 x 值数组的名称无关紧要。

查看/运行下面的代码片段。

function createGraph(xAxis, yAxis, Header) {

// create the xs object with a key name of the header variable
var myxs = {};
myxs[Header] = 'x';

// set the 1st position value in the yaxis to the header
yAxis[0] = Header;

c3.generate({
data: {
xs: myxs,
columns: [
xAxis,
yAxis

]
}
});
}

createGraph(
["x", 0, 131.35, 26971.3, 27044.75, 27351.4, 27404.483333333334, 27419.416666666668, 33128.96666666667, 33549.13333333333, 34049.48333333333, 77464.26666666666, 77609.71666666666, 174171.85, 259166.98333333334],
["y", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14],
"Variable Name"
);
<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 id='chart' />

关于javascript - 在C3.js中设置图形名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30463390/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com