2017-06-29 10 views
0

サービスから受信した気象情報を使用して、chart.jsを使用してグラフを作成しようとしています。Angular 2、chart.js、jsonデータを使用した天気グラフ

私は自分のプロジェクトにChartをインポートしました。静的なデータを使ってChartを使用することはできますが、jsonから取得したデータは使用できません。 ngOnInit

にアクティブにされた私は、JSONから受け取る情報は、次のようになります)

getForeCast() 
{ 
    this.weatherService.getForecastByCityName(this.searchString) 
     .subscribe(response => 
     { 
      this.lineChartData = response.list.main.temp; 
      this.lineChartLabels = response.list.dt; 
     }) 
} 

//LineChart 
public lineChartData: Array<any> 
public lineChartLabels: Array<any> 

getforecast(::

{ 
    "cod": "200", 
    "message": 0.0054, 
    "cnt": 35, 
    "list": [ 
     { 
      "dt": 1498748400, 
      "main": { 
       "temp": 21.87, 
       "temp_min": 21.25, 
       "temp_max": 21.87, 
       "pressure": 1006.93, 
       "sea_level": 1009.32, 
       "grnd_level": 1006.93, 
       "humidity": 62, 
       "temp_kf": 0.62 
      }, 
      "weather": [ 
       { 
        "id": 803, 
        "main": "Clouds", 
        "description": "broken clouds", 
        "icon": "04d" 
       } 
      ], 
      "clouds": { 
       "all": 56 
      }, 
      "wind": { 
       "speed": 6.81, 
       "deg": 227.001 
      }, 
      "rain": {}, 
      "sys": { 
       "pod": "d" 
      }, 
      "dt_txt": "2017-06-29 15:00:00" 
     }, 
何私は現在、このようになりますしようとしています

私はテーブルにそれを表示する情報を使用する場合、それは動作しますが、私はそれをグラフで動作するように取得することはできません。

答えて

0

図表update()の方法を見てください。おそらく、チャートを再レンダリングするためにデータを更新した後にトリガする必要があります。

関連する問題