Amchart4在解析结束事件之前不显示来自JSON文件的Datatime。
创始人
2024-09-30 03:30:46
0

要解决Amchart4在解析结束事件之前不显示来自JSON文件的Datatime的问题,可以使用以下代码示例:

// 创建图表实例
var chart = am4core.create("chartdiv", am4charts.XYChart);

// 从JSON文件加载数据
chart.dataSource.url = "data.json";
chart.dataSource.parser = new am4core.JSONParser();
chart.dataSource.parser.options.dateFormat = "yyyy-MM-dd HH:mm:ss";

// 数据加载完成时的事件处理程序
chart.dataSource.events.on("parseended", function(ev) {
  // 获取解析后的数据
  var data = ev.target.data;

  // 将数据添加到图表的数据源
  chart.data = data;

  // 创建日期时间类别轴
  var dateAxis = chart.xAxes.push(new am4charts.DateAxis());

  // 配置日期时间类别轴的格式
  dateAxis.dateFormats.setKey("minute", "HH:mm");
  dateAxis.periodChangeDateFormats.setKey("minute", "HH:mm");
  dateAxis.periodChangeDateFormats.setKey("hour", "HH:mm");
  dateAxis.periodChangeDateFormats.setKey("day", "MM-dd");
  dateAxis.periodChangeDateFormats.setKey("month", "MM-dd");
  dateAxis.periodChangeDateFormats.setKey("year", "yyyy-MM");

  // 创建值类别轴
  var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());

  // 创建折线图系列
  var series = chart.series.push(new am4charts.LineSeries());
  series.dataFields.dateX = "date";
  series.dataFields.valueY = "value";

  // 创建光标
  chart.cursor = new am4charts.XYCursor();
});

// 开始加载数据
chart.dataSource.load();

在上述示例中,我们首先创建了一个图表实例,并将其数据源的URL设置为“data.json”。然后,我们使用am4core.JSONParser配置数据源解析器的日期时间格式为“yyyy-MM-dd HH:mm:ss”。

接下来,我们使用“parseended”事件处理程序来处理数据加载完成时的事件。在事件处理程序中,我们从数据源的解析结果中获取数据,并将其添加到图表的数据源中。

然后,我们创建了一个日期时间类别轴,并配置了日期时间格式。接着,我们创建了一个值类别轴和一个折线图系列,并将数据绑定到系列的日期和值字段。

最后,我们创建了一个光标来显示鼠标悬停位置的数据点的详细信息。

最后,我们调用图表的dataSource.load()方法开始加载数据。

相关内容

热门资讯

反观!pokemomo辅助软件... 反观!pokemomo辅助软件,wpk俱乐部是做什么的,一贯是真的有挂(有挂分析)一、wpk俱乐部是...
必备科技!pokermaste... 必备科技!pokermaster破解版(辅助挂)切实真的是有挂(有挂方针辅助方法)1、上手简单,内置...
专业讨论!HH平台挂(辅助挂)... 专业讨论!HH平台挂(辅助挂)总是存在有挂(存在有挂辅助软件)1、下载好脚本下载之后点击打开,先需要...
教程辅助!wepoker辅助透... 教程辅助!wepoker辅助透视软件(辅助挂)果然是有挂(存在有挂辅助插件)1、免费辅助多个强度级别...
一分钟了解!wepoker免费... 一分钟了解!wepoker免费辅助器(辅助挂)果然存在有挂(竟然有挂辅助技巧)1、该软件可以轻松地帮...
总算了解!wepoker底牌透... 总算了解!wepoker底牌透视脚本(辅助挂)竟然是有挂(确实有挂辅助攻略)1、辅助软件下载优化,底...
让我来分享经验!wpk辅助哪里... 让我来分享经验!wpk辅助哪里买(辅助挂)一贯存在有挂(证实有挂辅助技巧)1、模拟器是什么优化,俱乐...
总算明白!wejoker开挂(... 总算明白!wejoker开挂(辅助挂)真是是有挂(有挂详细辅助教程)1)有没有挂:进一步探索有辅助吗...
信息共享!pokemmo手机版... 信息共享!pokemmo手机版修改器(辅助挂)竟然存在有挂(有挂教程辅助脚本)1、下载好透视辅助下载...
玩家必备科技!wepoker有... 玩家必备科技!wepoker有辅助插件吗(辅助挂)都是存在有挂(竟然有挂辅助软件)1、免费脚本咨询教...