首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用dataloader插件将JSON数据加载到AmCharts中

使用dataloader插件将JSON数据加载到AmCharts中
EN

Stack Overflow用户
提问于 2018-07-25 01:49:19
回答 1查看 44关注 0票数 0

我正在尝试使用AmCharts创建一个图表,方法是使用这个URL http://portal.eyeo.se/datapump_amchart.ashx中的dataloader插件从the服务加载JSON输出。由于某些原因,我的数据中只有几个项目是可见的,您可以在这里看到:http://portal.eyeo.se/historychart

我做错了什么?

代码如下:

代码语言:javascript
复制
<script src="amcharts/amcharts.js"></script>
<script src="amcharts//serial.js"></script>
<script src="amcharts/plugins/export/export.min.js"></script>
<script src="amcharts/plugins/dataloader/dataloader.min.js"></script> 
<link rel="stylesheet" href="amcharts/plugins/export/export.css" type="text/css" media="all" />
<script src="amcharts/themes/light.js"></script>
<!-- Chart code -->
<script>
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"dataLoader": {
"url": "datapump_amchart.ashx",
"format": "json",
"async": "True"
},
"categoryField": "timestamp",
"dataDateFormat": "YYYY-MM-DD HH:NN:SS",
"rotate": false,
"valueAxes": [{
"position": "left",
"title": "SensorVärde"
}],
"categoryAxis": {
"parseDates": true,
"minPeriod": "ss",dateformat that is wron
},
"graphs": [{
"valueField": "value1",
"id": "g1",
"bullets": "round",
"balloon": {
"drop": false,
"adjustBorderColor": false,
"color": "#ffffff",
"type": "smoothedLine"
},
"fillAlphas": 0.2,
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"bulletSize": 10,
"hideBulletsCount": 50,
"lineThickness": 5,
"title": "red line",
"useLineColorForBulletBorder": true,
"valueField": "value1",
"fillAlphas": 0.4,
"balloonText": "<div style='margin:5px; font-size:10px;'>Sensorvärde:<b>[[value1]]</b></div>"

}],
"chartCursor": {
"valueLineEnabled": true,
"valueLineBalloonEnabled": true,
"cursorAlpha": 0,
"zoomable": false,
"valueZoomable": true,
"valueLineAlpha": 0.5,
"categoryBalloonDateFormat": "HH:NN:SS, DD MMMM",
"cursorPosition": "mouse"
},
"chartScrollbar": {
"graph": "g1",
"scrollbarHeight": 80,
"backgroundAlpha": 0,
"selectedBackgroundAlpha": 0.1,
"selectedBackgroundColor": "#888888",
"graphFillAlpha": 0,
"graphLineAlpha": 0.5,
"selectedGraphFillAlpha": 0,
"selectedGraphLineAlpha": 1,
"autoGridCount": true,
"color": "#AAAAAA"
},
"export": {
"enabled": true
},
});
</script>
<!-- HTML -->
<div id="chartdiv"></div>
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-07-25 08:16:16

问题是基于日期的数据顺序错误。当你使用the documentation中提到的parseDates时,它必须是升序的。

重要提示:如果设置为true,则数据点需要按升序预先排序。顺序不正确的数据可能会导致图表上的视觉和功能故障。

修复数据的顺序应该可以解决您的问题。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51504785

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档