Angular2 HTTP Providers, Get JSON String for Amcharts

Question

These are a little dirty questions. Although it seems like I'm asking a question about amCharts, I'm just trying to figure out how to extract an array from an HTTP request and then turn it into a variable and put into 3-way javacript.

It all starts here with this question that AmCharts has kindly answered.

As seen from plnker . The schedule is working. The data for the chart is hardcoded:

`var chartData = [{date: new Date(2015,2,31,0,0,0,       0),value:372.10,volume:2506100},{date: new Date(2015,3,1,0, 0, 0, 0),value:370.26,volume:2458100},{date: new Date(2015,3,2,0, 0, 0, 0),value:372.25,volume:1875300},{date: new Date(2015,3,6,0, 0, 0, 0),value:377.04,volume:3050700}];`

So, we know that part of amCharts works. Know where the problem is changing hardcoded data to a json request, so it can be dynamic. I don’t think it should be extremely difficult, but for the life of me I can’t figure out how to do it.

The first problem is that I cannot find the documentation for .map, .subscribe or .observable.

So here is a plunker that looks very similar to the first, however it does have http and injection providers. This broke because I cannot figure out how to pull data from a service to place it in the AmCharts function. I know how to extract data from the http provider and display it in the template using NgFor, but I do not need it in the template (view). As you can see, I will be able to transfer data from the service using the getTitle () function.

    this.chart_data =_dataService.getEntries();
    console.log('Does this work? '+this.chart_data);

    this.title = _dataService.getTitle();
    console.log('This works '+this.title);

    // Transfer the http request to chartData to it can go into Amcharts
    // I think this should be string?
    var chartData = this.chart_data;

, , , . , options.json, json ? ? , - /?

Answer 1

. , . , , .

-,

this.chart_data =_dataService.getEntries().subscribe((data) => {
    this.chart_data = data; 
});

subscribe , this.chart_data . , , , subscribe, http. , , .

_dataService.getEntries().subscribe((data) => {

      if (AmCharts.isReady) {
        this.createStockChart(data);
      } else {
        AmCharts.ready(() => this.createStockChart(data));
      }
});

, , . JSON date, , , , ( , ) Date, . , Date. Date.

, eval (, , !)

let chartData = [];
   for(let i = 0; i < data[0].chart_data.length; i++) {
       chartData.push({
          // FOR SHOWING PURPOSES ONLY, DON'T TRY IT AT HOME
          // This will parse the string to an actual Date object
          date : eval(data[0].chart_data[i].date);
          value : data[0].chart_data[i].value;
          volume : data[0].chart_data[i].volume;
   });
 }

, , , , .

json, (new Date('YOUR DATE')).toJSON(), Date new Date(yourJSON) (referece Date.prototype.toJSON() - MDN). , . , ,

// The date property in your json file should be stringified using new Date(...).toJSON()
date : new Date(data[0].chart_data[i].date);

plnkr eval. , JSON , .

, .

Answer 2

getEntries DataService , , :

_dataService.getEntries().subscribe(
  (data) => {
    this.chart_data = data;
  });

, HTTP-. http.get (- "" ) . getEntries , ...

getTitle - , , .