mpx200 / ng-dygraphs

Angular 2+ library for support of dygraphs(http://dygraphs.com) charts
MIT License
3 stars 9 forks source link

Can't get options with text to work #27

Open wgtthompson opened 5 years ago

wgtthompson commented 5 years ago

I have created a new project using ng new my-project. I followed the directions so that the following template (app.component.html) shows a chart with data and responds appropriately to the options shown.

<ng-dygraphs 
   [data]=[[1,2],[2,3],[3,0],[4,1]]
   [options]={width:-1,stepPlot:true}>
</ng-dygraphs>

If I try to use any option that has a type of string then the Digraph chart will not display. For example, if I modify the template as shown below then the chart will not render. (see [options]={width:'auto',...)

<ng-dygraphs 
   [data]=[[1,2],[2,3],[3,0],[4,1]]
   [options]={width:'auto',stepPlot:true}>
</ng-dygraphs>

In addition, putting any spaces in the original template field options will generate an error in the JS console. I do not know if this is my error in syntax but the README.md file contains the following comments which will introduce this error:

<!-- data property needs to be  defined in your controller and in native array format http://dygraphs.com/data.html#array

  data = [[new Date("2008/05/07"), 75],
          [new Date("2008/05/08"), 70],
          [new Date("2008/05/09"), 80]
         ];

  options = {width: 'auto', labels: ['Date','Temperature'], xlabel: 'X label text', ylabel: 'Y label text', title: 'Working title :)', animatedZooms: true, pointSize: 4}
-->
pierre-fromager commented 5 years ago

Hi, the way you should go is to declare a public var in your app ts component (ex:dydatas and dyoptions) and provide it to the template as below. <ng-dygraphs [data]="dydatas" [options]="dyoptions">