2016-10-02 7 views
0

HighChartsを初めて使用していて、イオン化したいです。しかし、私は問題があり、私のコードで何が間違っているのかを判断しようとしています。コンソール上のは、私はそれ Highcharts error #13 and AngularJs How can I fix Highcharts error #13? についての質問を読みましたが、まだ見つからないことができ、私の問題 が、これは私のコントローラエラー:Highchartsエラー#13 ionic angle

.controller("homeController", function ($scope, $http) { 
$scope.myDropDown = 'one'; 
     $scope.data = {}; 
     $scope.submit = function() { 
      var diagramlink = 'http://fendypradana.com/alfalahkeu/Apifalah/laporhari/format/json'; 

      var processed_json = [], kategori = []; 
      $http.post(diagramlink, { tanggalawal: $scope.data.tglawal, tanggalakhir: $scope.data.tglakhir }).then(function (res) { 

       console.log(res.data); 
       console.log(res.data.data[2].tanggal); 

       for (i = 0; i < res.data.data.length; i++) { 
        var dataint = parseInt(res.data.data[i].total) 
        processed_json.push(dataint); 
        kategori.push(res.data.data[i].tanggal); 

       } 
       console.log(processed_json) 

       Highcharts.chart('containerhome', { 
        title: { 
         text: 'Diagram Pembayaran' 
        }, 

        xAxis: { 
         title: { 
          text: 'coba1' 
         }, 
         categories: kategori 
        }, 

        tooltip: { 
         formatter: function() { 
          return '<b>' + this.x + '</b><br/>' + 
           'Total Pembayaran: Rp.' + Highcharts.numberFormat(this.y, 1); 
         } 
        }, 
        chart: { 
         type: 'column' 
        }, 

        plotOptions: { 

        }, 

        series: [ 
         { 
          name: 'coba', 
          data: processed_json, 

          dataLabels: { 
           enabled: true, 
           rotation: -90, 
           color: '#FFFFFF', 
           align: 'right', 
           x: 4, 
           y: 10, 
           style: { 
            fontSize: '13px', 
            fontFamily: 'Verdana, sans-serif' 
           } 
          } 
         } 

        ] 
       }); 
      }) 
     } 
    }) 

であり、これは私のhtml

ある this

のようないくつかのエラーメッセージを表示します

<div ng-app ng-controller="homeController"> 
      <select ng-model="myDropDown"> 
     <option value="one">One</option> 
     <option value="two">Two</option> 
     <option value="three">Three</option> 
</select> 
      <form ng-submit="submit()" ng-show="myDropDown == 'two'"> 
    <label class="item item-input item-stacked-label"> 
        <span class="input-label">Pilih Bulan Awal</span> 
        <input type="date" ng-model="data.tglawal"> 
    </label> 
    <label class="item item-input item-stacked-label"> 
        <span class="input-label">Pilih Bulan akhir</span> 
        <input type="date" ng-model="data.tglakhir"> 
    </label> 
    <input class="button button-block button-positive" type="submit" name="submit" value="Submit to server"> 
    <div class="card" style="width:95%; ng-controller=" homeController "> 
      <div id="containerhome ">Placeholder for chart</div> 
    </div> 
    </form> 

どのような提案が本当に役に立ちます。

+0

プランナーを作成できますか? – Sajeetharan

+0

@Sajeetharan here http://plnkr.co/edit/rBB3moEVjMP94xgSWOPP?p=preview –

+0

あなたのプランナーには欠けている参考文献がたくさんあります。チームビューアを用意する – Sajeetharan

答えて

0

私はあなたのコードを経て、問題はあなたがhighcharts-NGを使用してデータをバインドするためにjqueryの方法を使用しているで、

これを行うと、コントローラ内部で、

$scope.highchartsNG = { 
     options: { 
      chart: { 
       type: 'bar' 
      } 
     }, 
     series: [{ 
      data: assign your data 
     }], 
     title: { 
      text: 'Hello' 
     }, 
     loading: false 
    } 

設定を定義しますHTML:

<highchart id="chart1" config="highchartsNG"></highchart> 
+0

あなたが私の問題を解決した偉大な答えはありがとうございます –

+0

あなたは歓迎です – Sajeetharan

関連する問題