我正在尝试将数据传递到dataProvider
中的Amcharts
。因为我的目标是根据用户的输入来区分数据。我尝试应用此示例中使用的概念
https://codepen.io/team/amcharts/pen/e22f40f4db023433b142f0a01d165adb
喜欢下面的代码,但无法解决为什么不起作用的情况。
<html>
<body>
<div id="chartdivLine"></div>
<!-- Resources -->
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<!-- Chart code -->
<script>
ii =250000;
mc= 2000;
years =1;
var aaR=0.05;
var aR =0.045;
var chart = AmCharts.makeChart("chartdivLine", {
"dataDateFormat": "YYYY-MM-DD",
"valueAxes": [{
"id": "v1",
"axisAlpha": 0,
"position": "left",
"ignoreAxisWidth":true,
"title": "Market Value",
}],
"graphs": [{
"id": "g1",
"title": "Above Average",
"valueField": "value1"
},
{
"id": "g2",
"title": "Average",
"valueField": "value2"
}
],
"dataProvider": getData(), // Stuck here
"categoryField": "date",
});
chart.addListener("rendered", zoomChart);
zoomChart();
function zoomChart() {
chart.zoomToIndexes(chart.dataProvider.length - 40, chart.dataProvider.length - 1);
}
function getData(){
var chartData =[];
chartData.push( {
"date":"2019-01-01",
"value1":5,
"value2":10
});
chartData.push( {
"date":"2020-01-01",
"value1":12,
"value2":11
});
chartData.push( {
"date":"2021-01-01",
"value":19,
"value2":25
} );
return chartData;
}
</script>
</body>
</html>
答案 0 :(得分:1)
您在makeChart配置对象中缺少图表的类型(请参见https://docs.amcharts.com/3/javascriptcharts/AmChart#methods)
"type": "serial",
我的调整在下面,它在笔https://codepen.io/anon/pen/QzjxOb中运行
var ii = 250000;
var mc = 2000;
var years = 1;
var aaR = 0.05;
var aR = 0.045;
var chart = AmCharts.makeChart("chartdivLine", {
"type": "serial",
"dataDateFormat": "YYYY-MM-DD",
"valueAxes": [{
"id": "v1",
"axisAlpha": 0,
"position": "left",
"ignoreAxisWidth": true,
"title": "Market Value",
}],
"graphs": [{
"id": "g1",
"title": "Above Average",
"valueField": "value1"
},
{
"id": "g2",
"title": "Average",
"valueField": "value2"
}
],
"dataProvider": getData(), // :)
"categoryField": "date",
});
chart.addListener("rendered", zoomChart);
zoomChart();
function zoomChart() {
chart.zoomToIndexes(chart.dataProvider.length - 40, chart.dataProvider.length - 1);
}
function getData() {
var chartData = [];
chartData.push({
"date": "2019-01-01",
"value1": 5,
"value2": 10
});
chartData.push({
"date": "2020-01-01",
"value1": 12,
"value2": 11
});
chartData.push({
"date": "2021-01-01",
"value1": 19,
"value2": 25
});
return chartData;
}