ng2-charts don't show

Created on 27 Jul 2016  ·  10Comments  ·  Source: valor-software/ng2-charts

export class ChartComponent {
// lineChart
public lineChartData:Array = [
{data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A'},
{data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B'},
{data: [18, 48, 77, 9, 100, 27, 40], label: 'Series C'}
]; public lineChartLabels:Array = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
.....
in html :
but can't get the canvas;
"base-chart class="chart" ng-reflect-datasets="# [object Object],[object Object],[object Object]" ng-reflect-labels="January,February,March,April,May,June,July" ng-reflect-options="[object Object]" ng-reflect-chart-type="line" ng-reflect-colors="[object Object],[object Object],[object Object]" ng-reflect-legend="true"

Most helpful comment

@bushev yes ; set .chart {display: block; width: 100%;} .then it shows

All 10 comments

The same for me. Mouse events works fine. But the canvas is empty..

screenshot 2016-07-27 16 28 29

@bushev yes ; set .chart {display: block; width: 100%;} .then it shows

@sadydai Unfortunately, it was not help me. I switched to use a pure Chart.js

@bushev maybe add a reproduction?

Check this ng2-charts starting template: http://plnkr.co/edit/7fGsiuRjcF0M0Ffeoml2?p=preview
It may help you show the charts.

Just add chart class (as in the exmples) and make sure to pass the necessary options (the ones from example work fine):

.chart {
display: block; // or inline-block
width: 100%;
height: 100%;
}

Also, these options ([options]):

        responsive: true,
        maintainAspectRatio: false

Do folks still have an issue with ng2-charts? I have been able to get it to work, all I trying to figure now is how to chart data from a REST API url.

Since it is duplicated with https://github.com/valor-software/ng2-charts/issues/229, I will close it now.

Sounds good. I was able to get the chart to show up, however I am now
having issues trying to get it to display data from a REST API.

On Tue, Aug 30, 2016 at 12:16 AM, Hongbo Miao [email protected]
wrote:

Since it is duplicated with #229
https://github.com/valor-software/ng2-charts/issues/229, I will close
it now.


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/valor-software/ng2-charts/issues/330#issuecomment-243335411,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ASpr9D0XCfqOH3cnmuIvfLlWjcNyBRi0ks5qk7zGgaJpZM4JV5zU
.

@atorefrank I think it may be because the Change Detection dose not run when you get new data.

Check these
https://github.com/valor-software/ng2-charts/issues/291
https://github.com/valor-software/ng2-charts/issues/378

I am using REST too and works well. Let me know if you haven't figured out.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

SteeledSlagle13 picture SteeledSlagle13  ·  3Comments

grahammutter picture grahammutter  ·  4Comments

hggeorgiev picture hggeorgiev  ·  4Comments

dslima90 picture dslima90  ·  3Comments

tssobe picture tssobe  ·  4Comments