0
私は個人的な使用のための小さなアプリのためにamchartsを使用しています。私は私が望んでいた道を働い静的ローカルコピーを得たが、私はいくつかの変更をしたとき、それはダイナミック私は364amchartsの使用とjavascriptエラーの取得
コード位置、serial.jsライン46で
SCRIPT5007: Unable to get property 'time' of undefined or null reference
を取得していない午前作るために：
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "date";
chart.balloon.bulletSize = 5;
// listen for "dataUpdated" event (fired when chart is inited) and call zoomChart method when it happens
chart.addListener("dataUpdated", zoomChart);
// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true
categoryAxis.minPeriod = "DD"; // our data is daily, so we set minPeriod to DD
categoryAxis.minorGridEnabled = true;
categoryAxis.axisColor = "#DADADA";
categoryAxis.twoLineMode = true;
categoryAxis.dateFormats = [{
period: 'fff',
format: 'JJ:NN:SS'
}, {
period: 'ss',
format: 'JJ:NN:SS'
}, {
period: 'mm',
format: 'JJ:NN'
}, {
period: 'hh',
format: 'JJ:NN'
}, {
period: 'DD',
format: 'DD'
}, {
period: 'WW',
format: 'DD'
}, {
period: 'MM',
format: 'MMM'
}, {
period: 'YYYY',
format: 'YYYY'
}];
// first value axis (on the left)
var valueAxis = new AmCharts.ValueAxis();
valueAxis.axisColor = "#FF6600";
valueAxis.axisThickness = 2;
chart.addValueAxis(valueAxis);
// GRAPHS (one per line you want to make which for us is one line per user
var users = listUsers();
var bulletList=["round", "square", "triangleUp", "triangleDown", "triangleLeft", "triangleRight", "bubble", "diamond"];
var colorList=["#00FF00", "#FF0000", "#0000FF", "#FF00FF", "#FFFF00", "#00FFFF", "#000000"];
var bulletIndex = 0;
var colorIndex = 0;
for(var user in users) {
var graph = new AmCharts.AmGraph();
graph.valueAxis = valueAxis; // we have to indicate which value axis should be used
graph.title = users[user];
graph.valueField = users[user];
graph.bullet = bulletList[bulletIndex++];
graph.hideBulletsCount = 30;
graph.bulletBorderThickness = 1;
graph.lineColor = colorList[colorIndex++];
chart.addGraph(graph);
if(bulletIndex >= bulletList.length) {
bulletIndex = 0;
}
if(colorIndex >= colorList.length) {
colorIndex = 0;
}
}
// CURSOR
var chartCursor = new AmCharts.ChartCursor();
chartCursor.cursorAlpha = 0.1;
chartCursor.fullWidth = true;
chartCursor.valueLineBalloonEnabled = true;
chart.addChartCursor(chartCursor);
// SCROLLBAR
var chartScrollbar = new AmCharts.ChartScrollbar();
chart.addChartScrollbar(chartScrollbar);
// LEGEND
var legend = new AmCharts.AmLegend();
legend.marginLeft = 110;
legend.useGraphSettings = true;
chart.addLegend(legend);
// WRITE
chart.write("chartdiv");サンプルデータ：
var allData = {
"series1" : [ {
"date" : new Date("01/05/2017"),
"Brian" : 290,
"Lisa" : 188
}, {
"date" : new Date("01/06/2017"),
"Brian" : 289,
"Lisa" : 188
}, {
"date" : new Date("01/07/2017"),
"Brian" : 288,
"Lisa" : 187
} ],
"series2" : [ {
"date" : new Date("01/05/2017"),
"Brian" : 28.9,
"Lisa" : 18.8
}, {
"date" : new Date("01/06/2017"),
"Brian" : 28.9,
"Lisa" : 18.8
}, {
"date" : new Date("01/07/2017"),
"Brian" : 28.8,
"Lisa" : 18.7
} ]
}