【问题标题】:Highcharts doesnt work on pagination next pageHighcharts 不适用于分页下一页
【发布时间】:2015-05-18 08:50:59
【问题描述】:

我正在使用 jquery 分页。我每页显示 5 条记录。这意味着我正在展示 5 个高位图表。现在的问题是当我单击下一步按钮时。显示下一页数据,但未显示图表。当我再次单击 prev 按钮图表时没有显示。

我在不刷新页面的情况下在 div 中附加数据。

图表类型为列。

这里是代码。

https://jsfiddle.net/shgc60fq/

在数据循环中我试过了,但还是不行

    historygraphs(data.id);
    var chart = $('#contacts-history-chart-'+data.id).highcharts();

    var data2 = [5,7];
    chart.xAxis[0].setCategories(["Nov", "Dec"], true);
    chart.series[0].setData(data2,true);

【问题讨论】:

  • 很难说没有任何代码有什么问题。最好的办法是创建带有重新创建问题的 jsFiddle 演示。
  • 好的,jsFiddle 中的代码不起作用。您在 Javascript 控制台中遇到了哪些错误?
  • 问题是当我点击下一步按钮或上一个按钮时分页中的高图表不起作用它只在页面加载时起作用可能是什么问题
  • 您正尝试为它们创建 HTML 容器之前创建图表。简而言之,移动hs(data.id);$(".contacts-data").append(...);

标签: jquery highcharts pagination


【解决方案1】:

您的 Highchart 数据应重新呈现。 假设您将 highchart 数据保存在 var chart 中,您可以在完整函数中更新数据,例如:

chart.series[0].setData([1, 2, 3] );

假设你的 append 函数有一个 oncomplete 回调。

【讨论】:

  • 嗨,你能不能看看代码,让我知道为什么 highcharts 在点击下一个上一个按钮时不起作用。
  • 代码太乱了,无法快速解决,但首先你应该从成功回调中删除所有不必要的代码,只留下对数据有作用的代码。现在您在成功回调中创建一个函数,而您可以简单地使用graphAjax(data) 调用该函数并在其他地方定义该函数。所有的 highcharts 都是一样的,你唯一要改变的是数据,你可以在 ajax 函数之外创建 highchart 并在成功回调中更新每个 highchart 的数据。
  • 是的,我在数据循环中为图表创建了函数,之后我插入了这些行,但不工作 historygraphs(data.id); var chart = $('#contacts-history-chart-'+data.id).highcharts(); var data2 = [5,7]; chart.xAxis[0].setCategories(["Nov", "Dec"], true); chart.series[0].setData(data2,true);
  • 未捕获的类型错误:无法读取未定义的属性“xAxis”
  • 试试这个:chartOptions = { series: [{ data: [1,2,3] }] }; var chart = new Highcharts.Chart(chartOptions) 如果你记录你的图表变量,它会给出输出吗?如果未定义,记录 data.id 并查看是否有值
猜你喜欢
  • 2020-03-07
  • 2021-03-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多