how to use AmCharts Methods in component about amcharts3-angular2 HOT 3 OPEN

Hi @rahulscp,

You do not need to call validateNow(), instead it is called for you automatically when the chart changes.

If you want to call other methods, the best way is to use the init event listener which gives you access to the chart:

const makeChart = ({ dataProvider, fillColors } : Configuration) => {
  return {
    "type": "serial",
    "theme": "light",
    ...
    "listeners": [{
      "event": "init",
      "method": function (x: any) {
        x.chart.zoomOut();
      }
    }]
  };
};

from amcharts3-angular2.

Hi, I tried to add 1 more item to the dataset but nothing changed.
Onclick() {
this.data.push({"category": "Module #6",
"segments": [{
"start": 4,
"end": 6,
"color": "#448e4d",
"task": "Gathering requirements"
}, {
"start": 7,
"end": 9,
"task": "Producing specifications"
}, {
"start": 11,
"end": 15,
"task": "Development"
}, {
"start": 16,
"end": 18,
"task": "Testing and QA"
}]})
console.log(this.data);
this.chart.dataProvider = this.data;
}
}

from amcharts3-angular2.

@QuocMinhTran As explained on the main page, if you want to make a change to your chart's configuration, you need to first make a deep copy:

// Make a copy of the existing config
this.chart = JSON.parse(JSON.serialize(this.chart));

// Change the config
this.chart.dataProvider.push(...);

Alternatively you can use a function to generate the configuration and then call that function on every change:

function makeConfig(dataProvider) {
  return {
    "type": "serial",
    "theme": "light",
    "dataProvider": dataProvider
    ...
  };
}

// Change the config
this.chart = makeConfig([...]);

The reason this is necessary is because of how Angular2 handles data updates.

from amcharts3-angular2.