Question

我按照简单的示例使用此Angular2-Highcharts模块

将数据设置为Highcharts

如下面example所示，我做了一些小调整，动态设置数据到Highcharts。以下是代码段：

        string ApplicationName = "My App Name";
        string[] Scopes = { DriveService.Scope.Drive, DriveService.Scope.DriveFile };

        ClientSecrets secrets = new ClientSecrets()
        {
            ClientId = ""MY_CLIENT_ID,
            ClientSecret = "MY_CLIENT_SECRET"
        };

        var token = new TokenResponse
        {
            AccessToken = "MY_ACCESS_TOKEN",
            RefreshToken = "MY_REFRESH_TOKEN"
        };

        var credentials = new UserCredential(new GoogleAuthorizationCodeFlow(
            new GoogleAuthorizationCodeFlow.Initializer
            {
                ClientSecrets = secrets
            }),
            "user",
            token);

        var service = new DriveService(new BaseClientService.Initializer()
        {
            HttpClientInitializer = credentials,
            ApplicationName = ApplicationName
        });

        return service;

Plunker link也是如此。

错误：

constructor() {
    this.options = {
      chart: { type: 'spline' },
      title: { text : 'dynamic data example'},
      series: [{ data: [2,3,5,8,13] }]
    };

    setTimeout(() => {
      this.chart.series[0].setData([21,31,51,81,13]);
    }, 3000);

    setTimeout(() => {
      this.chart.series.push({data:[]});
      this.chart.series[1].setData([100,200,300]);
    }, 5000);
}

我的观察：

该错误的明显之处在于第一个元素的ERROR TypeError: _this.chart.series[1].setData is not a function at eval (run.plnkr.co/QZBbWi3BVy3DeOzT/app/main.ts!transpiled:28)数组中没有setData函数。解决此问题的替代方法是，使用series属性的空对象初始化this.options：

data

这是非常粗糙的方式，因为我需要对constructor() { this.options = { chart: { type: 'spline' }, title: { text : 'dynamic data example'}, series: [{ data: [2,3,5,8,13] }, { data: [] }, ] }; }中的50个元素执行相同的操作，如果我看到它们动态出现

是否有任何有效且更好的方法来解决此错误？

PS：对于Highcharts来说是新手，所以如果我在基本级别做了一些完全错误的话，请耐心等待。

Answer 1

setData修改已存在的系列 - 如果您没有该系列，则无法修改它。

如果您想添加新系列，则应使用chart.addSeries()方法，如下所示：

   setTimeout(() => {
      this.chart.addSeries({
          data: [21,31,51,81,13]
      });
    }, 5000);

示例：http://plnkr.co/edit/61IgH8t3YKjtIOgzpUPB?p=preview

setData不是函数+ Angular2-Highcharts

1 个答案: