2016-04-05 18 views
1

私は自分が行っているプロジェクトでハイチャートを使って遊んでいました。大規模なデータ配列を投げたときに、Highchartsが正しく表示されていましたが、MongoDBで取得したデータのグループを解析しようとしているため、表示できません。ハイチャートは角度コントローラーでグラフを表示しません

はここにある私の角度ページがGETリクエストがデータベースを呼び出し、データがウェブページに配信されるようになり、今までのデータグループsocial_tone_dataを取得するために私がしようとしていますロード

$scope.retrieveData = function(){ 
    $http.get('/calldata').then(function(response){ 
    $scope.toneDatas = response.data 
    var idArray = [] 
    angular.forEach($scope.toneDatas, function(value, key) { 
     idArray.push({id: value._id, social_tone_data: value.social_tone_data}) 
     for (var i = 0; i < idArray.length; i++) { 
     if (idArray[i].id === value._id) { 
      console.log(idArray[i].id) 
      var socialToneName = [] 
      var socialToneScore = [] 
      angular.forEach(value.social_tone_data, function(value, key) { 
      socialToneScore.push(value.tone_score) 
      socialToneName.push(value.tone_type) 
      }) 
      $("#" + value._id).highcharts({ 
      chart: { 
       type: 'bar' 
      }, 
      title: { 
       text: 'Fruit Consumption' 
      }, 
      xAxis: { 
       categories: socialToneName 
      }, 
      yAxis: { 
       title: { 
        text: 'Fruit eaten' 
       } 
      }, 
      series: [{ 
       data: socialToneScore 
      }] 
      }); 

     }; 
     }; 
    }) 
    }); 
}; 

グラフに表示する。私はmongoデータベースに19のドキュメントを持っていて、ループが完了するたびに1つのチャートが生成され、私のウェブページに提供されるようにしたい。私は19のチャートが必要です。私はまだコードで遊んでいますが、どんな助けもありがとうございます。

UPDATE

私は角指令を通じて私のコードをリファクタリングし、ページに表示する要素の引数を使用していました。

+1

コンソールにエラーがありますか? for(var i = 0; i sdfacre

+2

あなたのチャートをレンダリングする方法のコードを提供することができますか? CodepenまたはJSBinを提供できますか? – Rishab777

+0

@sdfacreエラーメッセージは表示されず、すべてのデータが必要に応じて印刷されます。私はそれが実際には、ループのグラフのインスタンスを作成しようとしていると思う – wariofan1

答えて

1

Some good info using NG-Highcharts

他の人が言ったように、更新プログラムが角度ダイジェストループの外にあるので、コントローラ& defではなく、dom要素を変更するためのディレクティブを使用します。

あなたの例では、関連テンプレート/ html codeが必要です。

関連する問題