ember.js 如何在highcharts中刷新数据和/或重绘图表？

jbose2ul 于 2022-11-05 发布在 Highcharts

关注(0)|答案(1)|浏览(203)

我在ember组件中实现了一个highchart，方法如下

/controllers/mycontroller.js

  export default Controller.extend({
  chartData:
    [{
      name: 'Impact',
      borderWidth: 2,
      borderColor: '#FFFFFF',
      data: [],
      keys: ['x', 'y', 'v','f', 'i', 'm', 'c', 'g', 'p'],
      dataLabels: {
        enabled: true,
        color: '#000000',
        style:{
          fontSize: 14,
          fontFamily: 'arial',
          textOutline: false
        },
        formatter: function(){
          return this.point.options.feature;
        }
      }
    }],
  chartOptions: computed(function() {
    return {
      chart: {
        renderTo: 'container',
        type: 'mymap',
        events: {
          load: requestData,        -----> function that makes an api call and formats data
          redraw: true
        }

我已经启用了重绘选项，但它没有重绘，因为加载数据只发生在组件第一次加载时（在URL上），我想？
因此，我的问题是，当通过函数调用获取数据时，如何每60秒自动加载/重绘数据？

ember.js

来源：https://stackoverflow.com/questions/63639299/how-do-i-refresh-data-and-or-redraw-chart-in-highcharts

1条答案

按热度按时间

jv4diomz1#

我想您的模板中有类似{{high-charts content=chartData chartOptions=chartOptions}}的内容（或者更现代的语法<HighCharts @content={{chartData}} @chartOptions={{chartOptions}}>）？
当chartData或chartOptions发生变化时，显示的图表应该自动更新。

加载数据，进行处理以生成结构正确的chartData和chartOptions（如有必要），然后执行this.setProperties({ chartData, chartOptions });
使chartData和chartOptions成为正确的计算属性。如果你只定义了computed(function() ...而没有依赖键，ember将不会重新计算，因为没有任何东西可以触发重新计算。例如，如果你的数据请求方法更改了一个名为rawData的控制器/组件（不是同一个概念，顺便说一句！）属性，你的计算属性应该依赖于：chartData: computed('rawData', function() { ... }, .

要每60秒重新加载一次数据，只需import { later } from '@ember/runloop';并在数据加载函数自身的函数体末尾再次调度数据加载函数：

reload() {
  fetchStuff(...).then(result => this.set('rawData', result));
  later(this, () => this.reload(), 60*1000);
}

赞(0）回复(0）举报 2022-11-05

我来回答

ember.js 如何在highcharts中刷新数据和/或重绘图表？

1条答案

相关问题

热门标签

最新问答