I am trying to use c3.js timeseries line chart (URL : .html). The only difference being that I am using the CDN link to the js files instead of downloading them. However I keep getting the following error
Chrome Uncaught Error: x is not defined for id = "date".
Firefox Error: x is not defined for id = "date".
throw new Error('x is not defined for id = "' + id + '".'); | ------------+
The html file is given below
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<link rel="stylesheet" type="text/css" href=".4.10/c3.css"/>
<script src=".v3.min.js"></script>
<script src=".4.10/c3.js"></script>
<script>
var dates = ['20130101', '20130102', '20130103', '20130104', '20130105', '20130106'];
var sample = [30, 200, 100, 400, 150, 250];
var chart = c3.generate({
bindto: '#chart',
data: {
x:'Dates',
x_format:'%Y%m%d',
columns: [
//['Dates'].concat(dates),
//['Sample'].concat(sample)
['date', '20130101', '20130102', '20130103', '20130104', '20130105', '20130106'],
['sample', 30, 200, 100, 400, 150, 250]
]
},
axis: {
x: {
type : 'timeseries'
}
}
});
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
I am not sure why I am getting the date related errors. I tried using actual data values in the C3 arguments as well as passing the data as variables. Any help is highly appreciated
I am trying to use c3.js timeseries line chart (URL : http://c3js/samples/timeseries.html). The only difference being that I am using the CDN link to the js files instead of downloading them. However I keep getting the following error
Chrome Uncaught Error: x is not defined for id = "date".
Firefox Error: x is not defined for id = "date".
throw new Error('x is not defined for id = "' + id + '".'); | ------------+
The html file is given below
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare./ajax/libs/c3/0.4.10/c3.css"/>
<script src="http://d3js/d3.v3.min.js"></script>
<script src="http://cdnjs.cloudflare./ajax/libs/c3/0.4.10/c3.js"></script>
<script>
var dates = ['20130101', '20130102', '20130103', '20130104', '20130105', '20130106'];
var sample = [30, 200, 100, 400, 150, 250];
var chart = c3.generate({
bindto: '#chart',
data: {
x:'Dates',
x_format:'%Y%m%d',
columns: [
//['Dates'].concat(dates),
//['Sample'].concat(sample)
['date', '20130101', '20130102', '20130103', '20130104', '20130105', '20130106'],
['sample', 30, 200, 100, 400, 150, 250]
]
},
axis: {
x: {
type : 'timeseries'
}
}
});
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
I am not sure why I am getting the date related errors. I tried using actual data values in the C3 arguments as well as passing the data as variables. Any help is highly appreciated
Share Improve this question asked May 20, 2015 at 1:17 Info2scsInfo2scs 591 silver badge9 bronze badges1 Answer
Reset to default 5Your dates array needs a first value with the name/id of the 'set', such as:
var dates = ['Dates', '20130101', '20130102', '20130103', '20130104', '20130105', '20130106'];
The data object's x property needs to match this. In the code above you've got differing values: Dates and date.
data: { x:'Dates',
You were closer with the concat attempt.
See this link: http://jsfiddle/jrdsxvys/16/
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745265887a4619453.html
评论列表（0条）