angularjs - Angular Chart.js not displaying Chart (Legend is Displaying) -
i using angular-chart.js package: http://jtblin.github.io/angular-chart.js/
when load page, legend @ bottom of page shows, chart not displayed.
i added divs verify data populated. here code have far:
<div> <span> vm.bvpsdata - </span> {{vm.bvpsdata | json}} </div> <div> <span> vm.bvpslabels - </span>{{vm.bvpslabels | json}} </div> <div> <span> vm.bvpsseries - </span>{{vm.bvpsseries | json}} </div> <canvas id="bvpschart" class="chart chart-line" data-data="vm.bvpsdata" data-labels="vm.bvpslabels" data-legend="true" data-series="vm.bvpsseries"> </canvas>
when run page , @ code, rendered in html:
<div class="ng-binding"><span>vm.bvpsdata -</span>[ [ "6.88", "6.95", "4.31", "4.33", "4.45", "4.49", "4.16", "4.04", "3.92", "3.61", "3.68", "3.55", "3.21", "3.38", "3.62", "3.98", "3.86", "3.66", "3.87", "4.15", "4.41", "4.59", "4.95", "5.15", "5.22", "5.40", "5.66", "6.28", "6.68", "7.00", "7.57", "8.08", "7.79", "8.10", "8.59", "9.10", "9.33", "9.68", "10.14", "10.45", "10.74", "10.80", "11.07", "10.94" ] ]</div> <div class="ng-binding"><span>vm.bvpslabels -</span>[ "06/2004", "09/2004", "12/2004", "03/2005", "06/2005", "09/2005", "12/2005", "03/2006", "06/2006", "09/2006", "12/2006", "03/2007", "06/2007", "09/2007", "12/2007", "03/2008", "06/2008", "09/2008", "12/2008", "03/2009", "06/2009", "09/2009", "12/2009", "03/2010", "06/2010", "09/2010", "12/2010", "03/2011", "06/2011", "09/2011", "12/2011", "03/2012", "06/2012", "09/2012", "12/2012", "03/2013", "06/2013", "09/2013", "12/2013", "03/2014", "06/2014", "09/2014", "12/2014", "03/2015" ]</div> <div class="ng-binding"><span>vm.bvpsseries -</span>[ "book value per share" ]</div> <div class="chart-container"> <canvas id="bvpschart" class="chart chart-line ng-isolate-scope" data-data="vm.bvpsdata" data-labels="vm.bvpslabels" data-legend="true" data-series="vm.bvpsseries" width="929" height="0" style="width: 929px; height: 0px;"></canvas> <chart-legend> <ul class="line-legend"> <li><span style="background-color:rgba(151,187,205,1)"></span>book value per share</li> </ul> </chart-legend> </div>
what doing wrong? why chart not displaying?
i fixed problem. had chart canvas in div ng-show , kept hidden until stock selected.
i changed ng-if , worked perfect after that.
Comments
Post a Comment